My client have informed me that the app I made for them using Meteor is not working on some mobile browsers, such as Firefox on iphone, ipad and linux (does however work on Firefox on my Mac). Then on my iphone it does work on Safari, but not Opera or Firefox; making it very hard to debug…
App is here: www.skogen.pm (hope that we won’t crash it lol )
Any ideas why?? I’m in a forced digital nomad state flying in a couple of days, so not so equipped to debug this unfortunately…
I looked around in your app’s code a little for a possible error why it is “not working” sometimes. The only plausible suspect I found so far is the serviceWorker, which is according to MDN still “experimental”, albeit the crashes could only be partially explained with the availability data on caniuse: https://caniuse.com/?search=serviceWorker
The serviceWorker API is only available in Safari on iOS since 11.3 (Mar. 29 2018), so using this API may break the application on devices running with older Safari versions.
As for Opera Mini, serviceWorkers are not supported at all.
Opera for Android: it is not supposed to work until version 59 on Jun 30, 2020, meaning there can be lots of devices out there with an older version.
According to the charts, however, it should work flawlessly with Firefox on all platforms.
On another note, maybe you should consider configuring eslint for your app. I’ve turned this on on my machine for your project, and it seems that there is a massive amount of missing props validation, missing imports and unused variables.
Also in some cases I can’t seem to find the invocation ...ready() in subscriptions on the client prior to fetching the corresponding collections’ content. I didn’t check in all details, I also didn’t debug your application, but this may cause unexpected results.
Last but not least, your app does very little with respect to error handling/logging. It basically just sends error messages to the browser console, where they are immensely useful during development, not so much however in production. Using a remote error logging service would generally be very helpful in finding out what exactly fails in your app.
I think the solution could be as easy as checking whether Navigator.serviceWorker is defined. If it isn’t, just don’t invoke it. The PWA functionality wouldn’t have worked anyway in those browsers and on the affected platforms.
I don’t have a recommendation for a remote logger. There are very many out there, both as a paid service and free. I have built my own solution as I have my own broad concept of how errors need to be dealt with, which is more than just sending messages and a stacktrace. But it’s definitely much better to have something simple than having nothing at all!
As a side note, stack traces of production code are not so useful when using the Meteor package standard-minifier-js, because the function names, class and method names get minified too. I think the zodern/standard-minifier-js package solves that problem.