From afca8f8be986fda6e719f0140f481436642940bd Mon Sep 17 00:00:00 2001
From: MARCHAND MANON <manonmarchand22@gmail.com>
Date: Thu, 29 Aug 2024 16:01:04 +0200
Subject: [PATCH] fix: also add style sheet in shadow dom context

---
 vite.config.ts | 40 +++++++++++++++++++++++++++++++++++++++-
 1 file changed, 39 insertions(+), 1 deletion(-)

diff --git a/vite.config.ts b/vite.config.ts
index 42de5020..65da88aa 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -38,7 +38,45 @@ export default defineConfig({
         glsl({
             compress: true,
         }),
-        cssInjectedByJsPlugin(),
+        // make sure that the CSS is also included in ShadowDOMs. 
+        // Extracted from https://github.com/marco-prontera/vite-plugin-css-injected-by-js/issues/128
+        cssInjectedByJsPlugin({
+            styleId: "aladin-css",
+            injectCodeFunction: async function injectCodeCustomRunTimeFunction(cssCode) {
+                function getAladinDiv(divName: string): Promise<Element | null> {
+                    return new Promise((resolve) => {
+                      if (document.querySelector(divName)) {
+                        return resolve(document.querySelector(divName));
+                      }
+                      const observer = new MutationObserver(() => {
+                        if (document.querySelector(divName)) {
+                          observer.disconnect();
+                          resolve(document.querySelector(divName));
+                        }
+                      });
+          
+                      observer.observe(document.body, {
+                        childList: true,
+                        subtree: true,
+                      });
+                    });
+                  }
+
+
+                try {
+                    if (typeof document != 'undefined') {
+                        let elementStyle = document.createElement('style');
+                        elementStyle.id = "aladin-css";
+                        elementStyle.appendChild(document.createTextNode(cssCode));
+                        document.head.appendChild(elementStyle);
+                        let aladinDiv = await getAladinDiv("aladin-container")
+                        aladinDiv?.shadowRoot?.appendChild(elementStyle);
+                    }
+                } catch (e) {
+                    console.error('vite-plugin-css-injected-by-js', e);
+                }
+            }
+        }),
     ],
     resolve: {
         alias: [