mirror of
https://github.com/emilk/egui.git
synced 2026-09-01 14:20:04 -04:00
eframe web: Better panic handling (#2942)
* Refactor: remove extra store of events * Remove unnecessary extra function * Refactor: simplify event registering * Store panic summary * egui_demo_app: move web-part to own module * index.html: await * Properly unsubscribe from events on panic * Better error handling * Demo app html: hide the wasm canvas and show an error message on panic * egui_demo_app: add panic button to test panic response on web * fix typo * Use a constructor to create WebHandle * Refactor: less use of locks in the interfaces * More consistent naming
This commit is contained in:
@@ -91,6 +91,7 @@
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
@@ -124,27 +125,58 @@
|
||||
// We'll defer our execution until the wasm is ready to go.
|
||||
// Here we tell bindgen the path to the wasm file so it can start
|
||||
// initialization and return to us a promise when it's done.
|
||||
console.debug("loading wasm…");
|
||||
console.debug("Loading wasm…");
|
||||
wasm_bindgen("./egui_demo_app_bg.wasm")
|
||||
.then(on_wasm_loaded)
|
||||
.catch(on_wasm_error);
|
||||
.catch(on_error);
|
||||
|
||||
function on_wasm_loaded() {
|
||||
console.debug("wasm loaded. starting app…");
|
||||
console.debug("Wasm loaded. Starting app…");
|
||||
|
||||
// This call installs a bunch of callbacks and then returns:
|
||||
const handle = wasm_bindgen.start("the_canvas_id");
|
||||
|
||||
// call `handle.stop_web()` to stop
|
||||
// uncomment to quick result
|
||||
// setTimeout(() => {handle.stop_web(); handle.free())}, 2000)
|
||||
|
||||
console.debug("app started.");
|
||||
document.getElementById("center_text").remove();
|
||||
let handle = new wasm_bindgen.WebHandle("the_canvas_id");
|
||||
handle.then(on_app_started).catch(on_error);
|
||||
}
|
||||
|
||||
function on_wasm_error(error) {
|
||||
function on_app_started(handle) {
|
||||
// Call `handle.destroy()` to stop. Uncomment to quick result:
|
||||
// setTimeout(() => { handle.destroy(); handle.free()) }, 2000)
|
||||
|
||||
console.debug("App started.");
|
||||
document.getElementById("center_text").innerHTML = '';
|
||||
|
||||
function check_for_panic() {
|
||||
if (handle.has_panicked()) {
|
||||
console.error("The egui app has crashed");
|
||||
|
||||
// The demo app already logs the panic message and callstack, but you
|
||||
// can access them like this if you want to show them in the html:
|
||||
// console.error(`${handle.panic_message()}`);
|
||||
// console.error(`${handle.panic_callstack()}`);
|
||||
|
||||
document.getElementById("the_canvas_id").remove();
|
||||
document.getElementById("center_text").innerHTML = `
|
||||
<p>
|
||||
The egui app has crashed.
|
||||
</p>
|
||||
<p style="font-size:14px">
|
||||
See the console for details.
|
||||
</p>
|
||||
<p style="font-size:14px">
|
||||
Reload the page to try again.
|
||||
</p>`;
|
||||
} else {
|
||||
let delay_ms = 1000;
|
||||
setTimeout(check_for_panic, delay_ms);
|
||||
}
|
||||
}
|
||||
|
||||
check_for_panic();
|
||||
}
|
||||
|
||||
function on_error(error) {
|
||||
console.error("Failed to start: " + error);
|
||||
document.getElementById("the_canvas_id").remove();
|
||||
document.getElementById("center_text").innerHTML = `
|
||||
<p>
|
||||
An error occurred during loading:
|
||||
|
||||
Reference in New Issue
Block a user