Comfy-Org / Comfy-Org/ComfyUI_frontend

test: add Playwright E2E scroll-handling spec for image history dropdown

Open
#10,571 0 comments 0 reactions 1 assignee Assigned to @kaili-yang View on GitHub
area:testing area:widgets
Dominant language
TypeScript
Stars
2k
Forks
699
Avg merge
1d 7h
Merged PRs (30d)
490

Description

## Summary

The unit test added in PR #10550 ([`FormDropdownMenu.test.ts`](https://github.com/Comfy-Org/ComfyUI_frontend/pull/10550#discussion_r2997073085)) asserts that `data-capture-wheel="true"` is present on the root element, but this is effectively a change-detector rather than a behavioural test.

A proper Playwright E2E spec should be added to verify that:

1. When the user scrolls (mouse-wheel) over the image history dropdown (e.g. on a **Load Image** node), the **canvas does not zoom**.
2. The dropdown list itself scrolls as expected.

## Background

- Bug report: #10549
- Fix PR: #10550

The fix works by setting `data-capture-wheel="true"` on the dropdown root so that `TransformPane` can identify elements that should consume wheel events. An E2E test would exercise the full pipeline (wheel event → TransformPane check → no zoom) rather than just the presence of the attribute.

## Suggested approach

- Load a workflow containing a **Load Image** node in the Playwright test environment.
- Open the image history dropdown.
- Dispatch a wheel event over the dropdown via `locator.dispatchEvent('wheel', { deltaY: 100 })`.
- Assert that the canvas scale (zoom level) remains unchanged after the scroll.
- Optionally assert that the dropdown's scroll position changed.

## Requester

Requested by @DrJKL in https://github.com/Comfy-Org/ComfyUI_frontend/pull/10550#discussion_r2997073085.

┆Issue is synchronized with this [Notion page](https://www.notion.so/Issue-10571-test-add-Playwright-E2E-scroll-handling-spec-for-image-history-dropdown-32f6d73d3650817bbec7dd4d11b173eb) by [Unito](https://www.unito.io)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.