Skip to main content

Search and Top Navigation

#9434 closed bug (notabug)

Opened July 17, 2013 01:42PM UTC

Closed July 26, 2013 05:45PM UTC

Tabs: Broken in IE11

Reported by: pwrelkin Owned by:
Priority: minor Milestone: none
Component: ui.tabs Version: 1.10.3
Keywords: Cc:
Blocked by: Blocking:
Description

In Internet Explorer 11 (Windows 8.1 Preview), you can only change the selected jQuery tab 3 or 4 times. After that, none of the tabs can be selected or displayed.

This bug was caused by the modifications to the "closest" function in 1.10.0. Reverting the "closest" function to 1.9.1 fixes this issue in 1.10.2.

I originally posted this as a core bug report since the "closest" function is located in the core file. They told me to post the report here.

PoC:

<link href='http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css' rel='stylesheet'>
<script src='http://code.jquery.com/jquery-1.10.2.js'></script>
<script src='http://code.jquery.com/ui/1.10.3/jquery-ui.js'></script>
<div id='tabs' style='font-size: 10pt;'>
  <ul>
  <li><a href='#tabs-1'>Try to</a></li>
    <li><a href='#tabs-2'>click on</a></li>
    <li><a href='#tabs-3'>each tab in</a></li>
    <li><a href='#tabs-4'>Internet Explorer 11</a></li>
    <li><a href='#tabs-5'>(Windows 8.1 Preview)</a></li>
  </ul>
  <div id='tabs-1'>Tab 1</div>
  <div id='tabs-2'>Tab 2</div>
  <div id='tabs-3'>Tab 3</div>
  <div id='tabs-4'>Tab 4</div>
  <div id='tabs-5'>Tab 5</div>
</div>
<script>
  $('#tabs').tabs();
</script>
Attachments (0)
Change History (5)

Changed July 18, 2013 08:25PM UTC by tj.vantoll comment:1

Hi pwrelkin,

Thanks for taking the time to contribute to the jQuery UI project. Just fyi at the moment no one on the team has an IE11 testing setup. Once we do we'll take a look at this.

Changed July 25, 2013 04:11PM UTC by tj.vantoll comment:2

status: newopen
summary: IE11 Tabs brokenTabs: Broken in IE11

I confirmed this behavior in IE11 preview. I'll mark this as valid for the moment. It sounds like it's a core bug, but it's a major issue for the tabs widget.

pwrelkin, since you say that this is a problem with

closest
, could you create a test case that shows the issue without using the tabs widget?

Changed July 26, 2013 01:29AM UTC by pwrelkin comment:3

Here is an example of the bug without jQuery UI:

<script src='http://code.jquery.com/jquery-1.10.2.js'></script>
<ul id='found'>
  <li>"closest" only works between 17 and 19 times in Internet Explorer 11.</li>
</ul>
<script>
  for(var i = 1; i <= 50; i++) {
    document.body.innerHTML += i + ': ' + $('li').closest('#found').attr('id') + '<br>';
  }
</script>

The bug seems to be caused by the fix for this bug:

http://bugs.jquery.com/ticket/13332

Replacing the for loop in "closest" with the code from version 1.9.1 fixes the problem:

		for ( ; i < l; i++ ) {
			cur = this[i];

			while ( cur && cur.ownerDocument && cur !== context && cur.nodeType !== 11 ) {
				if ( pos ? pos.index(cur) > -1 : jQuery.find.matchesSelector(cur, selectors) ) {
					ret.push( cur );
					break;
				}
				cur = cur.parentNode;
			}
		}

Changed July 26, 2013 03:46PM UTC by tj.vantoll comment:4

Thanks pwrelkin, that helps a lot.

I created a new core ticket for this http://bugs.jquery.com/ticket/14190.

Changed July 26, 2013 05:45PM UTC by scottgonzalez comment:5

resolution: → notabug
status: openclosed

Closing based on update in the core ticket.