Skip to content

Commit de2c38e

Browse files
test: assert locate emit on the child listener, not the wrapper root (#15612)
*PR Created by the Glary-Bot Agent* --- Fixes the failing `test` job on #15413. Targets that PR's branch, so merging this here makes #15413 green. ## Problem `emitted()` returned by `@testing-library/vue`'s `render()` reports events for the component handed to `render()` — internally it is just `emitted: name => wrapper.emitted(name)` on the mounted root. The propagation test renders an ad-hoc wrapper, so the root is the `<div>`, not `LocateNodeButton`. The wrapper never emits `locate`; only the child does. So `emitted().locate` was `undefined` and `expect(undefined).toHaveLength(1)` threw: ``` AssertionError: Target cannot be null or undefined. ❯ LocateNodeButton.test.ts:44:30 ``` Dumping what the wrapper actually reports confirms it — only native events that bubbled to the root element, and notably no `click`, which independently shows `@click.stop` is working: ``` pointerover, pointerenter, mouseover, mouseenter, pointermove, mousemove, pointerdown, mousedown, focusin, pointerup, mouseup ``` The assertion could never pass, regardless of component behavior. The component itself is fine — no regression. ## Fix Spy on the child's `@locate` handler instead of reading the wrapper's `emitted()`. `@vue/test-utils` `findComponent()` is not an option here — `docs/guidance/vitest.md` bans it in new tests — and `render()` exposes no way to reach a child's emitted events. ## Verification - `pnpm vitest run src/components/rightSidePanel/errors/LocateNodeButton.test.ts` — 4/4 pass - `pnpm vitest run src/components/rightSidePanel` — 208/208 pass - `pnpm typecheck` (exit 0), `pnpm format:check`, ESLint on the changed file — all clean The assertion keeps its teeth. Replacing `@click.stop="emit('locate')"` with `@click.stop="() => {}"` — precisely the swallowed-emit case the original PR set out to catch — still fails: ``` AssertionError: expected "vi.fn()" to be called 1 times, but got 0 times ❯ LocateNodeButton.test.ts:45:22 ``` Co-authored-by: Glary-Bot <glary-bot@users.noreply.github.com>
1 parent b95f6ee commit de2c38e

1 file changed

Lines changed: 5 additions & 4 deletions

File tree

src/components/rightSidePanel/errors/LocateNodeButton.test.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -29,19 +29,20 @@ describe('LocateNodeButton', () => {
2929
it('stops click propagation so an ancestor handler does not also fire', async () => {
3030
const user = userEvent.setup()
3131
const onAncestorClick = vi.fn()
32-
const { emitted } = render({
32+
const onLocate = vi.fn()
33+
render({
3334
components: { LocateNodeButton },
34-
setup: () => ({ onAncestorClick }),
35+
setup: () => ({ onAncestorClick, onLocate }),
3536
template:
36-
'<div @click="onAncestorClick"><LocateNodeButton label="Locate node on canvas" /></div>'
37+
'<div @click="onAncestorClick"><LocateNodeButton label="Locate node on canvas" @locate="onLocate" /></div>'
3738
})
3839

3940
await user.click(
4041
screen.getByRole('button', { name: 'Locate node on canvas' })
4142
)
4243

4344
expect(onAncestorClick).not.toHaveBeenCalled()
44-
expect(emitted().locate).toHaveLength(1)
45+
expect(onLocate).toHaveBeenCalledTimes(1)
4546
})
4647

4748
it('emits locate on keyboard activation without relying on implicit tab order', async () => {

0 commit comments

Comments
 (0)