Use of Mutation Events is deprecated?

13 posts, 0 answers
  1. LeBear
    LeBear avatar
    233 posts
    Member since:
    May 2006

    Posted 22 Mar 2013 Link to this post

    I've been seeing this for a while in my JavaScript log (developer tools and such), and it has no adverse effect.  In fact, I did a search online and I don't think this is a problem other than something that should be addressed in time as appropriate.

    Are you aware of this, and is this something that will be addressed?
  2. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1268 posts

    Posted 27 Mar 2013 Link to this post

    Hi,

    We are aware that the mutation events are deprecated, but for compatibility reasons we should keep them. When applicable we shall use MutationObserver instead.

    All the best,
    Dimitar Terziev
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. CE Development
    CE Development avatar
    2 posts
    Member since:
    Feb 2016

    Posted 12 Sep 2018 Link to this post

    Hi - our product uses RadMenu. With the recent release of FireFox 62, they have completely deprecated Mutation events and give us the following error:

    Use of Mutation Events is deprecated. Use MutationObserver instead.

    Which drills down to this specific line in the 'telerik.webui.webresource.axd'

    Line 16890: N.addEventListener("DOMAttrModified",this._onMozillaParentVisibilityChangeDelegate,false);

    I have attached screenshots.

    This translates to our RadMenu being unresponsive to user clicks.

    How can we address this? Any help on this would be greatly appreciated!

     

  4. Brett
    Brett avatar
    4 posts
    Member since:
    Sep 2009

    Posted 12 Sep 2018 Link to this post

    We experienced the same issue on our implementation.

    Turns out we had setup the radEditor with display:none which keeps the events from binding properly as firefox no longer binds events to display:none elements.

    We just changed the display:none to display:block and then used the visibility css attribute to control visibility.

    Problem solved!

     

  5. Rumen
    Admin
    Rumen avatar
    14029 posts

    Posted 17 Sep 2018 Link to this post

    Hello Brett,

    Thank you for bringing this issue to our attention. I've logged it for research in our bug tracking system.

    The currently available options are to hide the editor via visibility:hidden or by moving it in the non-visible part of the page position:absolute; top: -1000px; left: -10000px, e.g.

    Approach 1:
    <div style="visibility:hidden" id="hiddenWrapper">
        <telerik:RadEditor ID="RadEditor1" runat="server"></telerik:RadEditor>
    </div>
    <script>
        function f() {
            $get('hiddenWrapper').style.visibility = "visible";
        }
        Sys.Application.add_load(f);
    </script>

    Approach 2:
    <div style="position:absolute; top: -1000px; left: -10000px" id="hiddenWrapper">
        <telerik:RadEditor ID="RadEditor1" runat="server"></telerik:RadEditor>
    </div>
    <script>
        function f() {
            $get('hiddenWrapper').style.position = "static";
        }
        Sys.Application.add_load(f);
    </script>


    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  6. Rumen
    Admin
    Rumen avatar
    14029 posts

    Posted 17 Sep 2018 Link to this post

    Hello,

    Just a quick follow-up,

    there is yet another solution when the editor is hidden with style="display:block" and it is to fire its onParentNodeChanged() client-side method as explained in The RadEditor Control is Moved in the DOM:

    <div style="display: none" id="hiddenWrapper">
        <telerik:RadEditor ID="RadEditor1"  runat="server"></telerik:RadEditor>
    </div>
    <script>
        function f() {
            $get('hiddenWrapper').style.display = "block";
            $find("RadEditor1").onParentNodeChanged();
        }
        Sys.Application.add_load(f);
    </script>

    Regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  7. CE Development
    CE Development avatar
    2 posts
    Member since:
    Feb 2016

    Posted 17 Sep 2018 Link to this post

    Our issue is not with the RadEditor. It is with the RadMenu. The RadMenu is unresponsive to event clicks.
  8. Rumen
    Admin
    Rumen avatar
    14029 posts

    Posted 17 Sep 2018 Link to this post

    Hello CE Development,

    Can you please provide a test scenario which will help us to reproduce the issue in FF62?

    Are you able to replicate the issue in any of the RadMenu live demos?
    Which version of RadMenu do you use in your app?

    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  9. Antoine
    Antoine avatar
    2 posts
    Member since:
    Oct 2018

    Posted 03 Oct 2018 in reply to Rumen Link to this post

    Hi 

    I have the same problem on the buttons of the menu of a radEditor, for version firefox 62.0

    The mode console return "The use of "Mutation Events" is obsolete. Use "MutationObserver" instead."

    For example, the click of copy button do nothing.

    Do you have a solution ?

     

  10. Rumen
    Admin
    Rumen avatar
    14029 posts

    Posted 03 Oct 2018 Link to this post

    Hi Antoine,

    Can you please elaborate on your scenario?

    Is the editor initially hidden:
    • If yes, have you tried to call its onParentNodeChanged method once it is displayed on the page? This scenario is examined in the following article explained in The RadEditor Control is Moved in the DOM.

      <div style="display: none" id="hiddenWrapper">
          <telerik:RadEditor ID="RadEditor1" runat="server"></telerik:RadEditor>
      </div>
      <script>
          function f() {
              $get('hiddenWrapper').style.display = "block";
              $find("RadEditor1").onParentNodeChanged();
            }
          Sys.Application.add_load(f);
      </script>


    • If no, can you provide a test case, an aspx page or a project which will help to reproduce the issue?

    Other options are to set the ToolbarMode property to "RibbonBar", "PageTop" or "ShowOnFocus".


    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  11. Antoine
    Antoine avatar
    2 posts
    Member since:
    Oct 2018

    Posted 03 Oct 2018 in reply to Rumen Link to this post

    HI Rumen,

    Thank for your response

    Your Approach doesn't work. But I find the problem.

    I had a function in OnClientLoad  that did nothing and that posed problem. Once removing that corrected the problem.

  12. Rumen
    Admin
    Rumen avatar
    14029 posts

    Posted 03 Oct 2018 Link to this post

    I am glad that the problem is resolved on your side.

    Thank you for sharing your scenario, which looks not related to the mutation events warning in Firefox. 

    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  13. Rumen
    Admin
    Rumen avatar
    14029 posts

    Posted 08 Jan Link to this post

    Hello Everyone,

    I have good news that the Use of Mutation Events issue will be fixed in the upcoming next week R1 2019 release.

    It is part of the following fix: The editor commands do not work when the editor is initially hidden in Firefox 62+.

    Best regards,
    Rumen
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top