addEventListener in content script not executed/effective on htmlz pages

Add-ons Development
#1

I maintain this very simple extension that does its job by listening on mouseup events. The event handler for that is installed here in the content script.

Now a user has reported that the extension does not work on local htmlz pages/archives … never heard about these before. (The extensions works just fine on local regular html pages, so the “local” is not the problem.)

The problem seems to be that the call to addEventListener on these htmlz pages is just … ignored. After the initialization, no mouseup events being fired at all on the htmlz page, verified in the developer pane. No noteworthy errors or whatever are reported in the browser console.

A fix seems to be delay the call to addEventListener by 50ms, as c seen here. Which seems odd. Any opinions on that?

#2

Never mind … the document is changing its body in flight, thus loosing the listener initially added. Must have been lucky that this hasn’t happened earlier?!

#3

Why even register events on the body?

    let t = document.body || document || window;
    t.addEventListener( "mouseup", this, false );

Go directly for the window and probably also use capture (set last parameter to true).

#4

Thanks for commenting …

In earlier versions I used to listen on window (without capture), and that did not let me receive events on some sites. Could the capture make a difference on these?

#5

That’s hard to say… the documentation is a bit complicated written for this: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#usecapture

But it says that:

A boolean value indicating whether events of this type will be dispatched to the registered listener before being dispatched to any EventTarget beneath it in the DOM tree.

So page should NOT be able to stop the event.
That is, unless it’s also using a capture and registers it before you do.

But I have to say, this is not my area of expertise… but from my experience as author of scrolling extension Scroll Anywhere which uses this:

window.addEventListener('mousedown', mouseDownHandler, {capture: true});

I can tell you this works on all pages I’ve ever visited :slight_smile:.

#6

Just gave that particular site, which gave me trouble back then, a try with a plain window.addEventListener( "mouseup", this, true ), and things worked with that.

Of course, that would be much simpler than tinkering with observers and all … you gave me sth to think about, thanks again.

1 Like