Add basic fallback error to real apps when client library fails to load
This commit is contained in:
parent
414a7dbee6
commit
197d895174
|
@ -34,13 +34,55 @@
|
||||||
*:after {
|
*:after {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#error {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
display: none;
|
||||||
|
font-family: "Source Sans Pro", sans-serif;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
background: #222;
|
||||||
|
text-align: center;
|
||||||
|
padding: 2rem;
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
#error h1,
|
||||||
|
#error h2 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
#error h1 {
|
||||||
|
color: #ccc;
|
||||||
|
font-size: 3rem;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
#error h2 {
|
||||||
|
color: #888;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<body id="app">
|
<body id="app">
|
||||||
|
<div id="error">
|
||||||
|
<h1>There was an error loading your app</h1>
|
||||||
|
<h2>
|
||||||
|
The Budibase client library could not be loaded. Try republishing your
|
||||||
|
app.
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
<script type="application/javascript" src={clientLibPath}>
|
<script type="application/javascript" src={clientLibPath}>
|
||||||
</script>
|
</script>
|
||||||
<script type="application/javascript">
|
<script type="application/javascript">
|
||||||
loadBudibase()
|
if (window.loadBudibase) {
|
||||||
|
window.loadBudibase()
|
||||||
|
} else {
|
||||||
|
console.error("Failed to load the Budibase client")
|
||||||
|
document.getElementById("error").style.display = "flex"
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
Loading…
Reference in New Issue