TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-09-24 05:05:20 -04:00
Code Issues Packages Projects Releases Wiki Activity

fix $loadScript/$loadStylesheet race condition

Browse Source
This commit is contained in:
Andrea Vos 2024-07-08 19:54:47 +02:00
parent ace8d26be0
commit 2a5399d5a3
1 changed files with 32 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
plugins/globals.ts
View File

@ -80,13 +80,38 @@ const plugin: Plugin = ({ app, store }, inject) => {
store.commit('showTranslationMode');
}
const awaitLoadedClass = (node: Element): Promise<void> => {
return new Promise((resolve) => {
if (node.classList.contains('loaded')) {
resolve();
} else {
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
const target = mutation.target as Element;
if (target.classList.contains('loaded')) {
observer.disconnect();
resolve();
}
});
});
observer.observe(node, { attributes: true, attributeFilter: ['class'] });
}
});
};
inject('loadScript', (name: string, src: string, nonce: string | undefined = undefined): Promise<void> => {
if (!process.client || document.querySelectorAll(`script.${name}-script`).length > 0) {
if (!process.client) {
return new Promise((resolve) => {
resolve();
});
}
const existingScriptNode = document.querySelector(`script.${name}-script`);
if (existingScriptNode) {
return awaitLoadedClass(existingScriptNode);
}
return new Promise((resolve, reject) => {
const script = document.createElement('script');
script.setAttribute('src', src);
@ -107,12 +132,17 @@ const plugin: Plugin = ({ app, store }, inject) => {
});
inject('loadStylesheet', (name: string, src: string): Promise<void> => {
if (!process.client || document.querySelectorAll(`link.${name}-stylesheet`).length > 0) {
if (!process.client) {
return new Promise((resolve) => {
resolve();
});
}
const existingLinkNode = document.querySelector(`link.${name}-stylesheet`);
if (existingLinkNode) {
return awaitLoadedClass(existingLinkNode);
}
return new Promise((resolve, reject) => {
const link = document.createElement('link');
link.setAttribute('rel', 'stylesheet');