Error handling: show alert in production mode?

[MetRonnie]

Currently any uncaught errors are handled here by presenting the alert snackbar in development mode only: https://github.com/cylc/cylc-ui/blob/d0103310b600b504fb95b1587b84b869937bbca3/src/layouts/Default.vue#L88-L92

If an uncaught error occurs in the production build, the only clues will be a console error that users won't see and some kind of broken functionality.

You can test this out by adding throw new Error('oops') to the top of https://github.com/cylc/cylc-ui/blob/d0103310b600b504fb95b1587b84b869937bbca3/src/services/workflow.service.js#L214 and then opening the UI at the dashboard. No workflows will load and there is no obvious indication something went wrong.

In fact there is an e2e test that ensures an alert is presented for this very scenario which only works because the e2e tests build the UI in development mode.

[wxtim]

I feel like we should probably expose this to users. Otherwise a user action fails without any that the UI has thought about it which would be very frustrating.

I can't remember where I've seen it (cylc review?) but what about an alert with a "copy to clipboard button" and the suggestion that this issue needs reporting to site admins?

[MetRonnie]

That sounds like a neat idea, possibly we can include stack trace information in the clipboard

[MetRonnie]

Although the production code is minified so the stack trace might not be that helpful

[MetRonnie]

We should probably change the main error message for the errorCaptured to say something like

An unexpected error has occurred. You may need to refresh the page.

Click to show details >