Layout should have a provision to handle application loading errors gracefully

[tsukhu]

Please refer to issue #47 where if there is a loading failure we continue to see the loader and the user will not know if there is a failure.

The layout engine should have some provision to show an alternate message or alternate error handling component plus also unload the js file for the failing application.

[joeldenning]

Agreed. Perhaps a load-error attribute on <application> elements would be the right way to do this? What do you think of the following API:

<application name="nav" loader="navLoader" load-error="navLoadError"></application>

import { constructRoutes } from 'single-spa-layout';

const routes = constructRoutes(document.querySelector('#single-spa-layout'), {
  loaders: {
    navLoader: "<img src="loading.gif"></img>",
  },
  loadErrors: {
    navLoadError: "<div>The navbar is having problems</div>"
  }
})

One question about this is if we should also think about mount errors for applications as part of this. @TheMcMurder do you have thoughts on this?

[tsukhu]

One thought was can we look esi spec for ideas
https://www.w3.org/TR/esi-lang/

Namely onerror=continue and the try|attempt|except constructs

[tsukhu]

Another possibility is the application tag is likely to become very verbose with leaders, errors , parameter lists etc. and its likely we add more in the times to come.

Since we already have the json being provided in the constructRoute Api we can probably only provide the name and the rest including the params ,loaders , exception paths are defined in json. This will avoid the clutter as we as keep the template stable for the users.

[joeldenning]

Released in https://github.com/single-spa/single-spa-layout/releases/tag/v1.0.0-beta.9 and documented in https://single-spa.js.org/docs/layout-definition#error-uis