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?










share|improve this question























  • 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














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?










share|improve this question























  • 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












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?










share|improve this question















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






share|improve this question















share|improve this question













share|improve this question




share|improve this question








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
















  • 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












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.






share|improve this answer






















    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
    );



    );













    draft saved

    draft discarded


















    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.






    share|improve this answer


























      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.






      share|improve this answer
























        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.






        share|improve this answer














        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.







        share|improve this answer














        share|improve this answer



        share|improve this answer








        edited Apr 9 at 19:33

























        answered Apr 9 at 18:40









        wp78de

        9,81951738




        9,81951738



























            draft saved

            draft discarded
















































            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.




            draft saved


            draft discarded














            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





















































            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







            Popular posts from this blog

            How to how show current date and time by default on contact form 7 in WordPress without taking input from user in datetimepicker

            Syphilis

            Darth Vader #20