edge-city

edge-city is a next level meta-framework for react that runs only on edge runtimes

8ef8a7ec — Peter John

Fix duplicate css dom nodes

Files changed (1) hide show

packages/parotta/router.js CHANGED Viewed

@@ -112,17 +112,27 @@ export const Router = ({ App, history, radixRouter }) => {
   const [match, setMatch] = useState(() => getMatch(radixRouter, history.location.pathname));
   useEffect(() => {
     return history.listen(({ location }) => {
+      const href = getCssUrl(location.pathname);
+      const isLoaded = Array.from(document.getElementsByTagName("link"))
+        .map((link) => link.href.replace(window.origin, "")).includes(href);
+      if (!isLoaded) {
-      var link = document.createElement('link');
+        const link = document.createElement('link');
-      link.setAttribute("rel", "stylesheet");
+        link.setAttribute("rel", "stylesheet");
-      link.setAttribute("type", "text/css");
+        link.setAttribute("type", "text/css");
-      link.onload = () => {
+        link.onload = () => {
+          nProgress.start();
+          startTransition(() => {
+            setMatch(getMatch(radixRouter, location.pathname));
+          })
+        };
+        link.setAttribute("href", href);
+        document.getElementsByTagName("head")[0].appendChild(link);
+      } else {
         nProgress.start();
         startTransition(() => {
           setMatch(getMatch(radixRouter, location.pathname));
         })
-      };
+      }
-      link.setAttribute("href", getCssUrl(location.pathname));
-      document.getElementsByTagName("head")[0].appendChild(link);
     });
   }, [])
   console.log('Router');