Skip to content

test(e2e): testids on history button + drawer + close, migrate stem result-history specs - #377

Merged
krisarmstrong merged 1 commit into
mainfrom
ci/e2e-result-history-testids
May 30, 2026
Merged

test(e2e): testids on history button + drawer + close, migrate stem result-history specs#377
krisarmstrong merged 1 commit into
mainfrom
ci/e2e-result-history-testids

Conversation

@krisarmstrong

Copy link
Copy Markdown
Collaborator

Replaces fragile getByRole assertions in result-history.spec.ts (8
sites) and history-page.spec.ts (3 sites) with stable testids. The
role-name regex selectors break under es (Spanish drawer header is
"Historial de Pruebas", title text "Open test history" maps to a
longer phrase) and under strict mode the dual close-button regex
matched two backdrop + close-button elements.

UI changes (small, additive):

  • Sidebar.tsx FullWidthDrawerButton: optional 'data-testid'?: string
    prop, forwarded to the rendered . History call site passes
    data-testid="sidebar-history-button".

  • ResultHistory.tsx: data-testid="history-drawer" on the dialog
    root and data-testid="history-drawer-close" on the X button.

Spec changes:

  • result-history.spec.ts: 8 getByRole(...) → 4 getByTestId per
    relevant element.
  • history-page.spec.ts: dropped the getByText(/latest test result snapshot|history drawer/i) and the text=/test.type|result|...
    locators which were i18n-fragile. The page-header-title testid
    (PageHeader.tsx:142, already shipped) is the durable smoke
    signal; the "renders snapshot or hint" test collapses to
    asserting the page-header is mounted (the body of the page is
    either a result card or a one-line drawer pointer — both are
    valid render states and equally well-proven by the header
    visibility).

Verifies locally with biome + tsc. Stem E2E plan S1 of 3.

…esult-history specs

Replaces fragile getByRole assertions in result-history.spec.ts (8
sites) and history-page.spec.ts (3 sites) with stable testids. The
role-name regex selectors break under es (Spanish drawer header is
"Historial de Pruebas", title text "Open test history" maps to a
longer phrase) and under strict mode the dual close-button regex
matched two backdrop + close-button elements.

UI changes (small, additive):

  - Sidebar.tsx FullWidthDrawerButton: optional `'data-testid'?: string`
    prop, forwarded to the rendered <button>. History call site passes
    `data-testid="sidebar-history-button"`.

  - ResultHistory.tsx: `data-testid="history-drawer"` on the dialog
    root and `data-testid="history-drawer-close"` on the X button.

Spec changes:

  - result-history.spec.ts: 8 getByRole(...) → 4 getByTestId per
    relevant element.
  - history-page.spec.ts: dropped the `getByText(/latest test result
    snapshot|history drawer/i)` and the `text=/test.type|result|...`
    locators which were i18n-fragile. The page-header-title testid
    (PageHeader.tsx:142, already shipped) is the durable smoke
    signal; the "renders snapshot or hint" test collapses to
    asserting the page-header is mounted (the body of the page is
    either a result card or a one-line drawer pointer — both are
    valid render states and equally well-proven by the header
    visibility).

Verifies locally with biome + tsc. Stem E2E plan S1 of 3.
@qodo-code-review

Copy link
Copy Markdown

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

@krisarmstrong
krisarmstrong enabled auto-merge (squash) May 30, 2026 14:45
@github-actions

Copy link
Copy Markdown
Contributor

License Compliance Report

All dependencies pass license compliance checks

Go Dependencies

  • Unknown: 31 package(s)
  • MIT: 26 package(s)
  • BSD-3-Clause: 16 package(s)
  • Apache-2.0: 11 package(s)
  • BSD-2-Clause: 1 package(s)

npm Dependencies

See full report in workflow artifacts

Allowed Licenses: MIT, Apache-2.0, BSD-*, ISC, CC0-1.0, MPL-2.0
Forbidden: GPL, AGPL, SSPL (strong copyleft)

@krisarmstrong
krisarmstrong merged commit 0f1117a into main May 30, 2026
27 of 28 checks passed
@krisarmstrong
krisarmstrong deleted the ci/e2e-result-history-testids branch May 30, 2026 14:48
krisarmstrong added a commit that referenced this pull request May 30, 2026
stem CI on the post-#380 main run failed with strict-mode violations
on every E2E test that calls page.getByTestId('sidebar-help-button'),
page.getByTestId('sidebar-history-button'), or page.getByTestId(
'sidebar-settings-button') — each resolving to 2 elements.

Root cause: SidebarLayout mounts SidebarBody twice as two
aside-wrapped copies of the same `body` element — a mobile copy
(`lg:hidden`) and a desktop copy (`hidden lg:flex`). The
responsive classes only toggle CSS display, not React mount, so
both copies live in the DOM regardless of viewport. SidebarFooter
inside that body emits five sidebar-*-button testids; every one of
them therefore appears twice in the DOM.

Fix: thread a `surfaceTestIds: boolean` through SidebarBody →
SidebarFooter. The mobile aside receives `body(false)`, the
desktop aside receives `body(true)`. Mobile copies drop the
sidebar-*-button data-testid attributes; desktop copies keep them.
Playwright's default 1280x720 viewport lands on the desktop aside,
so existing specs (auth, help-drawer, result-history, smoke) work
unchanged.

This is a UI-side fix rather than a test-side `.locator(':visible')`
workaround because:
  - The duplication is a UI bug that existed before E2E touched it
    (the mobile-and-desktop dual-mount predates testid migration).
  - Filtering by `:visible` in every spec would mask future genuine
    dup-testid mistakes elsewhere in the app.
  - Strict-mode is a feature we want to keep on, not work around.

No spec changes — the existing `getByTestId('sidebar-help-button')`
lookups now resolve to exactly one element. The previous "all
E2E Browser Tests pass" runs (before merge of #377/#378/#379)
were coincidental: those PRs added the testids without yet
triggering the dup; the smoke rewrite in #380 added more lookups,
which surfaced the strict-mode violation.

A follow-up will audit whether seed/niac sidebars have the same
dual-mount pattern (likely yes for seed since the layout shape is
shared); fixes there will land separately.

Co-authored-by: Kris Armstrong <kris.armstrong@icloud.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant