fix: Fix loading of stylesheet when it's already preloaded.

open-craft · Jul 29, 2024 · 0b3c440 · 0b3c440
1 parent 24acfac
commit 0b3c440
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 7 deletions.
diff --git a/src/react/AppProvider.jsx b/src/react/AppProvider.jsx
@@ -89,6 +89,8 @@ export default function AppProvider({ store, children, wrapWithRouter }) {
     return null;
   }
 
+  console.log({locale});
+
   return (
     <IntlProvider locale={locale} messages={getMessages()}>
       <ErrorBoundary>

diff --git a/src/react/hooks/paragon/useParagonThemeCore.js b/src/react/hooks/paragon/useParagonThemeCore.js
@@ -34,11 +34,11 @@ const useParagonThemeCore = ({
       setIsBrandThemeCoreLoaded(true);
       return;
     }
-    const getParagonThemeCoreLink = () => document.head.querySelector('link[data-paragon-theme-core="true"');
-    const existingCoreThemeLink = document.head.querySelector(`link[href='${themeCore.urls.default}']`);
+    const getParagonThemeCoreLink = () => document.head.querySelector('link[data-paragon-theme-core="true"][rel=stylesheet]');
+    const existingCoreThemeLink = document.head.querySelector(`link[href='${themeCore.urls.default}'][rel=stylesheet]`);
     if (!existingCoreThemeLink) {
       const getExistingCoreThemeLinks = (isBrandOverride) => {
-        const coreThemeLinkSelector = `link[data-${isBrandOverride ? 'brand' : 'paragon'}-theme-core="true"]`;
+        const coreThemeLinkSelector = `link[data-${isBrandOverride ? 'brand' : 'paragon'}-theme-core="true"][rel=stylesheet]`;
         return document.head.querySelectorAll(coreThemeLinkSelector);
       };
       const createCoreThemeLink = (
@@ -131,3 +131,4 @@ const useParagonThemeCore = ({
 };
 
 export default useParagonThemeCore;
+
diff --git a/src/react/hooks/paragon/useParagonThemeVariants.js b/src/react/hooks/paragon/useParagonThemeVariants.js
@@ -77,12 +77,12 @@ const useParagonThemeVariants = ({
         setIsBrandThemeVariantLoaded(true);
         return;
       }
-      const getParagonThemeVariantLink = () => document.head.querySelector(`link[data-paragon-theme-variant='${themeVariant}']`);
-      const existingThemeVariantLink = document.head.querySelector(`link[href='${value.urls.default}']`);
-      const existingThemeVariantBrandLink = document.head.querySelector(`link[href='${value.urls.brandOverride}']`);
+      const getParagonThemeVariantLink = () => document.head.querySelector(`link[data-paragon-theme-variant='${themeVariant}'][rel=stylesheet]`);
+      const existingThemeVariantLink = document.head.querySelector(`link[href='${value.urls.default}'][rel=stylesheet]`);
+      const existingThemeVariantBrandLink = document.head.querySelector(`link[href='${value.urls.brandOverride}'][rel=stylesheet]`);
 
       const getExistingThemeVariantLinks = (isBrandOverride) => {
-        const themeVariantLinkSelector = `link[data-${isBrandOverride ? 'brand' : 'paragon'}-theme-variant='${themeVariant}']`;
+        const themeVariantLinkSelector = `link[data-${isBrandOverride ? 'brand' : 'paragon'}-theme-variant='${themeVariant}'][rel=stylesheet]`;
         return document.head.querySelectorAll(themeVariantLinkSelector);
       };