Fix flaky mobile-safari e2e test: assert input value before click#3
Merged
evcatalyst merged 2 commits intomainfrom Mar 21, 2026
Merged
Fix flaky mobile-safari e2e test: assert input value before click#3evcatalyst merged 2 commits intomainfrom
evcatalyst merged 2 commits intomainfrom
Conversation
…efore click
Add `await expect(page.getByRole('searchbox')).toHaveValue('awful')` after
each `fill('awful')` call in tests 06–14 of the "search flow with mock API"
group. This ensures React has processed the input state update before the
Search button is clicked, preventing a WebKit race condition where the form
submit handler would exit early with an empty query value.
Co-authored-by: evcatalyst <8740078+evcatalyst@users.noreply.github.com>
Agent-Logs-Url: https://github.com/gitbrainlab/BackWords/sessions/7129578c-26bb-4fab-b875-4b5ddc2e03e6
Copilot
AI
changed the title
[WIP] Run end-to-end tests for BackWords PWA
Fix flaky mobile-safari e2e test: assert input value before click
Mar 21, 2026
There was a problem hiding this comment.
Pull request overview
This PR hardens the Playwright E2E “search flow with mock API” journey against a WebKit/mobile-safari timing race by gating form submission on the controlled React input’s value being fully applied.
Changes:
- Add
await expect(searchbox).toHaveValue('awful')immediately afterfill('awful')in tests 06–14. - Ensure the “Search” click happens only after React state has synchronized the input value.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Test 08 (
Result page shows summary banner) consistently times out on mobile-safari atwaitForURL— the search navigation never fires. Root cause: WebKit race between Playwrightfill()dispatching synthetic events and React processing the state update on a controlled input. Theclick()fires before React updatesquery, sohandleSubmitexits early on empty string.toHaveValue('awful')assertion after eachfill('awful')in tests 06–14 to gate on React state sync before clicking SearchThis pattern already exists in test 05 and is standard practice for controlled React inputs under WebKit.
Original prompt
2026-03-21T15:46:17.5012529Z ##[group]Run npm run test:e2e
2026-03-21T15:46:17.5012822Z �[36;1mnpm run test:e2e�[0m
2026-03-21T15:46:17.5064263Z shell: /usr/bin/bash -e {0}
2026-03-21T15:46:17.5064511Z env:
2026-03-21T15:46:17.5064682Z CI: true
2026-03-21T15:46:17.5064938Z PLAYWRIGHT_BASE_URL: http://localhost:4173/BackWords/
2026-03-21T15:46:17.5065256Z VITE_BASE_PATH: /BackWords
2026-03-21T15:46:17.5065480Z ##[endgroup]
2026-03-21T15:46:17.6207242Z
2026-03-21T15:46:17.6207733Z > backwords-pwa@0.1.0 test:e2e
2026-03-21T15:46:17.6208243Z > playwright test
2026-03-21T15:46:17.6208464Z
2026-03-21T15:46:19.6235212Z
2026-03-21T15:46:19.6235843Z Running 44 tests using 1 worker
2026-03-21T15:46:19.6236209Z
2026-03-21T15:46:22.1175020Z ✓ 1 [chromium] › e2e/journey.spec.ts:24:3 › BackWords PWA — full user journey › 01 – Home screen loads (399ms)
2026-03-21T15:46:22.4240881Z ✓ 2 [chromium] › e2e/journey.spec.ts:30:3 › BackWords PWA — full user journey › 02 – Curated seed grid is visible (292ms)
2026-03-21T15:46:22.8030862Z ✓ 3 [chromium] › e2e/journey.spec.ts:37:3 › BackWords PWA — full user journey › 03 – Search bar is accessible (363ms)
2026-03-21T15:46:23.1362710Z ✓ 4 [chromium] › e2e/journey.spec.ts:43:3 › BackWords PWA — full user journey › 04 – Mode picker switches modes (320ms)
2026-03-21T15:46:23.4372946Z ✓ 5 [chromium] › e2e/journey.spec.ts:50:3 › BackWords PWA — full user journey › 05 – Type in search box (288ms)
2026-03-21T15:46:24.1870436Z ✓ 6 [chromium] › e2e/journey.spec.ts:128:3 › BackWords PWA — search flow with mock API › 06 – Search "awful" navigates to result page (736ms)
2026-03-21T15:46:24.9045415Z ✓ 7 [chromium] › e2e/journey.spec.ts:137:3 › BackWords PWA — search flow with mock API › 07 – Result page shows word title (702ms)
2026-03-21T15:46:25.6181003Z ✓ 8 [chromium] › e2e/journey.spec.ts:146:3 › BackWords PWA — search flow with mock API › 08 – Result page shows summary banner (699ms)
2026-03-21T15:46:26.3231794Z ✓ 9 [chromium] › e2e/journey.spec.ts:155:3 › BackWords PWA — search flow with mock API › 09 – Result page shows Then/Now snapshots (691ms)
2026-03-21T15:46:27.1139585Z ✓ 10 [chromium] › e2e/journey.spec.ts:165:3 › BackWords PWA — search flow with mock API › 10 – Navigate to Timeline from Result (776ms)
2026-03-21T15:46:27.9539931Z ✓ 11 [chromium] › e2e/journey.spec.ts:176:3 › BackWords PWA — search flow with mock API › 11 – Timeline scrubber shows eras (825ms)
2026-03-21T15:46:28.6798671Z ✓ 12 [chromium] › e2e/journey.spec.ts:187:3 › BackWords PWA — search flow with mock API › 12 – Navigate to Source Detail from Result (714ms)
2026-03-21T15:46:29.4627072Z ✓ 13 [chromium] › e2e/journey.spec.ts:198:3 › BackWords PWA — search flow with mock API › 13 – "Ask BackWords" explain button appears (771ms)
2026-03-21T15:46:30.2008743Z ✓ 14 [chromium] › e2e/journey.spec.ts:209:3 › BackWords PWA — search flow with mock API › 14 – Back navigation returns to result (724ms)
2026-03-21T15:46:30.5694990Z ✓ 15 [chromium] › e2e/journey.spec.ts:221:3 › BackWords PWA — Settings › 15 – Settings page loads via nav (356ms)
2026-03-21T15:46:30.9183963Z ✓ 16 [chromium] › e2e/journey.spec.ts:229:3 › BackWords PWA — Settings › 16 – Mock mode toggle works (338ms)
2026-03-21T15:46:31.2708388Z ✓ 17 [chromium] › e2e/journey.spec.ts:237:3 › BackWords PWA — Settings › 17 – Palette selection works (340ms)
2026-03-21T15:46:31.6238793Z ✓ 18 [chromium] › e2e/journey.spec.ts:244:3 › BackWords PWA — Settings › 18 – Clear history button is visible (339ms)
2026-03-21T15:46:32.3316921Z ✓ 19 [chromium] › e2e/journey.spec.ts:292:3 › BackWords PWA — Curated seed cards › 19 – Click "nice" seed card navigates to result (695ms)
2026-03-21T15:46:32.9661576Z ✓ 20 [chromium] › e2e/journey.spec.ts:300:3 › BackWords PWA — Curated seed cards › 20 – Result for "nice" shows amelioration badge (620ms)
2026-03-21T15:46:33.2402930Z ✓ 21 [chromium] › e2e/journey.spec.ts:310:3 › BackWords PWA — Accessibility › 21 – Skip link is present on Home (263ms)
2026-03-21T15:46:33.5212540Z ✓ 22 [chromium] › e2e/journey.spec.ts:317:3 › BackWords PWA — Accessibility › 22 – Navigation has accessible name (269ms)
2026-03-21T15:46:42.1465404Z ✓ 23 [mobile-safari] › e2e/journey.spec.ts:24:3 › BackWords PWA — full user journey › 01 – Home screen loads (6.6s)
2026-03-21T15:46:43.1166786Z ✓ 24 [mobile-safari] › e2e/journey.spec.ts:30:3 › BackWords PWA — full user journey › 02 – Curated seed grid is visible (944ms)
2026-03-21T15:46:43.8671413Z ✓ 25 [mobile-safari] › e2e/journey.spec.ts:37:3 › BackWords PWA — full user journey › 03 – Search bar is accessible (736ms)
2026-03-21T15:46:44.7384943Z ✓ 26 [mobile-safari] › e2e/journey.spec.ts:43:3 › BackWords PWA — full user journey › 04 – Mode picker switches modes (856ms)
2026-03-21T15:46:45.4605886Z ✓ 27 [mobile-safari] › e2e/journey.spec.ts:50:3 › BackWords PWA — full user journey › 05 – Type in search box (704ms)
202...
⚡ Quickly spin up Copilot coding agent tasks from anywhere on your macOS or Windows machine with Raycast.