Non-passive event listener chrome warnings

[megan-parkes-sonocent]

Hi,

We're seeing some warnings appear in chrome when using this module. The warnings are viewable on https://player.vimeo.com/api/demo in chrome v80.

Can the listeners be made passive or are the non passive event listeners required?

player.js:10 [Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952
Kf.addEvent @ player.js:10
Kf.addEvent @ player.js:10
$f @ player.js:10
Kf.on @ player.js:10
Ct @ player.js:10
ov @ player.js:10
(anonymous) @ player.js:10
initializationHandler @ player.js:10
(anonymous) @ player.js:10
player.js:10 [Violation] Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952
Kf.addEvent @ player.js:10
Kf.addEvent @ player.js:10
$f @ player.js:10
Kf.on @ player.js:10
(anonymous) @ player.js:10
av @ player.js:10
(anonymous) @ player.js:10
initializationHandler @ player.js:10
(anonymous) @ player.js:10
player.js:10 [Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952

[martinweck]

+1 I have got those warnings, too. Please fix them:

player.js:10 [Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952
nl.addEvent @ player.js:10
nl.addEvent @ player.js:10
tl @ player.js:10
nl.on @ player.js:10
Ct @ player.js:10
iv @ player.js:10
(anonymous) @ player.js:10
initializationHandler @ player.js:10
(anonymous) @ player.js:10
player.js:10 [Violation] Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952
nl.addEvent @ player.js:10
nl.addEvent @ player.js:10
tl @ player.js:10
nl.on @ player.js:10
(anonymous) @ player.js:10
rv @ player.js:10
(anonymous) @ player.js:10
initializationHandler @ player.js:10
(anonymous) @ player.js:10
player.js:10 [Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952
nl.addEvent @ player.js:10
nl.addEvent @ player.js:10
tl @ player.js:10
nl.on @ player.js:10
Qv @ player.js:10
(anonymous) @ player.js:10
initializationHandler @ player.js:10
(anonymous) @ player.js:10
player.js:10 [Violation] Added non-passive event listener to a scroll-blocking 'wheel' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952

[luwes]

thanks for the feedback! we will look into this

[jpowell]

We've run into this as well. Check this out: https://web.dev/uses-passive-event-listeners/

Seems like an easy fix 🎉

[abombelli]

Same issue here.

[luwes]

we released a fix with explicit passive properties for the events. looks like this is resolved 🎉 please let us know if you see any issues

[brown2020]

This issue is back with the Vimeo player:

[Nicholasbell03]

Can confirm I am receiving the issue with Vimeo player 2.20.1

[chrish123]

I can confirm the same issue using embed code:

[alexberdejo7]

mismo problema

[MatteoBruschetti]

Same problem with VimeoPlayer - v4.27.3 - 2024-01-24

[kirilreznik]

I am experiencing the same issue - "@vimeo/player": "2.19.0"

[rkrishnan8594]

For those still experiencing this issue, could you provide steps for reproduction, as well as a description of the end user impact?