fix(static): 🐛 restore sample loading and harden export deployment

Author: hletrd

.github/workflows/deploy.yml

@@ -26,7 +26,12 @@ jobs:
           cache: npm
 
       - run: npm ci
-      - run: npm run build
+      - run: npx playwright install --with-deps chromium
+      - run: npm run lint
+      - run: npm run typecheck
+      - run: npm run test:e2e:dev
+      - run: npm run test:e2e:static
+      - run: npm run smoke:static
 
       - uses: actions/upload-pages-artifact@v3
         with:

.gitignore

@@ -41,6 +41,7 @@ yarn-error.log*
 
 # test results
 test-results/
+playwright-report/
 
 # review screenshots (artifacts, not source)
 review-screenshots/

README.md

@@ -180,16 +180,26 @@ Open [http://localhost:3000](http://localhost:3000).
 
 ```bash
 npx playwright install --with-deps chromium
-npx playwright test
+npm run test:e2e:dev
+npm run test:e2e:static
+```
+
+### Typecheck & Lint
+
+```bash
+npm run typecheck
+npm run lint
 ```
 
 ### Build
 
 ```bash
 npm run build
+npm run start
 ```
 
 Static output is generated in `out/` for deployment.
+`npm run start` serves the exported app at `http://localhost:3000/travelback/`.
 
 ## Deploy
 

e2e/travelback.spec.ts

@@ -64,6 +64,16 @@ test.describe('Travelback App', () => {
     await expect(page.getByText('Drop your travel file here')).toBeVisible({ timeout: 10_000 })
   })
 
+  test('loads sample trip from landing CTA', async ({ page }) => {
+    const sampleBtn = page.getByRole('button', { name: 'Try with a sample trip' })
+    await expect(sampleBtn).toBeVisible({ timeout: 10_000 })
+    await sampleBtn.click({ force: true })
+
+    await expect(page.getByText('Namsan Tower Walk')).toBeVisible({ timeout: 15_000 })
+    await expect(page.locator('text=/\\d+ \\/ \\d+ locations/').first()).toBeVisible()
+    await expect(page.getByRole('button', { name: 'Play' })).toBeVisible({ timeout: 10_000 })
+  })
+
   test('imports GPX file and displays track', async ({ page }) => {
     await uploadGpx(page)
 
@@ -304,4 +314,3 @@ test.describe('Travelback App', () => {
     await expect(page.getByText('Start Export')).toBeVisible()
   })
 })
-

eslint.config.mjs

@@ -5,6 +5,12 @@ import nextTs from "eslint-config-next/typescript";
 const eslintConfig = defineConfig([
   ...nextVitals,
   ...nextTs,
+  {
+    rules: {
+      'react-hooks/preserve-manual-memoization': 'warn',
+      'react-hooks/set-state-in-effect': 'warn',
+    },
+  },
   // Override default ignores of eslint-config-next.
   globalIgnores([
     // Default ignores of eslint-config-next:

next.config.ts

@@ -1,8 +1,13 @@
-import type { NextConfig } from "next"
+import type { NextConfig } from 'next'
+
+const basePath = process.env.NODE_ENV === 'production' ? '/travelback' : ''
 
 const nextConfig: NextConfig = {
   output: 'export',
-  basePath: process.env.NODE_ENV === 'production' ? '/travelback' : '',
+  basePath,
+  env: {
+    NEXT_PUBLIC_BASE_PATH: basePath,
+  },
   images: {
     unoptimized: true,
   },