test(e2e): cover the profile-picture upload flow (currently test.fixme) #391

New issue

Open

opened 2026-06-30 12:24:17 +00:00 by james · 0 comments

james commented

2026-06-30 12:24:17 +00:00

Owner

Deferred from the per-domain e2e specs (#325, PR #335) and carried through #326/#327.

Gap

apps/e2e/tests/profile.spec.ts has the picture upload + remove step marked test.fixme. Root cause (verified empirically): expo-image-picker's web shim appends a hidden <input type=file> and synthetically clicks it; headless Chromium answers the file dialog with a synchronous cancel, so the shim removes the input within the same tick — setInputFiles can't win the race. The rest of the profile spec (basics edit + contact) runs; only the upload step is skipped.

Options to evaluate

Headed / xvfb project — run just the picture spec under a headed Chromium (xvfb in CI), where the file dialog behaves. Most faithful (exercises the real web upload path) but adds a CI display dependency.
API-layer coverage instead — assert the upload contract against POST /api/profile/picture (multipart) directly; apps/api/tests/api/profile.test.ts already covers it, so this may just be confirming the gap is acceptable and removing the fixme with a documented rationale.
Drive the hidden input differently — investigate whether page.on("filechooser") + pre-arming, or bypassing the shim's click, can land the file before the cancel.

Done when

Either the web upload step runs green (option 1/3) or the fixme is replaced with a documented decision pointing at the API-layer coverage (option 2). Reference apps/e2e/tests/profile.spec.ts + apps/client/lib/profile/pictureUpload.ts.

Deferred from the per-domain e2e specs (#325, PR #335) and carried through #326/#327. ## Gap `apps/e2e/tests/profile.spec.ts` has the picture **upload + remove** step marked `test.fixme`. Root cause (verified empirically): expo-image-picker's web shim appends a hidden `<input type=file>` and synthetically clicks it; **headless Chromium answers the file dialog with a synchronous `cancel`**, so the shim removes the input within the same tick — `setInputFiles` can't win the race. The rest of the profile spec (basics edit + contact) runs; only the upload step is skipped. ## Options to evaluate 1. **Headed / xvfb project** — run just the picture spec under a headed Chromium (xvfb in CI), where the file dialog behaves. Most faithful (exercises the real web upload path) but adds a CI display dependency. 2. **API-layer coverage instead** — assert the upload contract against `POST /api/profile/picture` (multipart) directly; `apps/api/tests/api/profile.test.ts` already covers it, so this may just be confirming the gap is acceptable and removing the `fixme` with a documented rationale. 3. **Drive the hidden input differently** — investigate whether `page.on("filechooser")` + pre-arming, or bypassing the shim's click, can land the file before the cancel. ## Done when Either the web upload step runs green (option 1/3) or the `fixme` is replaced with a documented decision pointing at the API-layer coverage (option 2). Reference `apps/e2e/tests/profile.spec.ts` + `apps/client/lib/profile/pictureUpload.ts`.