[Infra]: Playwright E2E baseline 구축

.github/workflows/ci.yml

@@ -0,0 +1,42 @@
+name: CI
+
+on:
+  pull_request:
+  push:
+    branches:
+      - main
+
+permissions:
+  contents: read
+
+jobs:
+  verify:
+    name: Lint, build, and E2E smoke
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          run_install: false
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20.x
+          cache: pnpm
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Lint
+        run: pnpm lint
+
+      - name: Build
+        run: pnpm build
+
+      - name: E2E smoke
+        run: pnpm test:e2e

.gitignore

@@ -34,3 +34,8 @@ out
 .codex/skills/.system/**
 !.codex/prompts/
 !.codex/prompts/**
+
+# Playwright
+/test-results/
+/playwright-report/
+/blob-report/

package.json

@@ -7,7 +7,8 @@
     "dev": "next dev",
     "build": "next build",
     "lint": "eslint .",
-    "start": "next start"
+    "start": "next start",
+    "test:e2e": "playwright test"
   },
   "dependencies": {
     "next": "^16.2.7",
@@ -16,6 +17,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.39.4",
+    "@playwright/test": "^1.60.0",
     "@types/node": "^24.12.3",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",

playwright.config.ts

@@ -0,0 +1,24 @@
+import { defineConfig } from '@playwright/test'
+
+const PORT = Number(process.env.PLAYWRIGHT_PORT ?? 3100)
+const baseURL = `http://127.0.0.1:${PORT}`
+const startCommand = `pnpm exec next start -H 127.0.0.1 -p ${PORT}`
+
+export default defineConfig({
+  testDir: './tests/e2e',
+  timeout: 30_000,
+  expect: {
+    timeout: 5_000,
+  },
+  fullyParallel: true,
+  reporter: process.env.CI ? 'github' : 'list',
+  use: {
+    baseURL,
+  },
+  webServer: {
+    command: process.env.CI ? startCommand : `pnpm build && ${startCommand}`,
+    url: baseURL,
+    reuseExistingServer: false,
+    timeout: 120_000,
+  },
+})

tests/e2e/public-routes.spec.ts

@@ -0,0 +1,38 @@
+import { expect, test } from '@playwright/test'
+
+test.describe('public route smoke', () => {
+  test('renders the public home route', async ({ request }) => {
+    const response = await request.get('/')
+
+    expect(response.status()).toBe(200)
+    await expect(response).toBeOK()
+    const body = await response.text()
+
+    expect(body).toContain('대덕소프트마이스터고 학생을 위한 포트폴리오 플랫폼')
+    expect(body).toContain('공개 포트폴리오 예시')
+  })
+
+  test('renders a Korean public portfolio slug', async ({ request }) => {
+    const response = await request.get('/오혜민')
+
+    expect(response.status()).toBe(200)
+    await expect(response).toBeOK()
+    const body = await response.text()
+    const normalizedBody = body.replaceAll(/<!--.*?-->/g, '')
+
+    expect(normalizedBody).toContain('오혜민')
+    expect(normalizedBody).toContain('/오혜민')
+  })
+
+  test('does not treat the reserved dev slug as a public portfolio', async ({ request }) => {
+    const response = await request.get('/dev')
+
+    expect(response.status()).toBe(404)
+  })
+
+  test('does not expose the component preview in production', async ({ request }) => {
+    const response = await request.get('/dev/component-preview')
+
+    expect(response.status()).toBe(404)
+  })
+})