Javascript Google Maps API & non-passive event handlers
up vote
6
down vote
favorite
Recently Chrome started emitting the following warnings:
[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
These are coming from the JavaScript Google Maps API code. I'm able to add passive: true to addEventListener() in my own code but don't know how to suppress the warning in Googles libraries?
addeventlistener passive-event-listeners
add a comment |
up vote
6
down vote
favorite
Recently Chrome started emitting the following warnings:
[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
These are coming from the JavaScript Google Maps API code. I'm able to add passive: true to addEventListener() in my own code but don't know how to suppress the warning in Googles libraries?
addeventlistener passive-event-listeners
So you are saying that Chrome wasn't showing these messages before? So you think that an update changed things? Or do you think an update to the Maps API changed?
– Abraham Luna
Apr 9 at 14:02
add a comment |
up vote
6
down vote
favorite
up vote
6
down vote
favorite
Recently Chrome started emitting the following warnings:
[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
These are coming from the JavaScript Google Maps API code. I'm able to add passive: true to addEventListener() in my own code but don't know how to suppress the warning in Googles libraries?
addeventlistener passive-event-listeners
Recently Chrome started emitting the following warnings:
[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
These are coming from the JavaScript Google Maps API code. I'm able to add passive: true to addEventListener() in my own code but don't know how to suppress the warning in Googles libraries?
addeventlistener passive-event-listeners
addeventlistener passive-event-listeners
edited Nov 11 at 0:08
Kevin Reid
14.9k45276
14.9k45276
asked Dec 13 '17 at 17:53
James R. Skinner
412
412
So you are saying that Chrome wasn't showing these messages before? So you think that an update changed things? Or do you think an update to the Maps API changed?
– Abraham Luna
Apr 9 at 14:02
add a comment |
So you are saying that Chrome wasn't showing these messages before? So you think that an update changed things? Or do you think an update to the Maps API changed?
– Abraham Luna
Apr 9 at 14:02
So you are saying that Chrome wasn't showing these messages before? So you think that an update changed things? Or do you think an update to the Maps API changed?
– Abraham Luna
Apr 9 at 14:02
So you are saying that Chrome wasn't showing these messages before? So you think that an update changed things? Or do you think an update to the Maps API changed?
– Abraham Luna
Apr 9 at 14:02
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
After you have added
passive:true
A suggested fix is to add these lines:
jQuery.event.special.touchstart =
setup: function( _, ns, handle )
if ( ns.includes("noPreventDefault") )
this.addEventListener("touchstart", handle, passive: false );
else
this.addEventListener("touchstart", handle, passive: true );
;
Tested with jquery-1.11.1.min.js.
However, Passive Event Listeners are an ongoing issue, and won't be fixed in Angular for the time being.
The problem might be caused by the DOM rendering process of the Browser when there are colliding events. Try to removed parts of the DOM (wrapper/container, divs, buttons, etc,), especially parts that listen to events, to identify the offender.
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f47799388%2fjavascript-google-maps-api-non-passive-event-handlers%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
After you have added
passive:true
A suggested fix is to add these lines:
jQuery.event.special.touchstart =
setup: function( _, ns, handle )
if ( ns.includes("noPreventDefault") )
this.addEventListener("touchstart", handle, passive: false );
else
this.addEventListener("touchstart", handle, passive: true );
;
Tested with jquery-1.11.1.min.js.
However, Passive Event Listeners are an ongoing issue, and won't be fixed in Angular for the time being.
The problem might be caused by the DOM rendering process of the Browser when there are colliding events. Try to removed parts of the DOM (wrapper/container, divs, buttons, etc,), especially parts that listen to events, to identify the offender.
add a comment |
up vote
0
down vote
After you have added
passive:true
A suggested fix is to add these lines:
jQuery.event.special.touchstart =
setup: function( _, ns, handle )
if ( ns.includes("noPreventDefault") )
this.addEventListener("touchstart", handle, passive: false );
else
this.addEventListener("touchstart", handle, passive: true );
;
Tested with jquery-1.11.1.min.js.
However, Passive Event Listeners are an ongoing issue, and won't be fixed in Angular for the time being.
The problem might be caused by the DOM rendering process of the Browser when there are colliding events. Try to removed parts of the DOM (wrapper/container, divs, buttons, etc,), especially parts that listen to events, to identify the offender.
add a comment |
up vote
0
down vote
up vote
0
down vote
After you have added
passive:true
A suggested fix is to add these lines:
jQuery.event.special.touchstart =
setup: function( _, ns, handle )
if ( ns.includes("noPreventDefault") )
this.addEventListener("touchstart", handle, passive: false );
else
this.addEventListener("touchstart", handle, passive: true );
;
Tested with jquery-1.11.1.min.js.
However, Passive Event Listeners are an ongoing issue, and won't be fixed in Angular for the time being.
The problem might be caused by the DOM rendering process of the Browser when there are colliding events. Try to removed parts of the DOM (wrapper/container, divs, buttons, etc,), especially parts that listen to events, to identify the offender.
After you have added
passive:true
A suggested fix is to add these lines:
jQuery.event.special.touchstart =
setup: function( _, ns, handle )
if ( ns.includes("noPreventDefault") )
this.addEventListener("touchstart", handle, passive: false );
else
this.addEventListener("touchstart", handle, passive: true );
;
Tested with jquery-1.11.1.min.js.
However, Passive Event Listeners are an ongoing issue, and won't be fixed in Angular for the time being.
The problem might be caused by the DOM rendering process of the Browser when there are colliding events. Try to removed parts of the DOM (wrapper/container, divs, buttons, etc,), especially parts that listen to events, to identify the offender.
edited Apr 9 at 19:33
answered Apr 9 at 18:40
wp78de
9,81951738
9,81951738
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f47799388%2fjavascript-google-maps-api-non-passive-event-handlers%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
So you are saying that Chrome wasn't showing these messages before? So you think that an update changed things? Or do you think an update to the Maps API changed?
– Abraham Luna
Apr 9 at 14:02