fix: allow to override included modules (#77)

vaadin · Nov 24, 2020 · 4b5aad6 · 4b5aad6
1 parent ff8408f
commit 4b5aad6
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/register-styles.html b/register-styles.html
@@ -64,8 +64,8 @@
 
     themeModuleElement.innerHTML = `
       <template>
-        ${styles.map(style => `<style include=${styleMap[style]}></style>`)}
         ${moduleIncludes.map(include => `<style include=${include}></style>`)}
+        ${styles.map(style => `<style include=${styleMap[style]}></style>`)}
       </template>
     `;
 

diff --git a/test/register-styles.html b/test/register-styles.html
@@ -138,6 +138,19 @@
           expect(window.getComputedStyle(instance).color).to.equal('rgb(255, 0, 0)');
         });
 
+        it('should include style modules before the component styles', () => {
+          registerStyles(undefined, css`:host {
+            color: rgb(255, 0, 0);
+          }`, {moduleId: unique('id')});
+
+          registerStyles(unique('component'), css`:host {
+            color: rgb(0, 0, 255);
+          }`, {include: [unique('id')]});
+
+          const instance = defineAndInstantiate(unique('component'));
+          expect(window.getComputedStyle(instance).color).to.equal('rgb(0, 0, 255)');
+        });
+
         it('should not add a theme-for attribute to the module with id', () => {
           registerStyles(undefined, css`:host {
             color: rgb(255, 0, 0);