Project

Profile

Help

Feature #5923

closed

Provide a way to control event listener parameters

Added by Martynas Jusevicius about 1 year ago. Updated 11 months ago.

Status:
Resolved
Priority:
Normal
Assignee:
-
Category:
IXSL extensions
Sprint/Milestone:
-
Start date:
2023-03-17
Due date:
% Done:

0%

Estimated time:
Applies to JS Branch:
Trunk
Fix Committed on JS Branch:
Trunk
Fixed in JS Release:
SEF Generated with:
Platforms:
Company:
Martynas Jusevičius
Contact person:
Martynas Jusevičius
Additional contact persons:
-

Description

I'm getting this warning in a <xsl:template match="svg:svg" mode="ixsl:onwheel"> template:

Ignoring 'preventDefault()' call on event of type 'wheel' from a listener registered as 'passive'.

I haven't set the passive parameter, so I suppose SaxonJS has?

Can we have a get a general mechanism for controlling event listener parameters? I'm imagining something like this:

<xsl:template match="svg:svg" mode="ixsl:onwheel" ixsl:event-options="map{ 'capture': true(), 'passive': false() }">

Files

Screenshot 2023-05-20 181518.png (86.8 KB) Screenshot 2023-05-20 181518.png Martin Honnen, 2023-05-20 18:18
Actions #1

Updated by Norm Tovey-Walsh 12 months ago

Do you have any kind of example for this? I can't reproduce it. OTOH, I also can't work out how to scroll an SVG. Everything I see on the web says that you should set scroll:overflow on the wrapper. AFAICT, an onwheel event doesn't cause any problems on a DIV.

Actions #2

Updated by Martin Honnen 12 months ago

https://chromestatus.com/feature/6662647093133312 suggests that with Chrome (and I think also Mozilla) wheel and similar at the window or document or document.body level are by default treated as passive.

And doesn't SaxonJS register event listeners you declare with mode="ixsl:onXXX" at the window or document level, meaning any use of ixsl:onwheel will have a listener created and subjected to the "default" passive setting Chrome imposes?

Actions #3

Updated by Martin Honnen 12 months ago

https://martin-honnen.github.io/xslt/2023/onwheel/sample1.html is a test case (just with HTML, no SVG used) that has e.g.

  <xsl:template match="div[@id = 'div1']" mode="ixsl:onwheel">
    <xsl:message select="saxon:timestamp() || ': ' || ixsl:event() => ixsl:get('type')"/>
  </xsl:template>

  <xsl:template match="div[@id = 'div1']" mode="ixsl:onmouseover">
    <xsl:message select="saxon:timestamp() || ': ' || ixsl:event() => ixsl:get('type')"/>
  </xsl:template>
  
  <xsl:template match="div[@id ='div2']" mode="ixsl:onwheel">
    <xsl:message select="saxon:timestamp() || ': ' || ixsl:event() => ixsl:get('type'), ixsl:event() => ixsl:call('preventDefault', [])"/>
  </xsl:template>

for which you can see in the browser console that SaxonJS sets up two document wide event listeners where the mouseover has passive as false but the wheel get the default passive as true and that way the attempt to call preventDefault causes Chrome to emit

[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/feature/6662647093133312

Actions #4

Updated by Martynas Jusevicius 12 months ago

Thanks Martin :)

Actions #5

Updated by Martynas Jusevicius 12 months ago

My code looks like this:

    <xsl:template match="svg:svg" mode="ixsl:onwheel">
        <xsl:sequence select="ixsl:call(ixsl:event(), 'preventDefault', [])"/>
        ...
Actions #6

Updated by Martin Honnen 12 months ago

Here is a screeshot from the Chrome developer tools that shows that the two event listeners for mouseover and wheel are being set up by the same SaxonJS code but result in different passive settings due to the default that Chrome enforces for wheel:

Actions #7

Updated by Martynas Jusevicius 12 months ago

Just to clarify what I was trying to do: prevent window scroll during onwheel and zoom the SVG in/out instead.

Actions #8

Updated by Norm Tovey-Walsh 11 months ago

Ah, this is an issue in Chrome, not Firefox.

Actions #9

Updated by Norm Tovey-Walsh 11 months ago

FWIW, it isn't that we set passive true, it's:

If not specified, defaults to false – except that in browsers other than Safari, defaults to true for the wheel, mousewheel, touchstart and touchmove events.

Actions #10

Updated by Martynas Jusevicius 11 months ago

OK, so my question is then: how do I port the following JS code to SaxonJS? From https://codepen.io/osublake/pen/oGoyYb

window.addEventListener("wheel", onWheel);

function onWheel(event) {
  event.preventDefault();
  ...
Actions #11

Updated by Norm Tovey-Walsh 11 months ago

Sorry. I wasn't suggesting that we don't need to fix this bug. I was just clarifying that it isn't the result of an explicit choice on our part, but rather a case of varying defaults. It's a bug, or at least an obviously missing feature, and we should fix it.

Actions #12

Updated by Martynas Jusevicius 11 months ago

I'm sorry too, my comment wasn't meant to come accross as harsh :)

Actions #13

Updated by Norm Tovey-Walsh 11 months ago

  • Status changed from New to Resolved
  • Applies to JS Branch Trunk added
  • Applies to JS Branch deleted (2)
  • Fix Committed on JS Branch Trunk added

Only one listener is instantiated for any given event type (e.g., there's only one listener for wheel events no matter how many xsl:template elements match in that mode). Consequently, the ixsl:event-options attribute is placed on the xsl:mode declaration:

<xsl:mode name="ixsl:onwheel"
          ixsl:event-options="map{'passive':false()}"/>

The ixsl:event-options attribute is an expression. It may not refer to the context. If it refers to variables, they must be static.

Actions #14

Updated by Martynas Jusevicius 11 months ago

Hmm I'm not sure this helps to address my use case in the light of Martin's comment. I'll try to produce a test case.

Actions #15

Updated by Norm Tovey-Walsh 11 months ago

I'm not sure what to suggest by way of a workaround for now. This is fixed for SaxonJS 3.0.

Actions #16

Updated by Martynas Jusevicius 11 months ago

  • Company set to Martynas Jusevičius
  • Contact person set to Martynas Jusevičius

My understanding is that despite this new feature allowing to set event
option ‘passive: false()’, it will have no effect because document-level
events are “passive by default” and SaxonJS is binding listeners at
document level. Does that make sense?

On Thu, 8 Jun 2023 at 19.00, Saxonica Developer Community <
> wrote:

Actions #17

Updated by Norm Tovey-Walsh 11 months ago

Do you have a citation for the 'passive by default' problem?

I tested the fix by verifying that an onwheel event generated console log errors in Chrome before I used the new feature to set passive to false, and not after I set it to false.

Actions #18

Updated by Martynas Jusevicius 11 months ago

This is what Martin linked to earlier in the thread: Feature: Treat Document Level Wheel/Mousewheel Event Listeners as Passive

Actions #19

Updated by Martynas Jusevicius 11 months ago

The wheel/mousewheel event listeners that are registered on document level targets (window.document, window.document.body, or window) will be treated as passive if not specified as otherwise and calling preventDefault() inside such listeners will be ignored.

OK so maybe it would work... I would need to test.

Please register to edit this issue

Also available in: Atom PDF Tracking page