Show blank page in safari@iOS 8.3

[sonycamera]

Steps to reproduce

It's a very simple sample app created by vue-cli, nothing changed, it works good. But when I add following code(in main.js-the entry, before new Vue()):

import axios from 'axios';
import feathers from 'feathers/client';
import rest from 'feathers-rest/client';
import hooks from 'feathers-hooks';
import auth from 'feathers-authentication-client';

const app = feathers()
  .configure(hooks())
  .configure(rest().axios(axios))
  .configure(auth({storage: window.localStorage}));

then use Safari (on iOS 8.3, iPhone 6) to open the app, it just shows blank page. It still works good on Chome, Safari on iOS 10.x etc.

Then, I remove the last line:

...
const app = feathers()
  .configure(hooks())
  .configure(rest().axios(axios));

Now, the Safari (on iOS 8.3) shows correct content.

PS, Safari is not in private mode.

[marshallswain]

How about if you change the last line to the below?

.configure(auth());

[sonycamera]

I tried, still shows blank page. I also tried localforage, no luck.

[sonycamera]

Thanks for the rapid response, @marshallswain

[marshallswain]

If you open a Safari debugging session on your computer, any errors?

[sonycamera]

I'm using Linux. I installed ios_webkit_debug_proxy (ver 1.2) and try to debug iOS Safari remotely with Chrome DevTools. Chrome dev tools opened successfully, but only some functions, such as DOM inspection, works normally, the main function - console tab output nothing(using console.log in app, even safari opens a normal app). It seems a bug of ios_webkit_debug_proxy.

I also tried jsconsole.com, but it's timed out (to jsconsole) in loading js(from jsconsole).

So, currently, I have no available tool to remotely debug iOS Safari with Linux PC.

[marshallswain]

I'll try this out in Browserstack sometime this week and report back.

[marshallswain]

I just tested this out. It's because iOS 8's version of Safari doesn't support Object.assign. It throws an error in the console. All you need to do to fix it is install babel-polyfill and import it before feathers.

[daffl]

Thanks @marshallswain! I don't think there is anything else we can do other than what we are already doing by having the big Important box mentioning to include the an ES6 polyfill at https://docs.feathersjs.com/clients/feathers.html#universal-feathers.

[sonycamera]

You are right! The document is very clear. I ignored this important warning for I think that the Safari on iOS 8.3 is a modern browser, my mistake. Much appreciated!