This commit is contained in:
Joseph Garrone 2024-10-19 02:19:41 +02:00
parent f3a97b2538
commit d2e518d96b
5 changed files with 62 additions and 4 deletions

View File

@ -2,6 +2,7 @@ import { useEffect } from "react";
import { useInsertScriptTags } from "keycloakify/tools/useInsertScriptTags";
import { assert } from "keycloakify/tools/assert";
import { KcContext } from "keycloakify/login/KcContext/KcContext";
import { waitForElementMountedOnDom } from "keycloakify/tools/waitForElementMountedOnDom";
type KcContextLike = {
url: {
@ -67,6 +68,12 @@ export function useScript(params: { authButtonId: string; kcContext: KcContextLi
return;
}
insertScriptTags();
(async () => {
await waitForElementMountedOnDom({
elementId: authButtonId
});
insertScriptTags();
})();
}, [isFetchingTranslations]);
}

View File

@ -1,5 +1,6 @@
import { useEffect } from "react";
import { useInsertScriptTags } from "keycloakify/tools/useInsertScriptTags";
import { waitForElementMountedOnDom } from "keycloakify/tools/waitForElementMountedOnDom";
type I18nLike = {
msgStr: (key: "recovery-codes-download-file-header" | "recovery-codes-download-file-description" | "recovery-codes-download-file-date") => string;
@ -137,6 +138,12 @@ export function useScript(params: { olRecoveryCodesListId: string; i18n: I18nLik
return;
}
insertScriptTags();
(async () => {
await waitForElementMountedOnDom({
elementId: olRecoveryCodesListId
});
insertScriptTags();
})();
}, [isFetchingTranslations]);
}

View File

@ -2,6 +2,7 @@ import { useEffect } from "react";
import { useInsertScriptTags } from "keycloakify/tools/useInsertScriptTags";
import { assert } from "keycloakify/tools/assert";
import { KcContext } from "keycloakify/login/KcContext/KcContext";
import { waitForElementMountedOnDom } from "keycloakify/tools/waitForElementMountedOnDom";
type KcContextLike = {
url: {
@ -59,6 +60,12 @@ export function useScript(params: { authButtonId: string; kcContext: KcContextLi
return;
}
insertScriptTags();
(async () => {
await waitForElementMountedOnDom({
elementId: authButtonId
});
insertScriptTags();
})();
}, [isFetchingTranslations]);
}

View File

@ -2,6 +2,7 @@ import { useEffect } from "react";
import { useInsertScriptTags } from "keycloakify/tools/useInsertScriptTags";
import { assert } from "keycloakify/tools/assert";
import { KcContext } from "keycloakify/login/KcContext/KcContext";
import { waitForElementMountedOnDom } from "keycloakify/tools/waitForElementMountedOnDom";
type KcContextLike = {
url: {
@ -88,6 +89,12 @@ export function useScript(params: { authButtonId: string; kcContext: KcContextLi
return;
}
insertScriptTags();
(async () => {
await waitForElementMountedOnDom({
elementId: authButtonId
});
insertScriptTags();
})();
}, [isFetchingTranslations]);
}

View File

@ -0,0 +1,30 @@
export async function waitForElementMountedOnDom(params: {
elementId: string;
}): Promise<void> {
const { elementId } = params;
const getElement = () => document.getElementById(elementId);
const element = getElement();
if (element === null) {
let prElementPresentInTheDom_resolve: () => void;
const prElementPresentInTheDom = new Promise<void>(
resolve => (prElementPresentInTheDom_resolve = resolve)
);
// Observe the dom for the element to be added
const observer = new MutationObserver(() => {
const element = getElement();
if (element === null) {
return;
}
observer.disconnect();
prElementPresentInTheDom_resolve();
});
observer.observe(document.body, { childList: true, subtree: true });
await prElementPresentInTheDom;
}
}