chrome will remove DOMXXX event listeners on July 30

[userquin]

Is your feature request related to a problem? Please describe.

Running Vitest Browser 2.0 beta 5 on tresjs test I can see a lot of warnings from chrome in the console about relying on DOMXXX event listeners:

The example can be found here: Tresjs/tres#715

Describe the solution you'd like

Here the link https://chromestatus.com/feature/5083947249172480 .

Describe alternatives you've considered

None

Additional context

NA

[cexbrayat]

Hi @userquin

VTU listens to all possible DOM events (see dom-events.ts), so I think this warning is expected, and probably not a big deal (if you don't use these events yourself in your application).

Maybe we can remove them in a future VTU version to avoid the warnings and hope that this won't break tests out there that rely on these.

If you're willing to, a PR would be most welcome.

[IlCallo]

This message is spammed in every Cypress component test, unluckily
More a nuisance than a real problem

[cexbrayat]

@IlCallo A PR to fix this should be fairly simple and greatly appreciated 👍

[IlCallo]

Why is VTU listining for those events in the first place?
Just to allow devs to listen to them in their tests?
Or are they actually used by the library?

[cexbrayat]

Yes, VTU listens to all possible events to record them and allow developers to check them with wrapper.emitted() (see vueWrapper.ts)

test-utils/src/vueWrapper.ts

Lines 200 to 209 in 582d7d7

	for (const eventName of Object.keys(domEvents)) {
	// if a component includes events in 'emits' with the same name as native
	// events, the native events with that name should be ignored
	// @see https://github.com/vuejs/rfcs/blob/master/active-rfcs/0030-emits-option.md#fallthrough-control
	if (emits.includes(eventName)) continue
	const eventListener: EventListener = (...args) => {
	recordEvent(vm.$, eventName, args)
	}
	element.addEventListener(eventName, eventListener)

This code was probably the same in VTU v1. I started helping with the maintenance after this was written so I don't know why this design was picked.

Anyway, I think removing the culprit events from dom-events.ts should be enough. This means developers won't be able to check them with emitted() but as these events are getting deprecated, I suppose it's fine.