fix(idaa): load Jitsi external API script dynamically to eliminate race condition
<svelte:head> scripts load asynchronously with no lifecycle hook to await completion, so onMount could call init_jitsi() before JitsiMeetExternalAPI was defined. Replace with a dynamic script loader that is awaited between fetch_novi_data() and init_jitsi(). Also uses the domain from URL params rather than the hardcoded jitsi.dgrzone.com hostname. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -524,9 +524,31 @@ async function fetch_novi_data() {
|
|||||||
email_input = email ?? '';
|
email_input = email ?? '';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Dynamically loads the Jitsi external API script for a given domain and waits for it.
|
||||||
|
* Using <svelte:head> for this script is not reliable — it loads asynchronously and there
|
||||||
|
* is no lifecycle hook to await its completion, causing a race with onMount/init_jitsi.
|
||||||
|
* Loading it here lets us sequence it correctly: fetch_novi_data → load script → init_jitsi.
|
||||||
|
*/
|
||||||
|
function load_jitsi_script(jitsi_domain: string): Promise<void> {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
// @ts-expect-error — JitsiMeetExternalAPI is a global injected by the Jitsi script
|
||||||
|
if (typeof JitsiMeetExternalAPI !== 'undefined') {
|
||||||
|
resolve(); // Already loaded (e.g. resync after first load)
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const script = document.createElement('script');
|
||||||
|
script.src = `https://${jitsi_domain}/external_api.js`;
|
||||||
|
script.onload = () => resolve();
|
||||||
|
script.onerror = () => reject(new Error(`Failed to load Jitsi script from ${jitsi_domain}`));
|
||||||
|
document.head.appendChild(script);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
async function handle_novi_resync() {
|
async function handle_novi_resync() {
|
||||||
console.log('Jitsi: Manually re-syncing Novi Data...');
|
console.log('Jitsi: Manually re-syncing Novi Data...');
|
||||||
await fetch_novi_data();
|
await fetch_novi_data();
|
||||||
|
await load_jitsi_script(domain ?? 'jitsi.dgrzone.com');
|
||||||
await init_jitsi();
|
await init_jitsi();
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -536,11 +558,24 @@ onMount(async () => {
|
|||||||
'Jitsi: onMount - fetching user data and initializing Jitsi...'
|
'Jitsi: onMount - fetching user data and initializing Jitsi...'
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
// $ae_loc.sys_menu.hide = true;
|
|
||||||
|
|
||||||
await fetch_novi_data();
|
await fetch_novi_data();
|
||||||
|
|
||||||
// --- All data fetched, now initialize Jitsi ---
|
if (!domain) {
|
||||||
|
console.error('Jitsi: domain not set after fetch_novi_data — cannot load Jitsi script.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
await load_jitsi_script(domain);
|
||||||
|
} catch (err) {
|
||||||
|
console.error('Jitsi: Failed to load external API script:', err);
|
||||||
|
const container = document.getElementById(jitsi_container_id);
|
||||||
|
if (container) container.innerHTML = '<h1>Jitsi API script failed to load. Please refresh the page.</h1>';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// --- All data fetched and script ready, now initialize Jitsi ---
|
||||||
await init_jitsi();
|
await init_jitsi();
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -832,9 +867,6 @@ async function init_jitsi() {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<svelte:head>
|
|
||||||
<script src="https://jitsi.dgrzone.com/external_api.js"></script>
|
|
||||||
</svelte:head>
|
|
||||||
|
|
||||||
{#if show_jitsi_container}
|
{#if show_jitsi_container}
|
||||||
<div id={jitsi_container_id} class="jitsi-container"></div>
|
<div id={jitsi_container_id} class="jitsi-container"></div>
|
||||||
|
|||||||
Reference in New Issue
Block a user