fix: use dedicated namespace for fallback style imports (#11419)

fixes #11376
vaadin · Jul 19, 2021 · ccca69d · ccca69d
1 parent a4f3ddf
commit ccca69d
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 4 deletions.
diff --git a/flow-server/src/main/java/com/vaadin/flow/server/frontend/AbstractUpdateImports.java b/flow-server/src/main/java/com/vaadin/flow/server/frontend/AbstractUpdateImports.java
@@ -78,7 +78,7 @@ abstract class AbstractUpdateImports implements Runnable {
             + "<dom-module id=\"%s\"><template><style%s>${$css_%d}</style></template></dom-module>"
             + CSS_POST;
     private static final String CSS_THEME_FOR_TPL = CSS_PRE
-            + "<dom-module id=\"flow_css_mod_%d\" theme-for=\"%s\"><template><style%s>${$css_%d}</style></template></dom-module>"
+            + "<dom-module id=\"%s_%d\" theme-for=\"%s\"><template><style%s>${$css_%d}</style></template></dom-module>"
             + CSS_POST;
 
     private static final String IMPORT_TEMPLATE = "import '%s';";
@@ -290,6 +290,10 @@ protected void addLines(Collection<String> lines, String content) {
         lines.addAll(Arrays.asList(content.split("\\R")));
     }
 
+    protected String getThemeIdPrefix() {
+        return "flow_css_mod";
+    }
+
     protected abstract String getImportsNotFoundMessage();
 
     private void collectModules(List<String> lines) {
@@ -473,8 +477,8 @@ private boolean addCssLines(Collection<String> lines, CssData cssData,
                 : "";
 
         if (cssData.getThemefor() != null) {
-            addLines(lines, String.format(CSS_THEME_FOR_TPL, i, cssImport, i,
-                    cssData.getThemefor(), include, i));
+            addLines(lines, String.format(CSS_THEME_FOR_TPL, i, cssImport,
+                    getThemeIdPrefix(), i, cssData.getThemefor(), include, i));
         } else if (cssData.getId() != null) {
             addLines(lines, String.format(CSS_MODULE_TPL, i, cssImport,
                     cssData.getId(), include, i));

diff --git a/flow-server/src/main/java/com/vaadin/flow/server/frontend/TaskUpdateImports.java b/flow-server/src/main/java/com/vaadin/flow/server/frontend/TaskUpdateImports.java
@@ -301,6 +301,11 @@ protected String getImportsNotFoundMessage() {
             return getAbsentPackagesMessage();
         }
 
+        @Override
+        protected String getThemeIdPrefix() {
+            return "fallback_" + super.getThemeIdPrefix();
+        }
+
         File getGeneratedFallbackFile() {
             return generatedFallBack;
         }

diff --git a/flow-server/src/test/java/com/vaadin/flow/server/frontend/NodeUpdateImportsTest.java b/flow-server/src/test/java/com/vaadin/flow/server/frontend/NodeUpdateImportsTest.java
@@ -146,6 +146,11 @@ Logger log() {
         Assert.assertThat(mainContent, CoreMatchers.containsString(
                 "addCssBlock(`<custom-style><style>${$css_0}</style></custom-style>`);"));
 
+        Assert.assertThat(mainContent, CoreMatchers
+                .containsString("import $css_5 from 'Frontend/foo.css';"));
+        Assert.assertThat(mainContent, CoreMatchers.containsString(
+                "addCssBlock(`<dom-module id=\"flow_css_mod_5\" theme-for=\"foo-bar\"><template><style>${$css_5}</style></template></dom-module>`);"));
+
         // Contains theme imports
         Assert.assertThat(mainContent, CoreMatchers.containsString(
                 "import '@vaadin/vaadin-lumo-styles/color.js';"));
@@ -200,7 +205,7 @@ Logger log() {
         Assert.assertThat(fallBackContent, CoreMatchers.containsString(
                 "import $css_0 from 'Frontend/extra-css.css';"));
         Assert.assertThat(fallBackContent, CoreMatchers.containsString(
-                "addCssBlock(`<dom-module id=\"flow_css_mod_0\" theme-for=\"extra-foo\"><template><style include=\"extra-bar\">${$css_0}</style></template></dom-module>`);"));
+                "addCssBlock(`<dom-module id=\"fallback_flow_css_mod_0\" theme-for=\"extra-foo\"><template><style include=\"extra-bar\">${$css_0}</style></template></dom-module>`);"));
 
         // Does not contains JS module imports
         Assert.assertThat(fallBackContent, CoreMatchers.not(CoreMatchers