Jquery: jQuery 3.4 TypeError: e.getRootNode is not a function

[dmifedorenko]

Hello.

We just update jQuery from 3.3.1 to 3.4 and get some errors only on iOS 10.x.

Stack trace:
TypeError: TypeError: e.getRootNode is not a function. (In 'e.getRootNode(ae)', 'e.getRootNode' is undefined) oe@https://www.100sp.ru/bower/jquery/dist/jquery.min.js:2:35785 we@https://www.100sp.ru/bower/jquery/dist/jquery.min.js:2:38549 parseHTML@https://www.100sp.ru/bower/jquery/dist/jquery.min.js:2:83573 init@https://www.100sp.ru/bower/jquery/dist/jquery.min.js:2:25056 k@https://www.100sp.ru/bower/jquery/dist/jquery.min.js:2:963 s@https://www.100sp.ru/static/jquery-ui/1.12.1/jquery-ui.min.js:6:2339 https://www.100sp.ru/static/jquery-ui/1.12.1/jquery-ui.min.js:10:18498 https://www.100sp.ru/static/jquery-ui/1.12.1/jquery-ui.min.js:6:74 global code@https://www.100sp.ru/static/jquery-ui/1.12.1/jquery-ui.min.js:6:84

Examples of top user agents with this error:

Mozilla/5.0 (iPhone; CPU iPhone OS 10_2_1 like Mac OS X) AppleWebKit/602.4.6 (KHTML, like Gecko) Version/10.0 Mobile/14D27 Safari/602.1 422
Mozilla/5.0 (iPhone; CPU iPhone OS 10_2 like Mac OS X) AppleWebKit/602.3.12 (KHTML, like Gecko) Version/10.0 Mobile/14C92 Safari/602.1 174
Mozilla/5.0 (iPhone; CPU iPhone OS 10_2_1 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) GSA/21.1.139288856 Mobile/14D27 Safari/600.1.4 98
Mozilla/5.0 (iPhone; CPU iPhone OS 10_1_1 like Mac OS X) AppleWebKit/602.2.14 (KHTML, like Gecko) Version/10.0 Mobile/14B100 Safari/602.1 53
Mozilla/5.0 (iPhone; CPU iPhone OS 10_1 like Mac OS X) AppleWebKit/602.2.14 (KHTML, like Gecko) Version/10.0 Mobile/14B72 Safari/602.1 31
Mozilla/5.0 (iPhone; CPU iPhone OS 10_2 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) GSA/64.0.223374052 Mobile/14C92 Safari/602.1 22
Mozilla/5.0 (iPhone; CPU iPhone OS 10_2 like Mac OS X) AppleWebKit/602.3.12 (KHTML, like Gecko) Mobile/14C92 sp-mobile-app 20
Mozilla/5.0 (iPhone; CPU iPhone OS 10_1_1 like Mac OS X) AppleWebKit/602.2.14 (KHTML, like Gecko) Mobile/14B100 sp-mobile-app 19
Mozilla/5.0 (iPhone; CPU iPhone OS 10_2_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) CriOS/71.0.3578.89 Mobile/14D27 Safari/602.1 18
Mozilla/5.0 (iPhone; CPU iPhone OS 10_1_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) CriOS/67.0.3396.87 Mobile/14B100 Safari/602.1 17
Mozilla/5.0 (iPhone; CPU iPhone OS 10_2 like Mac OS X) AppleWebKit/602.3.12 (KHTML, like Gecko) Mobile/14C92 13
Mozilla/5.0 (iPhone; CPU iPhone OS 10_0_1 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14A403 Safari/602.1 12
Mozilla/5.0 (iPad; CPU OS 10_1_1 like Mac OS X) AppleWebKit/602.2.14 (KHTML, like Gecko) Version/10.0 Mobile/14B100 Safari/602.1 11
Mozilla/5.0 (iPhone; CPU iPhone OS 10_0_2 like Mac OS X) AppleWebKit/602.1.50 (KHTML, like Gecko) Version/10.0 Mobile/14A456 Safari/602.1 9
Mozilla/5.0 (iPad; CPU OS 10_2 like Mac OS X) AppleWebKit/602.3.12 (KHTML, like Gecko) Version/10.0 Mobile/14C92 Safari/602.1 8

As you can see where are no Android and desktop browsers. Looks like this is problem in jquery and not in our own code. Can you check this issue please?

[rpellerin]

I'm affected as well. Any update on this? Thanks.

[mgol]

Can you provide a test case on JS Bin as the issue template requested? Thanks!

[dmifedorenko]

No, I cant. The source code of my site is huge and I have no device with iOS 10.x

Can you just check calls of getRootNode inside new version?

Looks like bug relative to fresh changes https://github.com/jquery/jquery/pull/3996

[mgol]

The relevant code lines: https://github.com/jquery/jquery/blob/3.4.0/src/core/isAttached.js#L14-L19.

I think the problem is that iOS 10.0 supports Element#attachShadow but it doesn't support Element#getRootNode. It's hard for us to test it as our test run only on latest version of each iOS version that we test and iOS 10.3 does support getRootNode. I'd expect this test case to fail in iOS 10.0-10.2: https://jsbin.com/sohacog/1/edit?html,js but I have no way of making sure it does. I think changing the documentElement.attachShadow check to documentElement.getRootNode should help but it'd be worth verifying before we apply the change.

Does anyone has access to iOS 10.0, 10.1 or 10.2? If you do, can you:

1. Check if https://output.jsbin.com/sohacog/1 displays FAIL there.
2. Download https://code.jquery.com/jquery-3.4.0.js, swap documentElement.attachShadow for documentElement.getRootNode and check if the above test case now succeeds with such a modified jQuery copy?

[mgol]

Note to self: land the relevant patch only on 3.4-stable as we're not going to support iOS <10.3 in jQuery 4.0.

[dmifedorenko]

I can deploy patched jQuery version _tomorrow_ and check JS errors on our site.

We collect and send JS errors to backend, and I saw about 1.5k entries with "e.getRootNode is not a function" every day.

[mgol]

I've noticed latest Xcode on macOS Mojave allows to install an iOS 10.0 emulator (in the past it didn't let you reach that far to the past, I think) so I installed that & run my test case and it failed, indeed. I tested the rename that I suggested and it passed. I'll submit a PR with the fix soon.

[mgol]

PR: #4360

[mgol]

Fixed by 7dddb19ca4bca9685adb734c76dcf72c3f610007.

[timmywil]

jQuery 3.4.1 has been released! https://blog.jquery.com/2019/05/01/jquery-3-4-1-triggering-focus-events-in-ie-and-finding-root-elements-in-ios-10/