From a8eae6dda7624ebe651e921be487f9ae9144e854 Mon Sep 17 00:00:00 2001 From: ALVAROPING1 Date: Tue, 30 Sep 2025 15:23:16 +0200 Subject: [PATCH] fixed race condition on architecture load on web Apparently even if `Vue.App.mounted` is defined as an async function, the page is rendered before the function finishes, so we can't rely on it to wait for wasm async loading. We need the actual onclick methods that use wasm to be themselves async --- .../creator_uielto_toolbar_btngroup.js | 4 ++-- .../creator_uielto_backup.js | 3 ++- .../creator_uielto_new_architecture.js | 7 ++++--- .../creator_uielto_preload_architecture.js | 20 ++++++++++--------- js/app.js | 4 ++-- js/creator_preload.js | 4 ++-- 6 files changed, 23 insertions(+), 19 deletions(-) diff --git a/components/general/creator_uielto_toolbar_btngroup.js b/components/general/creator_uielto_toolbar_btngroup.js index 793cd2086..8a6001b2e 100644 --- a/components/general/creator_uielto_toolbar_btngroup.js +++ b/components/general/creator_uielto_toolbar_btngroup.js @@ -102,9 +102,9 @@ // Architecture Selector // - load_arch_select(arch) + async load_arch_select(arch) { - uielto_preload_architecture.methods.load_arch_select(arch); + await uielto_preload_architecture.methods.load_arch_select(arch); //Close all toast and refresh app.$bvToast.hide() diff --git a/components/load_architecture/creator_uielto_backup.js b/components/load_architecture/creator_uielto_backup.js index a3370720b..9db03ae97 100644 --- a/components/load_architecture/creator_uielto_backup.js +++ b/components/load_architecture/creator_uielto_backup.js @@ -49,8 +49,9 @@ }, //Load backup from cache - load_copy() + async load_copy() { + await wasm_loader; // wait for wasm to be loaded //Load architecture from cache const arch_json = localStorage.getItem("backup_arch") var aux_architecture = JSON.parse(arch_json); diff --git a/components/load_architecture/creator_uielto_new_architecture.js b/components/load_architecture/creator_uielto_new_architecture.js index 7f77de54f..d1ed24a96 100644 --- a/components/load_architecture/creator_uielto_new_architecture.js +++ b/components/load_architecture/creator_uielto_new_architecture.js @@ -41,8 +41,8 @@ show_loading(); //Read architecture JSON - $.getJSON('architecture/new_arch.json' + "?v=" + new Date().getTime(), function(cfg){ - uielto_new_architecture.methods.load_arch_select_aux(cfg); + $.getJSON('architecture/new_arch.json' + "?v=" + new Date().getTime(), async function(cfg){ + await uielto_new_architecture.methods.load_arch_select_aux(cfg); //Refresh UI hide_loading(); @@ -58,8 +58,9 @@ }, //Load architecture in CREATOR - load_arch_select_aux(cfg) + async load_arch_select_aux(cfg) { + await wasm_loader; // wait for wasm to be loaded //Load architecture var aux_architecture = cfg; architecture = register_value_deserialize(aux_architecture); diff --git a/components/load_architecture/creator_uielto_preload_architecture.js b/components/load_architecture/creator_uielto_preload_architecture.js index 971ba4574..ba57156ab 100644 --- a/components/load_architecture/creator_uielto_preload_architecture.js +++ b/components/load_architecture/creator_uielto_preload_architecture.js @@ -19,6 +19,7 @@ * */ +let wasm_loader; let wasm; /* jshint esversion: 6 */ @@ -97,9 +98,9 @@ let wasm; }); //Read architecture JSON - $.getJSON('architecture/'+e.file+'.json' + "?v=" + new Date().getTime(), function(cfg){ + $.getJSON('architecture/'+e.file+'.json' + "?v=" + new Date().getTime(), async function(cfg){ try { - uielto_preload_architecture.methods.load_arch_select_aux(cfg, true, e); + await uielto_preload_architecture.methods.load_arch_select_aux(cfg, true, e); show_notification(e.name + ' architecture has been loaded correctly', 'success'); } catch (error) { show_notification(e.name + ' architecture is invalid: ' + error, 'danger'); @@ -120,7 +121,7 @@ let wasm; }, //Load selected architecture on CREATOR - load_arch_select(e) + async load_arch_select(e) { show_loading(); @@ -138,7 +139,7 @@ let wasm; { var aux_architecture = JSON.parse(load_architectures[i].architecture); try { - uielto_preload_architecture.methods.load_arch_select_aux(aux_architecture, true, e); + await uielto_preload_architecture.methods.load_arch_select_aux(aux_architecture, true, e); show_notification(e.name + ' architecture has been loaded correctly', 'success'); } catch (error) { show_notification(e.name + ' architecture is invalid: ' + error, 'danger'); @@ -159,9 +160,9 @@ let wasm; }); //Read architecture JSON - $.getJSON('architecture/'+e.file+'.json' + "?v=" + new Date().getTime(), function(cfg){ + $.getJSON('architecture/'+e.file+'.json' + "?v=" + new Date().getTime(), async function(cfg){ try { - uielto_preload_architecture.methods.load_arch_select_aux(cfg, true, e); + await uielto_preload_architecture.methods.load_arch_select_aux(cfg, true, e); show_notification(e.name + ' architecture has been loaded correctly', 'success'); } catch (error) { show_notification(e.name + ' architecture is invalid: ' + error, 'danger'); @@ -180,8 +181,9 @@ let wasm; }, //Load architecture in CREATOR - load_arch_select_aux(cfg, load_associated_examples, e) + async load_arch_select_aux(cfg, load_associated_examples, e) { + await wasm_loader; // wait for wasm to be loaded //Load architecture var aux_architecture = cfg; architecture = register_value_deserialize(aux_architecture); @@ -272,8 +274,8 @@ let wasm; //If no current_architecture loaded then load the associated if (current_architecture == '') { - $.getJSON('architecture/'+ set[i].architecture +'.json', function(cfg) { - uielto_preload_architecture.methods.load_arch_select_aux(cfg, false, null); + $.getJSON('architecture/'+ set[i].architecture +'.json', async function(cfg) { + await uielto_preload_architecture.methods.load_arch_select_aux(cfg, false, null); }) ; } diff --git a/js/app.js b/js/app.js index efc890203..e9b5cedd2 100644 --- a/js/app.js +++ b/js/app.js @@ -279,9 +279,9 @@ try /************************ * Mounted vue instance * ************************/ - async mounted(){ + mounted(){ this.validate_browser(); - await this.load_compiler_wasm(); + wasm_loader = this.load_compiler_wasm(); uielto_backup.methods.backup_modal(this); //Pre-load following URL params diff --git a/js/creator_preload.js b/js/creator_preload.js index 5aa00e89d..34a4637dd 100644 --- a/js/creator_preload.js +++ b/js/creator_preload.js @@ -111,9 +111,9 @@ } return $.getJSON( 'architecture/available_arch.json', - function (arch_availables) { + async function (arch_availables) { var a_i = preload_find_architecture(arch_availables, arch_name) ; - uielto_preload_architecture.methods.load_arch_select(a_i) ; + await uielto_preload_architecture.methods.load_arch_select(a_i) ; return 'Architecture loaded.' ; } ) ;