I've came across to the next article, there I found example with blocking scroll event:
document.body.addEventListener('pointermove', event => {
if (event.cancelable) {
event.preventDefault(); // block the native scroll
/*
* do what you want the application to do here
*/
}
}, {passive: true});
but, it doesn't work, by the way I see illogicality using preventDefault in passive: true event. What is going on, anyone would explain to me?
No, that's the point of passive. From MDN's documentation for addEventListener:
passiveA boolean value that, if
true, indicates that the function specified by listener will never callpreventDefault(). If a passive listener does callpreventDefault(), the user agent will do nothing other than generate a console warning. See Improving scrolling performance with passive listeners to learn more.
And similarly, from the specification:
When set to
true,options’spassiveindicates that the callback will not cancel the event by invokingpreventDefault(). This is used to enable performance optimizations described in § 2.8 Observing event listeners.
The article would appear to be mistaken, or referring to situations that are not yet standardized (as they mention something about horizontal scrolling being underway while vertical scrolling starts).