@johnnyboy11234/esg-idea-contest 0.3.0 → 0.3.2

package/backend/test/matrix/load_test.go

@@ -25,11 +25,23 @@ type Row struct {
 	Method      string          `json:"method"`
 	Path        string          `json:"path"`
 	Body        json.RawMessage `json:"body"`
+	Multipart   *Multipart      `json:"multipart"`
 	CSRF        string          `json:"csrf"`
+	State       string          `json:"state"`
 	OutsideSpec bool            `json:"outsideSpec"`
 	Expect      map[string]Cell `json:"expect"`
 }
 
+// Multipart is a multipart/form-data body: text parts and one file part.
+type Multipart struct {
+	Fields map[string]string `json:"fields"`
+	File   struct {
+		Field    string `json:"field"`
+		Filename string `json:"filename"`
+		Content  string `json:"content"` // "pdf": a minimal valid PDF
+	} `json:"file"`
+}
+
 // Actors in PRD §7 order. The harness has a fixture for each one it lists in
 // fixtures; a row naming any other actor fails loudly instead of passing.
 var Actors = []string{"visitor", "user", "member", "leader", "admin"}

package/backend/test/matrix/matrix_integration_test.go

@@ -3,10 +3,15 @@
 package matrix
 
 import (
+	"bytes"
+	"context"
 	"database/sql"
 	"encoding/json"
+	"errors"
 	"fmt"
+	"io"
 	"log/slog"
+	"mime/multipart"
 	"net/http"
 	"net/http/httptest"
 	"strings"
@@ -20,8 +25,11 @@ import (
 	"github.com/brian-huanggg/AwardRegistration/backend/internal/audit"
 	"github.com/brian-huanggg/AwardRegistration/backend/internal/auth"
 	"github.com/brian-huanggg/AwardRegistration/backend/internal/deadline"
+	"github.com/brian-huanggg/AwardRegistration/backend/internal/idea"
 	"github.com/brian-huanggg/AwardRegistration/backend/internal/server"
+	shareddb "github.com/brian-huanggg/AwardRegistration/backend/internal/shared/db"
 	"github.com/brian-huanggg/AwardRegistration/backend/internal/shared/dbtest"
+	"github.com/brian-huanggg/AwardRegistration/backend/internal/storage"
 	"github.com/brian-huanggg/AwardRegistration/backend/test/apispec"
 )
 
@@ -57,10 +65,21 @@ func newEnv(t *testing.T) *env {
 		Logouts: auth.LogoutHandler{Logouts: &auth.Logouts{Sessions: sessions, Audit: auditSvc}, Fail: errs.Write},
 		Me:      auth.MeHandler{Sessions: sessions, Fail: errs.Write},
 		Account: account.Handler{
-			Service: &account.Service{DB: db, Audit: auditSvc, Policy: account.StubPolicy{}},
+			Service: &account.Service{DB: db, Audit: auditSvc, Policy: account.DefaultPolicy()},
 			Fail:    errs.Write,
 		},
 		Deadline: deadline.Handler{Store: deadline.SQLStore{DB: db}},
+		Ideas: idea.Handler{
+			Service: &idea.Service{
+				DB: db, Audit: auditSvc,
+				Gate:    deadline.Gate{Store: deadline.SQLStore{DB: db}},
+				Slides:  server.IdeaSlideRules(),
+				Objects: discardObjects{},
+				Aborter: discardObjects{},
+			},
+			ExpectedFilename: storage.ExpectedFilenameBase,
+			Fail:             errs.Write,
+		},
 	}
 	chain := server.NewPublic(log, server.Mount(si),
 		auth.Middleware(sessions, server.IsPublic, log),
@@ -68,6 +87,40 @@ func newEnv(t *testing.T) *env {
 	return &env{db: db, plain: chain, checked: apispec.Load(t).Validate(t, chain)}
 }
 
+// discardObjects stands in for MinIO: the matrix is about who may call what,
+// not about storage.
+type discardObjects struct{}
+
+func (discardObjects) Put(_ context.Context, _ string, r io.Reader, _ int64, _ string) error {
+	_, err := io.Copy(io.Discard, r)
+	return err
+}
+
+// Get is never reached by the matrix rows (they download only missing Ideas).
+func (discardObjects) Get(context.Context, string) (io.ReadCloser, int64, error) {
+	return nil, 0, errors.New("matrix: no objects")
+}
+
+func (discardObjects) AbortUpload(context.Context, string, shareddb.Outcome) {}
+
+// stateDeadline is the deadline expression that puts the contest in a state.
+var stateDeadline = map[string]string{
+	"NOT_OPEN": "NULL",
+	"OPEN":     "NOW(6) + INTERVAL 1 DAY",
+	"CLOSED":   "NOW(6) - INTERVAL 1 DAY",
+}
+
+func (e *env) setState(t *testing.T, state string) {
+	t.Helper()
+	expr, ok := stateDeadline[state]
+	if !ok {
+		t.Fatalf("unknown state %q", state)
+	}
+	if _, err := e.db.Exec(`UPDATE contest_setting SET deadline = ` + expr + ` WHERE id = 1`); err != nil {
+		t.Fatal(err)
+	}
+}
+
 func (e *env) do(h http.Handler, req *http.Request) *httptest.ResponseRecorder {
 	rec := httptest.NewRecorder()
 	h.ServeHTTP(rec, req)
@@ -90,10 +143,11 @@ func (e *env) addUser(t *testing.T, empNo, role string) {
 	}
 }
 
-// actor is one caller of the matrix: its employee number and, when logged in,
-// its session cookie.
+// actor is one caller of the matrix: its employee number, account name and,
+// when logged in, its session cookie.
 type actor struct {
 	empNo   string
+	name    string
 	session *http.Cookie
 }
 
@@ -124,7 +178,7 @@ func (e *env) newActor(t *testing.T, name string) actor {
 	if rec.Code != 200 {
 		t.Fatalf("login %s: %d %s", name, rec.Code, rec.Body)
 	}
-	return actor{empNo: empNo, session: cookie(rec, auth.SessionCookie)}
+	return actor{empNo: empNo, name: "N " + empNo, session: cookie(rec, auth.SessionCookie)}
 }
 
 func cookie(rec *httptest.ResponseRecorder, name string) *http.Cookie {
@@ -161,7 +215,11 @@ func (e *env) request(t *testing.T, r Row, a actor) *http.Request {
 		body = strings.NewReader(s)
 	}
 	var req *http.Request
-	if body != nil {
+	if r.Multipart != nil {
+		buf, ct := multipartBody(t, r.Multipart, a)
+		req = httptest.NewRequest(r.Method, r.Path, buf)
+		req.Header.Set("Content-Type", ct)
+	} else if body != nil {
 		req = httptest.NewRequest(r.Method, r.Path, body)
 		req.Header.Set("Content-Type", "application/json")
 	} else {
@@ -180,9 +238,38 @@ func (e *env) request(t *testing.T, r Row, a actor) *http.Request {
 	return req
 }
 
+func multipartBody(t *testing.T, m *Multipart, a actor) (*bytes.Buffer, string) {
+	t.Helper()
+	sub := strings.NewReplacer("${actorEmpNo}", a.empNo, "${actorName}", a.name)
+	var buf bytes.Buffer
+	mw := multipart.NewWriter(&buf)
+	for k, v := range m.Fields {
+		if err := mw.WriteField(k, sub.Replace(v)); err != nil {
+			t.Fatal(err)
+		}
+	}
+	w, err := mw.CreateFormFile(m.File.Field, sub.Replace(m.File.Filename))
+	if err != nil {
+		t.Fatal(err)
+	}
+	switch m.File.Content {
+	case "pdf":
+		_, _ = w.Write([]byte("%PDF-1.7\nmatrix\n%%EOF\n"))
+	default:
+		t.Fatalf("unknown file content %q", m.File.Content)
+	}
+	if err := mw.Close(); err != nil {
+		t.Fatal(err)
+	}
+	return &buf, mw.FormDataContentType()
+}
+
 func TestPermissionMatrix(t *testing.T) {
 	e := newEnv(t)
 	for _, r := range load(t) {
+		if r.State != "" {
+			e.setState(t, r.State)
+		}
 		for _, name := range Actors {
 			want, ok := r.Expect[name]
 			if !ok {

package/backend/test/migration/pending_file_deletion_test.go

@@ -0,0 +1,46 @@
+//go:build integration
+
+package migration_test
+
+import (
+	"strings"
+	"testing"
+
+	"github.com/brian-huanggg/AwardRegistration/backend/internal/shared/dbtest"
+)
+
+func TestPendingFileDeletionRules(t *testing.T) {
+	d := dbtest.New(t)
+	ins := func(key, reason string) error {
+		_, err := d.Exec(`INSERT INTO pending_file_deletion (object_key, reason) VALUES (?, ?)`, key, reason)
+		return err
+	}
+	for _, r := range []string{"REPLACED", "DELETED", "UPLOAD_ABORTED"} {
+		if err := ins("slides/a/b.pdf", r); err != nil {
+			t.Errorf("reason %s (same key again): want accepted, got %v", r, err)
+		}
+	}
+	if err := ins(strings.Repeat("k", 128), "DELETED"); err != nil {
+		t.Errorf("128-char key: %v", err)
+	}
+	for name, c := range map[string][2]string{
+		"unknown reason":    {"slides/x.pdf", "EXPIRED"},
+		"lower-case reason": {"slides/x.pdf", "replaced"},
+		"empty key":         {"", "DELETED"},
+		"129-char key":      {strings.Repeat("k", 129), "DELETED"},
+	} {
+		if err := ins(c[0], c[1]); err == nil {
+			t.Errorf("%s: want rejected", name)
+		}
+	}
+
+	var attempts int
+	var due bool
+	if err := d.QueryRow(`SELECT attempts, next_attempt_at <= NOW(6) AND created_at <= NOW(6)
+	                        FROM pending_file_deletion WHERE reason = 'DELETED' LIMIT 1`).Scan(&attempts, &due); err != nil {
+		t.Fatal(err)
+	}
+	if attempts != 0 || !due {
+		t.Errorf("defaults: attempts=%d due=%v, want 0 and due now", attempts, due)
+	}
+}

package/docs/API/api-endpoints.md

@@ -40,6 +40,6 @@ Every write (`POST`, `PUT`, `DELETE`, including login, register and logout) MUST
 Notes:
  
 - `DELETE /ideas/{id}/members/{empNo}` works on both `PENDING` and `ACCEPTED` rows (reject or remove); `DELETE …/members/me` works on the caller's own row (withdraw or leave). `me` is never a 6-digit employee ID, so the two paths cannot collide (PRD §6.7).
-- List endpoints enforce a maximum page size of 100 (`GET /ideas`: `page`, `size`, filters, `sort`, `order`; PRD §6.6). `GET /admin/audit-logs` uses keyset pagination with `cursor` and `limit` (PRD §6.11).
+- List endpoints enforce a maximum page size of 100 (`GET /ideas`: `page`, `size`, filters, `q`, `sort`, `order`; PRD §6.6). `GET /admin/audit-logs` uses keyset pagination with `cursor` and `limit` (PRD §6.11).
 - Unknown paths: 401 without a session, 404 with one; wrong method 405; unsupported `Accept` 406 (PRD §6.1, OI-15).
 - Operations endpoints are on the management port and are not routed by the public ingress (PRD §8.3).

package/docs/API/error-codes.md

@@ -37,7 +37,7 @@ Format: RFC 9457 `application/problem+json`.
  
 - `code` is the stable contract; `detail` is English and not for display (the UI localizes by `code`).
 - With several field errors, `errors[]` lists all of them in form-field order; the top-level `code` equals `errors[0].code` when that is a registered specific code, otherwise `VALIDATION_FAILED`.
-- Generic field codes: `REQUIRED`, `INVALID_FORMAT`, `OUT_OF_RANGE`, `INVALID_ENUM`. Per-field rules (which error a field reports first) are in PRD §6.2. The password is the exception: `errors[]` lists every violated rule (PRD §6.4).
+- Generic field codes: `REQUIRED`, `INVALID_FORMAT`, `OUT_OF_RANGE`, `INVALID_ENUM`. Per-field rules (which error a field reports first) are in PRD §6.2. The password is the exception: `errors[]` lists every violated rule (PRD §6.4), each as `{ "field": "password", "code": "PASSWORD_POLICY", "rule": "<rule id>" }` in table order. `rule` appears only on these entries.
 - `requestId` is a server-generated UUID. An incoming `X-Request-Id` is reused only if it is a valid UUID. It is returned in the response header and the error body.
 - 500 responses carry only `INTERNAL_ERROR` and `requestId`: no stack traces, SQL or paths.
 - A malformed ID in a path is a 404, not a 400.

package/docs/Architecture/Architecture.md

@@ -149,7 +149,7 @@ Next deliverables: ADR drafts for the decisions below; Flyway migration plan for
 | D26 | No `job_lease` table in v1 | Idempotent operations and `SKIP LOCKED` are enough | Decided |
 | D27 | MariaDB 10.8 LTS with native `UUID` and `INET6` | Version confirmed by the owner | **Reopened** (D45) |
 | D28 | No dedicated Spring Boot 4 compatibility spike | Owner decision; risk accepted | **Superseded: no Spring in the Go backend (OI-31 closed)** (was: Decided (OI-31)) |
-| D29 | Split `slides` into `storage` (no dependency on `idea`) and `slides` (HTTP orchestration on top of `idea` + `storage`) | Removes the `idea` ↔ `slides` cycle | Decided |
+| D29 | Split `slides` into `storage` (no dependency on `idea`) and `slides` (HTTP orchestration on top of `idea` + `storage`) | Removes the `idea` ↔ `slides` cycle. `idea → storage` is allowed (Idea delete, `Sequence.md` §5); the forbidden direction is `storage → idea` | Decided |
 | D30 | Split `auth` into `account` and `auth`; `account` defines `SessionRevoker`, `auth` implements it | Smaller modules; Vault uncertainty isolated; no cycle | Decided |
 | D31 | Repositories use `JdbcClient`, hand-written SQL owned by each module, no JPA | Locking, upserts, atomic session statement and visibility query are SQL by design | **Superseded by ADR G1 (sqlc, hand-written SQL per module; intent unchanged)** (was: Decided) |
 | D32 | `shared` depends on no business module and contains no business concept | Reusable, trivially testable kernel | Decided |

package/docs/Architecture/Backend.md

@@ -52,6 +52,7 @@ Same graph and rules as `Backend.md` §2.1. Go mechanics:
 - **`SubmissionGate`** (D34, OI-18):
   - `Precheck(ctx, actor) error` — read-only;
   - `AssertOpenInTx(ctx, tx *sql.Tx, actor) error` — the `tx` parameter makes it impossible to call outside a write transaction [ADR G9].
+- **`idea → storage`** (allowed; bd 1ve): `DELETE /ideas/{id}` (`Sequence.md` §5) inserts `pending_file_deletion` in its own transaction and deletes the object after commit, so `idea` needs `storage`. `idea` declares a small interface (for example `ObjectDeleter { Delete(ctx, key string) error }`) that `storage` implements, and `main.go` injects it. `storage` still imports no `idea` (D29), so the graph stays acyclic.
 - Allowed edges are listed once in a table inside the import-graph test (§2.4) and compared with the real graph.
 ### 2.2 Package layout inside a module **[ADR G6]**
  
@@ -323,7 +324,7 @@ Same as `Backend.md` §8. The visibility query is one sqlc query in `idea/intern
  
 Same rules as `Backend.md` §9, including the Vault sync table. Go mechanics **[Proposed]**:
  
-- Background work (Vault sync, session and throttle purge) runs as goroutines started in `main.go` with a `time.Ticker` plus random jitter; each stops when the root context is cancelled at shutdown.
+- Background work (Vault sync, session and throttle purge) runs as goroutines started in `main.go` through `shared/job.Run`: a timer re-armed after each run with the interval plus a fresh random jitter (the first run also waits a random jitter), so replicas drift apart. Each stops when the root context is cancelled at shutdown, and `main` waits for it before closing the pool. No leader is elected, so every job must be idempotent and safe on several replicas at once. The auth purge (B1b-07) runs every 5 min + up to 1 min and deletes in batches of 1000 with `DELETE … LIMIT`; a deadlock or lock-wait timeout ends that table's turn without an error.
 - Readiness waits for the first successful Vault read (`atomic.Bool` read by the readiness handler).
 - The orphan-file claim (`SELECT … FOR UPDATE SKIP LOCKED`) is generated by sqlc as written (spike case c03).
 ---

package/frontend/Dockerfile

@@ -6,6 +6,8 @@ WORKDIR /repo/frontend
 COPY frontend/package.json frontend/package-lock.json ./
 RUN npm ci
 COPY testdata /repo/testdata
+# The common-password list lives with the backend rule; the register page lazy-loads the same file.
+COPY backend/internal/account/internal/passwords/common-passwords.txt /repo/backend/internal/account/internal/passwords/
 COPY frontend/ ./
 RUN npm run build
 

package/frontend/package-lock.json

@@ -46,6 +46,7 @@
         "tailwindcss": "^4.3.5",
         "typescript": "~6.0",
         "typescript-eslint": "^8.72.1",
+        "undici": "^8.12.4",
         "vite": "^8.3.6",
         "vitest": "^5.1.0",
         "vitest-axe": "^0.1.0"

package/frontend/package.json

@@ -54,6 +54,7 @@
     "tailwindcss": "^4.3.5",
     "typescript": "~6.0",
     "typescript-eslint": "^8.72.1",
+    "undici": "^8.12.4",
     "vite": "^8.3.6",
     "vitest": "^5.1.0",
     "vitest-axe": "^0.1.0"

package/frontend/src/app/App.tsx

@@ -1,18 +1,27 @@
-import { useEffect } from 'react';
+import { useCallback, useEffect } from 'react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { RouterProvider, createBrowserRouter, type DataRouter } from 'react-router';
 import { setUnauthenticatedHandler } from '@/shared/api';
 import { routes } from './router';
-import { handleSessionEnded } from './session';
+import { IdleWarning } from '@/features/auth/IdleWarning';
+import { handleSessionEnded, useMe } from './session';
 
 const queryClient = new QueryClient();
 const browserRouter = createBrowserRouter(routes);
 
+/** Mounted inside the providers so it can read `me`; ends the session like a 401 when the idle time is up. */
+function Idle({ router, client }: { router: DataRouter; client: QueryClient }) {
+  const { data: me } = useMe();
+  const onExpire = useCallback(() => handleSessionEnded(client, router), [client, router]);
+  return <IdleWarning signedIn={!!me} onExpire={onExpire} />;
+}
+
 export function App({ router = browserRouter, client = queryClient }: { router?: DataRouter; client?: QueryClient }) {
   useEffect(() => setUnauthenticatedHandler(() => handleSessionEnded(client, router)), [client, router]);
   return (
     <QueryClientProvider client={client}>
       <RouterProvider router={router} />
+      <Idle router={router} client={client} />
     </QueryClientProvider>
   );
 }

package/frontend/src/app/pages/ideaCreate.test.tsx

@@ -0,0 +1,308 @@
+import { QueryClient } from '@tanstack/react-query';
+import { render, screen, waitFor, within } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { http, HttpResponse } from 'msw';
+import { createMemoryRouter } from 'react-router';
+import { axe } from 'vitest-axe';
+import { clearCsrfToken } from '@/shared/api';
+import { problem } from '@/shared/api/mocks/problem';
+import { server } from '@/shared/api/mocks/server';
+import { initI18n, type Locale } from '@/shared/i18n';
+import { App } from '../App';
+import { routes } from '../router';
+
+const API = 'http://localhost:3000/api/v1';
+const ME = { empNo: '089290', name: '王小明', email: 'wang@example.com', role: 'USER' };
+const BASE = 'I_BSID_王小明_089290_成立供應商永續學院';
+const PDF = '%PDF-1.7\n';
+const ID = '0193a1b2-0000-7000-8000-000000000001';
+
+type State = 'OPEN' | 'CLOSED' | 'NOT_OPEN';
+
+interface Sent {
+  fields: Record<string, string>;
+  file: { name: string; size: number } | null;
+  csrf: string | null;
+}
+
+async function open({ locale = 'en', state = 'OPEN' as State } = {}) {
+  clearCsrfToken();
+  server.use(
+    http.get(`${API}/auth/me`, () => HttpResponse.json(ME)),
+    http.get(`${API}/deadline`, () => HttpResponse.json({ deadline: null, state, serverTime: '2026-11-08T00:00:00.000Z' })),
+    http.get(`${API}/auth/csrf`, () => HttpResponse.json({ token: 'tok' })),
+  );
+  await initI18n(locale as Locale);
+  const router = createMemoryRouter(routes, { initialEntries: ['/ideas/new'] });
+  const client = new QueryClient();
+  const view = render(<App router={router} client={client} />);
+  await screen.findByRole('heading', { level: 1, name: locale === 'en' ? 'Create an Idea' : '建立提案' });
+  return { router, client, user: userEvent.setup(), ...view };
+}
+
+function createReturns(respond: () => Response | Promise<Response>) {
+  const sent: Sent[] = [];
+  server.use(
+    http.post(`${API}/ideas`, async ({ request }) => {
+      const form = await request.formData();
+      const fields: Record<string, string> = {};
+      let file: Sent['file'] = null;
+      for (const [k, v] of form.entries()) {
+        if (typeof v === 'string') fields[k] = v;
+        else file = { name: v.name, size: v.size };
+      }
+      sent.push({ fields, file, csrf: request.headers.get('X-CSRF-Token') });
+      return respond();
+    }),
+  );
+  return sent;
+}
+
+type User = ReturnType<typeof userEvent.setup>;
+
+async function fillText(user: User, v: { name?: string; summary?: string } = {}) {
+  await user.selectOptions(screen.getByLabelText('Category'), 'COOL_IDEA');
+  await user.selectOptions(screen.getByLabelText('Organization'), 'BSID');
+  await user.selectOptions(screen.getByLabelText('Direction'), 'RESPONSIBLE_SUPPLY_CHAIN');
+  await user.type(screen.getByLabelText('Idea name'), v.name ?? '  成立供應商永續學院 ');
+  await user.type(screen.getByLabelText('Summary'), v.summary ?? 'Train suppliers.');
+}
+
+const pick = (user: User, name: string, content: string = PDF) => user.upload(screen.getByLabelText('Slide file'), new File([content], name));
+
+const submit = (user: User) => user.click(screen.getByRole('button', { name: 'Submit Idea' }));
+
+describe('Create Idea page: markup and accessibility', () => {
+  it('labels and requires every field; the Leader comes from the session', async () => {
+    await open();
+    for (const label of ['Category', 'Organization', 'Direction', 'Idea name', 'Summary', 'Slide file']) {
+      expect(screen.getByLabelText(label)).toBeRequired();
+    }
+    expect(screen.getByText('王小明 (089290)')).toBeInTheDocument();
+    expect(screen.getByLabelText('Slide file')).toHaveAttribute('type', 'file');
+    expect(screen.getByLabelText('Idea name')).not.toHaveAttribute('maxlength'); // counted in code points, not UTF-16
+  });
+
+  it('shows the zh-TW working-draft labels (OI-17)', async () => {
+    await open({ locale: 'zh-TW' });
+    const options = within(screen.getByLabelText('類別')).getAllByRole('option').map((o) => o.textContent);
+    expect(options).toEqual(['請選擇…', '酷點子獎', '卓越影響獎']);
+    expect(within(screen.getByLabelText('方向')).getByRole('option', { name: '關懷弱勢' })).toBeInTheDocument();
+  });
+
+  it.each(['en', 'zh-TW'] as const)('has no axe violations (%s), with the expected name and with errors shown', async (locale) => {
+    const { container, user } = await open({ locale });
+    expect((await axe(container)).violations).toEqual([]);
+    if (locale === 'en') {
+      await fillText(user);
+      expect(await screen.findByText(`${BASE}.pdf`)).toBeInTheDocument();
+      expect((await axe(container)).violations).toEqual([]);
+    }
+    await user.click(screen.getByRole('button', { name: locale === 'en' ? 'Submit Idea' : '送出提案' }));
+    expect(await screen.findByRole('alert')).toBeInTheDocument();
+    expect((await axe(container)).violations).toEqual([]);
+  });
+});
+
+describe('Create Idea page: code-point counters', () => {
+  it('count the cleaned value in code points and are linked to their field', async () => {
+    const { user } = await open();
+    const name = screen.getByLabelText('Idea name');
+    expect(name.getAttribute('aria-describedby')).toContain('name-count');
+    expect(document.getElementById('name-count')).toHaveTextContent('0 / 75 characters');
+    await user.type(name, '  😀😀  a\tb ');
+    expect(document.getElementById('name-count')).toHaveTextContent('6 / 75 characters'); // "😀😀 a b"
+    await user.type(screen.getByLabelText('Summary'), '創意\n\n😀');
+    expect(document.getElementById('summary-count')).toHaveTextContent('5 / 300 characters');
+  });
+
+  it('76 code points are rejected before any request (OUT_OF_RANGE)', async () => {
+    const { user } = await open();
+    const sent = createReturns(() => HttpResponse.json({}, { status: 201 }));
+    await fillText(user, { name: '😀'.repeat(76) });
+    expect(document.getElementById('name-count')).toHaveTextContent('76 / 75 characters');
+    await submit(user);
+    expect(await screen.findByRole('link', { name: 'Idea name: The value is out of range.' })).toBeInTheDocument();
+    expect(sent).toHaveLength(0);
+  });
+});
+
+describe('Create Idea page: expected filename (PRD §6.8, OI-21)', () => {
+  it('appears once category, org and name are given, for both extensions, from the cleaned name', async () => {
+    const { user } = await open();
+    expect(screen.getByText(/to see the expected file name/)).toBeInTheDocument();
+    await fillText(user);
+    expect(screen.getByText(`${BASE}.pdf`)).toBeInTheDocument();
+    expect(screen.getByText(`${BASE}.pptx`)).toBeInTheDocument();
+    await user.selectOptions(screen.getByLabelText('Category'), 'OUTSTANDING_IMPACT');
+    expect(screen.getByText(`O${BASE.slice(1)}.pdf`)).toBeInTheDocument();
+  });
+
+  it('the copy buttons are named and copy the full name; the result is announced', async () => {
+    const { user } = await open();
+    await fillText(user);
+    await user.click(screen.getByRole('button', { name: 'Copy the PPTX file name' }));
+    expect(await navigator.clipboard.readText()).toBe(`${BASE}.pptx`);
+    expect(screen.getByText('File name copied.')).toHaveAttribute('role', 'status');
+  });
+
+  it('a name whose expected filename exceeds 255 UTF-8 bytes is FILENAME_TOO_LONG on the name', async () => {
+    const { user } = await open();
+    const sent = createReturns(() => HttpResponse.json({}, { status: 201 }));
+    await fillText(user, { name: '創'.repeat(75) }); // 75 code points, 225 bytes in the name alone
+    await pick(user, 'x.pdf');
+    await submit(user);
+    expect(await screen.findByRole('link', { name: 'Idea name: The file name is too long.' })).toBeInTheDocument();
+    expect(sent).toHaveLength(0);
+  });
+});
+
+describe('Create Idea page: pre-check', () => {
+  it('an empty submit lists every field, focuses the summary and sends nothing', async () => {
+    const { user } = await open();
+    const sent = createReturns(() => HttpResponse.json({}, { status: 201 }));
+    await submit(user);
+    const summary = await screen.findByRole('alert');
+    await waitFor(() => expect(summary).toHaveFocus());
+    expect(within(summary).getAllByRole('link').map((l) => l.textContent)).toEqual([
+      'Category: This field is required.',
+      'Organization: This field is required.',
+      'Direction: This field is required.',
+      'Idea name: This field is required.',
+      'Summary: This field is required.',
+      'Slide file: This field is required.',
+    ]);
+    const slides = screen.getByLabelText('Slide file');
+    expect(slides).toHaveAttribute('aria-invalid', 'true');
+    expect(slides.getAttribute('aria-describedby')).toContain('slides-error');
+    await user.click(within(summary).getByRole('link', { name: /^Summary/ }));
+    expect(screen.getByLabelText('Summary')).toHaveFocus();
+    expect(sent).toHaveLength(0);
+  });
+
+  it('a name with a forbidden character: text errors only, the file is not checked yet', async () => {
+    const { user } = await open();
+    await fillText(user, { name: 'a/b' });
+    await pick(user, 'wrong.pdf');
+    await submit(user);
+    const summary = await screen.findByRole('alert');
+    expect(within(summary).getAllByRole('link').map((l) => l.textContent)).toEqual(['Idea name: The name contains characters that are not allowed.']);
+  });
+
+  it.each([
+    ['a wrong name', 'slides.pdf', PDF, `Slide file: The file name does not match the expected name. Expected: ${BASE}.pdf`],
+    ['an empty file', `${BASE}.pdf`, '', 'Slide file: The file is empty.'],
+    ['PDF bytes named .pptx', `${BASE}.pptx`, PDF, 'Slide file: This file type is not supported.'],
+  ])('%s is rejected before upload', async (_n, name, content, text) => {
+    const { user } = await open();
+    const sent = createReturns(() => HttpResponse.json({}, { status: 201 }));
+    await fillText(user);
+    await pick(user, name, content);
+    await submit(user);
+    expect(await screen.findByRole('link', { name: text })).toBeInTheDocument();
+    expect(sent).toHaveLength(0);
+  });
+});
+
+describe('Create Idea page: submit', () => {
+  it('sends one multipart request with the cleaned fields, the file and the CSRF token, then opens the new Idea', async () => {
+    const { user, router, client } = await open();
+    const detail = { id: ID, name: '成立供應商永續學院', expectedFilenameBase: BASE };
+    const sent = createReturns(() => HttpResponse.json(detail, { status: 201, headers: { Location: `/api/v1/ideas/${ID}` } }));
+    await fillText(user, { summary: ' Line 1\r\nLine 2 ' });
+    await pick(user, `${BASE}.pdf`);
+    await submit(user);
+    await waitFor(() => expect(router.state.location.pathname).toBe(`/ideas/${ID}`));
+    expect(sent).toEqual([
+      {
+        fields: { category: 'COOL_IDEA', org: 'BSID', direction: 'RESPONSIBLE_SUPPLY_CHAIN', name: '成立供應商永續學院', summary: 'Line 1\nLine 2' },
+        file: { name: `${BASE}.pdf`, size: PDF.length },
+        csrf: 'tok',
+      },
+    ]);
+    expect(client.getQueryData(['idea', ID])).toEqual(detail);
+  });
+
+  it('the button is disabled while the request is pending (no double submit)', async () => {
+    const { user, router } = await open();
+    let release!: () => void;
+    const gate = new Promise<void>((r) => (release = r));
+    const sent = createReturns(async () => {
+      await gate;
+      return HttpResponse.json({ id: ID }, { status: 201 });
+    });
+    await fillText(user);
+    await pick(user, `${BASE}.pdf`);
+    await submit(user);
+    expect(await screen.findByRole('button', { name: 'Submitting…' })).toBeDisabled();
+    release();
+    await waitFor(() => expect(router.state.location.pathname).toBe(`/ideas/${ID}`));
+    expect(sent).toHaveLength(1);
+  });
+
+  it('outside the submission window the button is disabled with a reason (not a guard)', async () => {
+    await open({ state: 'CLOSED' });
+    expect(await screen.findByText('Submissions are not open, so the Idea cannot be submitted now.')).toBeInTheDocument();
+    expect(screen.getByRole('button', { name: 'Submit Idea' })).toBeDisabled();
+    expect(screen.getByLabelText('Idea name')).toBeEnabled();
+  });
+});
+
+describe('Create Idea page: server answers', () => {
+  async function submitValid(respond: () => Response) {
+    const ctx = await open();
+    const sent = createReturns(respond);
+    await fillText(ctx.user);
+    await pick(ctx.user, `${BASE}.pdf`);
+    await submit(ctx.user);
+    return { ...ctx, sent };
+  }
+
+  it('422 FILENAME_MISMATCH shows the server’s expected name on the file field', async () => {
+    const expected = 'I_BSID_王小明_089290_Other.pdf';
+    await submitValid(() => problem(422, 'FILENAME_MISMATCH', { errors: [{ field: 'slides', code: 'FILENAME_MISMATCH', expected }] }));
+    expect(await screen.findByRole('link', { name: `Slide file: The file name does not match the expected name. Expected: ${expected}` })).toBeInTheDocument();
+  });
+
+  it('409 IDEA_DUPLICATE belongs to the name; nothing typed is lost', async () => {
+    const { router } = await submitValid(() => problem(409, 'IDEA_DUPLICATE'));
+    expect(await screen.findByRole('link', { name: 'Idea name: You already have an Idea with this name.' })).toBeInTheDocument();
+    expect(screen.getByLabelText('Idea name')).toHaveAttribute('aria-invalid', 'true');
+    expect(screen.getByLabelText('Summary')).toHaveValue('Train suppliers.');
+    expect(router.state.location.pathname).toBe('/ideas/new');
+  });
+
+  it('422 text errors map to their fields', async () => {
+    await submitValid(() =>
+      problem(422, 'VALIDATION_FAILED', {
+        errors: [
+          { field: 'direction', code: 'INVALID_ENUM' },
+          { field: 'summary', code: 'OUT_OF_RANGE' },
+        ],
+      }),
+    );
+    expect(await screen.findByRole('link', { name: 'Direction: Please choose one of the listed options.' })).toBeInTheDocument();
+    expect(screen.getByRole('link', { name: 'Summary: The value is out of range.' })).toBeInTheDocument();
+  });
+
+  it.each([
+    ['413 from the ingress (not JSON)', () => new HttpResponse('<html>413</html>', { status: 413, headers: { 'Content-Type': 'text/html' } }), 'Slide file: The file is too large (limit 5 MiB).'],
+    ['415', () => problem(415, 'UNSUPPORTED_FILE_TYPE'), 'Slide file: This file type is not supported.'],
+    ['422 EMPTY_FILE', () => problem(422, 'EMPTY_FILE'), 'Slide file: The file is empty.'],
+  ])('%s is shown on the file field', async (_n, respond, text) => {
+    await submitValid(respond);
+    expect(await screen.findByRole('link', { name: text })).toBeInTheDocument();
+  });
+
+  it('403 SUBMISSION_CLOSED is a form message and refetches the deadline, which disables the button', async () => {
+    await submitValid(() => {
+      server.use(http.get(`${API}/deadline`, () => HttpResponse.json({ deadline: null, state: 'CLOSED', serverTime: '2026-11-08T00:00:00.000Z' })));
+      return problem(403, 'SUBMISSION_CLOSED');
+    });
+    const summary = await screen.findByRole('alert');
+    expect(summary).toHaveTextContent('Submissions are closed.');
+    expect(summary).toHaveTextContent('Request ID: 6f1c2c1e-0000-4000-8000-000000000000');
+    await waitFor(() => expect(screen.getByRole('button', { name: 'Submit Idea' })).toBeDisabled());
+    expect(screen.getByText('Submissions are not open, so the Idea cannot be submitted now.')).toBeInTheDocument();
+  });
+});