vue-router doesn't work on IOS 10.3.2 (14F89) but works on IOS 11.2 (15C114)

Created on 9 Dec 2017  ·  18Comments  ·  Source: vuejs/vue-router

Version

3.0.1

Reproduction link

https://jsfiddle.net/fLswsLzh/

Steps to reproduce

1.- Open fiddle
2.- The router links are not available for IOS 10 (ipad mini 4 and ipad pro devices) either on Safari or Chrome browsers but they are available and work as expected on IOS 11 (ipad mini 4)

What is expected?

You should be able to access the router links

What is actually happening?

Router links are not available for IOS 10 (Ipad Mini 4 and Ipad Pro) but they are available on IOS 11 as expected.


Behavior can easily reproduce on both devices using Safari and Chrome browsers.

Do you have this bug confirmed? and, which version is preferred to use on IOS 10 then?

Most helpful comment

Using Ipad Mini with latest possible IOS 9.3.5
Chrome version 56.xxxx.79
Safari latest version

Both Chrome and Safari are unable to display any vue 2.x with vue-router (also tested angular.io) and the page is not visible. However vuejs.org is visible.

These devices are not that outdated, what is the recommend fix/workaround.?

All 18 comments

+1

Tested on iOS 10.3 and it's totally broken
It will not display any content in router-view also

Any updates?

Change the name of constant "app" or id="app" to something else.

<div id="app"></div>
'app' in window // true

Hi @c01nd01r I changed the name to "other" and now it's working on IOS 10.3.2 but not on IOS 10.0.1. Anyways, at least it now works on 10.3.2, great!

Any explanation for such behavior? why is "app" causing this mess?
Thanks

Anyone that can test on such device could tell me what version broke, please?

you can change the version included with https://unpkg.com/[email protected] (change the last part, you have a list of releases at https://github.com/vuejs/vue-router/releases)

@posva nothing works from the list on iPhone 5 iOS 10.3 simulator
– 0.4.0
– 0.5.0
– 0.7.12
– 2.0.3
– 2.4.0
– 3.0.1

If you manage to find the exact version that broke (between 2 and 3 I imagine) and give us an error we might find where the error comes

@eqApe Can you provide log of console in Safari DevTools?

Console output for vue-router 3.0.1:
SyntaxError: Can't create duplicate variable that shadows a global property: 'app' (anonymous function)

It doesn't provide any link to the issued function

@posva and we have the same error for 0.4.0. So I think it's a global problem

Looks like a Safari bug

Aah, so that's the error
It does come from the variable indeed, because using an id will automatically create a global variable with the same name (in this case app) closing then 🙂

@eqApe I don't think so, it doesn't work on Chrome either.

@smartITNinja on iOS?
Apple forced all browsers to use Safari's engine

@eqApe I have Chrome installed and running on both Ipad Pro 10.3.2 and Ipad mini 11..2.5

Hi, I'm not sure why, but for me the problem was the Promise.prototype.finally , it works now with a polyfill.

Using Ipad Mini with latest possible IOS 9.3.5
Chrome version 56.xxxx.79
Safari latest version

Both Chrome and Safari are unable to display any vue 2.x with vue-router (also tested angular.io) and the page is not visible. However vuejs.org is visible.

These devices are not that outdated, what is the recommend fix/workaround.?

Using Ipad Mini with latest possible IOS 9.3.5
Chrome version 56.xxxx.79
Safari latest version

Both Chrome and Safari are unable to display any vue 2.x with vue-router (also tested angular.io) and the page is not visible. However vuejs.org is visible.

These devices are not that outdated, what is the recommend fix/workaround.?

Were you able to solve this problem?

Was this page helpful?
0 / 5 - 0 ratings