Browser stops registering click events on table

Confirmed Issue #5782378 • Assigned to Alexander W.

Details

Created
Dec 9, 2015
Privacy
This issue is public.
Reports
Reported by 5 people

Sign in to watch or report this issue.

Steps to reproduce

URL:

Repro Steps:

I found an exact recipe to reproduce this using some sample code I’ve included.

Steps to reproduce

  1. click one of the ‘Click Me’s’ on the page. This will pop open a window. You can do whatever you want with the window that pops up(including close it) it doesn’t matter.
  2. try and click either the ‘try to click me’ check box or the ‘Click Me’s’ again, they don’t work
  3. click the body of the page, basically outside of the table
  4. try and click a checkbox or ‘click me’s’ again, it works

To Fix the broken state
Click outside of the table. You can do that after you open the window either before or after the timer ticks.

To try fix

  1. Refresh the page
  2. check ‘Fix’
  3. click ‘Click Me’
  4. Try anc click another ‘Click Me’ or ‘Try and clic me’ checkbox, they work

Criteria for the bug to happen

  1. It has to be a table. Use nested divs doesn’t break, using a list doesn’t break, only rearranging tr’s
  2. You have to pop open a window at least once, via click handler(doing it via debugger or inline js doesn’t cause this)
  3. The click event that fires the open window must beattached to the tr’s or any of their children.
  4. You have to add/rearrange table rows in the table after opening the window

As far as we can tell this is just a bug with edge

Things I’ve tried
Detach the TR before prepending it back into the table
Moving the tr to a new table and moving it back
Moving the tr to a different element and moving it back
Detach the tr, jquery clone it, remove the old one, and put the clone in the table
Return all the ‘prevent default/propogation’ returns in the click handler
return true/false in the click handler
Put the window creation code into a setTimeout so that the click handler has a chance to return before the window opens
After the window opens, returning focus back to the main window
Forcing a click event outside the table after the window is opened(if you manually click at that time it’d be fixed.
Attaching the click handlers to various other parts of the table.
Using old school .click click handler
Unregistering and reregistering click handlers on tr’s
Not ever rearranging, just adding new tr’s from scratch each time

And tons of other various little tweaks.

Expected Results:

That you can click things

Actual Results:

Dev Channel specific:

No

Attachments

1 attachment

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “Sermet I.”

    Changed Assigned To from “Sermet I.” to “Alexander W.”

    Changed Status to “Confirmed”

  • We are experiencing a similar issue where mouse click events suddenly stop working in Edge however it is not related specifically to tables as in the example above. I have tried to reproduce the problem with a simplified version of our Angular app with no luck. If interested I would be more then happy to share a link to our production website or even help test the fix when available.

    • The problem seems to occur after manipulation of the DOM through AngularJS and UI-Router while switching between views (which remove and add complex elements).

    • Only mouse click events within the affected DIV (including all of its child elements) stop working.

    • You can get the mouse click events to work again if there is an INPUT element on the page that can receive focus and you click on it.

  • Christian, Thanks!

    I have write some “workarround” in JS… and my angularjs app is runing correctly now:

    var isMsEdge = /Edge/(\d)+/.test(navigator.userAgent);
    /*

    • BUGFIX: MS Edge mouse events bug
    • https://developer.microsoft.com/pt-br/microsoft-edge/platform/issues/5782378/
      */
      if(isMsEdge){
      setTimeout(function(){msEdgeFix()},1500);
      document.getElementsByTagName(‘body’)[0].onmouseenter = function(){msEdgeFix()};
      }
      function msEdgeFix(){
      $(‘body’).append(‘’);
      $(‘#msEdgeFix’).click();
      $(‘#msEdgeFix’)[0].focus();
      setTimeout(function(){$(‘#msEdgeFix’).remove()},500);
      }
      // END
  • By the way, I have to inform the results of my tests:

    • BUG IS PRESENT ON: MS Edge, build 25.x
    • BUG IS NOT PRESENT ON: MS Edge, build 34.x
  • I can also report back that the issue is not present on build 34.x after extensive testing.

  • Hi Carlos,

    When can we expect the public release of MS Edge, build 34.x or above?

    Thanks!

  • Sorry, the question was for Alexander W.

  • Just wanted to thanks Carlos, you inspired me to make a similar work around. For others using UI-Router:


    Add to Page (Place an input element off the page)

    
    

    Add to Angular (Runs after UI-Router state change giving focus to input)

    $rootScope.$on('$stateChangeSuccess', function(){
         if (isEdge) {
             $('#edgeFix').click();
             $('#edgeFix')[0].focus();
         }    
    });
    
  • Appears that the site removed my input element from example above

    input id="edgeFix" tabindex="-1" style="position: absolute; top: -100px; left: -100px;"
    
  • On my page this is fixed in

    Edge 38.14324.1000.0
    Edgehtml 14.14342
    
  • Another example about the error:
    Linkbutton1 do not work the postback URL nor code behind.

    Linkbutton2 and 3 it works and the only difirentiation is the self closed tag.

  • Correcting the code:

     
                
    
            
            
            
    
            
            
    
    
    
    
  • Seems that this forum also has a bug. It is not possible to edit the post and Markdown is not working.
    The code againg (without javascript).

     
                
    
            
            
            
    
            
            
    
    
  • [Public comment from customer Fernando A.:]

  • Code

     
                
    
            
            
            
    
       
    
            
    
    
  • I give up to write the code in this forum.
    If Microsoft wants to fix this bug at Edge, send me a e-mail.

  • Microsoft Edge Team

    Changed Assigned To from “Alexander W.” to “Andrew B.”

    Changed Status from “Confirmed”

    Changed Assigned To to “Sermet I.”

    Changed Assigned To from “Sermet I.” to “Alexander W.”

    Changed Status to “Confirmed”

You need to sign in to your Microsoft account to add a comment.

Sign in