Open
Description
Traditionally it's impossible to find out how many event listeners are attached at a given node.
Therefore it's quite hard to test that a proper event cleanup did happen.
However, with the chrome dev tools you can actually get it via a dev tools only function getEventListeners(node).
You can test it by opening the DevTools and on this github page select the <html> tag and write getEventListeners($0) into the console. You should see something like this
{
"change": [
{
"useCapture": false,
"passive": false,
"once": false,
"type": "change"
listener: function reference
}
]
}
If there is access to it via the puppeteer api then it could become a commands api?
Strawmen Proposal
import { getEventListeners } from '@web/test-runner-commands'
it('cleanup() removes events', async () => {
const button = document.createElement('button');
button.addEventListener('click', () => ...);
// verify that the event got setup
const listeners = await getEventListeners(button);
expect(listeners.length).to.equal(1);
cleanup(button);
// verify that the event got cleaned up
const listenersAfterCleanup = await getEventListeners(button);
expect(listenersAfterCleanup.length).to.equal(0);
});