⚡ Sangsakala Proxy 🏠 Home
Skip to content

[Feature]: Update snapshot sticky header in UI Mode Attachments panel #43833

Open

Description

@karlhorky

🚀 Feature Request

Add an Update snapshot action to each IMAGE DIFF section in UI Mode's Attachments panel.

The existing IMAGE DIFF header would remain sticky while scrolling through the comparison, with Update snapshot replacing that screenshot's expected snapshot with the actual screenshot.

This follows existing UI Mode patterns where actions are placed in a sticky header for the content they operate on, for example the Source panel actions:

Screen.Recording.2026-08-25.at.10.56.48.mov

Example

After a failed test run with failing snapshots:

  1. Review a failed screenshot using the existing Diff / Actual / Expected views
  2. Click Update snapshot for any intentional change which should have the current snapshot replaced by the Actual snapshot
  3. Continue reviewing the remaining image diffs individually

The existing Attachments panel:

Image

The proposed action would be added to the existing IMAGE DIFF header:

IMAGE DIFF                                         Update snapshot
──────────────────────────────────────────────────────────────────
           Diff  Actual  Expected  Side by side  Slider

The header would remain sticky while scrolling through a large comparison. The action only appears for IMAGE DIFF sections, not other attachments.

Alternative designs can be seen in prior art:

Motivation

When several screenshot assertions fail, UI Mode lets you review each diff, but not update an intentional change directly from that diff.

Checked against Playwright v1.64.1: the Image diff section in UI Mode's Attachments panel still has no update action.

I'm aware that Playwright v1.56+ supports updateSnapshots in UI Mode (issue #37007 + PR #37098), but the current workflow has a few drawbacks:

  1. If users enable it before running, snapshots are updated before users know whether the changes are correct
  2. If users run tests normally to failure and review first, accepting a change requires enabling it and running the test again, which can be slow, flaky, and interrupts the review flow
  3. Because updating is run-level, other changed snapshots can be updated before users have reviewed them

History

Re-filed from #42393, which was closed in the P3-collecting-feedback cleanup (#43813). Before that, #42393 was scheduled for release:

  1. 2026-08-26: Devin Rousso (@dcrousso) opened PR feat(ui-mode): update individual snapshots #42421 (feat(ui-mode): update individual snapshots) implementing it
  2. 2026-08-31: assigned to Devin Rousso (@dcrousso), scheduled for v1.64
  3. 2026-10-02: moved from v1.64 to v1.65
  4. 2026-10-05: feat(ui-mode): update individual snapshots #42421 archived for inactivity
  5. 2026-10-20: v1.65 replaced with P3-collecting-feedback
  6. 2026-10-31: closed as not planned

Activity

  1. github-actions commented on Nov 1, 2026

    @github-actions
  2. github-actions commented on Nov 1, 2026

    @github-actions
    Contributor

    Hi, I'm the Playwright bot and I checked this request.

    Confirmed: UI Mode has no per-image update action at deb7e86201e26cb4a8e25191fce5ef2f7a28aa87. A change is proposed that adds Update snapshot to each image diff's sticky header. It copies only that actual image to its expected snapshot, without rerunning the test or changing the recorded result.

    Implementation and verification

    Completed traces store images in the trace archive, while updating a snapshot needs its original local path. The server now retains the reporter's attachment paths and resolves the selected pair using the test and result identifiers. It rejects unfinished or outdated results and missing or ambiguous pairs; the action shows errors.

    The existing should show image diff test now creates two failing screenshot assertions, scrolls a tall comparison, updates one snapshot, and checks that the other snapshot remains unchanged. A subsequent run confirms that only the other comparison still fails. The screenshot-only test also checks that no update action appears.

    • Chromium, Firefox, and WebKit screenshots: the extended test passes for each. UI Mode itself runs in Chromium, as in its existing fixtures.
    • With the implementation removed, the extended test fails because the two update buttons are absent. Restoring it makes the test pass.
    • All 38 tests in the trace, attachment, and test-update files pass.
    • The build and repository checks pass.

    Draft PR: #43835

    Triaged on Linux by the Playwright bot - agent run

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions