Made offers iframe init load async (#19516)

no issue

- ensures it waits for event data to load before rendering the iframe
which sometimes causes an undesired flashing experience.
This commit is contained in:
Ronald Langeveld 2024-01-18 12:38:41 +00:00 committed by GitHub
parent 66238c7ccf
commit 14bf2df834
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -19,19 +19,19 @@ const PortalFrame: React.FC<PortalFrameProps> = ({href, onDestroyed, selectedTab
if (iframeRef.current) { if (iframeRef.current) {
setIsInvisible(false); setIsInvisible(false);
} }
}, 100); // Delay to allow scripts to render }, 200); // Delay to allow scripts to render
}, [iframeRef]); // Dependencies for useCallback }, [iframeRef]); // Dependencies for useCallback
// Effect for attaching message listener // Effect for attaching message listener
useEffect(() => { useEffect(() => {
const messageListener = (event: MessageEvent) => { const messageListener = async (event: MessageEvent) => {
if (!href) { if (!href) {
return; return;
} }
const originURL = new URL(event.origin); const originURL = new URL(event.origin);
if (originURL.origin === new URL(href).origin) { if (originURL.origin === new URL(href).origin) {
if (event.data === 'portal-ready' || event.data.type === 'portal-ready') { if (await event.data === 'portal-ready' || await event.data.type === 'portal-ready') {
makeVisible(); makeVisible();
} }
} }