fix: remove rule if there's no other decls (#769)

tivac · Jun 29, 2020 · 9215873 · 9215873
1 parent aa653e4
commit 9215873
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 4 deletions.
diff --git a/packages/processor/plugins/composition.js b/packages/processor/plugins/composition.js
@@ -79,11 +79,15 @@ module.exports = (css, result) => {
  }
  });
 
- const next = decl.next();
-
  // Remove just the composes declaration if there are other declarations
- if(next) {
- next.raws.before = decl.raw("before");
+ if(decl.parent.nodes.length > 1) {
+ // If there's nodes after this one adjust their positioning
+ // so it's like the composes was never there
+ const next = decl.next();
+
+ if(next) {
+ next.raws.before = decl.raw("before");
+ }
 
  return decl.remove();
  }

diff --git a/packages/processor/test/__snapshots__/composition.test.js.snap b/packages/processor/test/__snapshots__/composition.test.js.snap
@@ -73,3 +73,26 @@ Object {
  },
 }
 `;
+
+exports[`/processor.js composition should remove \`composes\` from the output css (composes first) 1`] = `
+"/* remove-composes.css */
+.a { color: red; }
+.b { background: blue; }"
+`;
+
+exports[`/processor.js composition should remove \`composes\` from the output css (composes last) 1`] = `
+"/* remove-composes.css */
+.a { color: red; }
+.b { background: blue; }"
+`;
+
+exports[`/processor.js composition should remove \`composes\` from the output css (composes middle) 1`] = `
+"/* remove-composes.css */
+.a { color: red; }
+.b { background: blue; border-color: green; }"
+`;
+
+exports[`/processor.js composition should remove \`composes\` from the output css (only composes) 1`] = `
+"/* remove-composes.css */
+.a { color: red; }"
+`;
diff --git a/packages/processor/test/composition.test.js b/packages/processor/test/composition.test.js
@@ -182,5 +182,30 @@ describe("/processor.js", () => {
 
  expect(compositions).toMatchSnapshot();
  });
+
+ it.each([
+ [ "only composes", dedent(`
+ .a { color: red; }
+ .b { composes: a; }
+ `) ],
+ [ "composes first", dedent(`
+ .a { color: red; }
+ .b { composes: a; background: blue; }
+ `) ],
+ [ "composes last", dedent(`
+ .a { color: red; }
+ .b { background: blue; composes: a; }
+ `) ],
+ [ "composes middle", dedent(`
+ .a { color: red; }
+ .b { background: blue; composes: a; border-color: green; }
+ `) ],
+ ])("should remove `composes` from the output css (%s)", async (name, input) => {
+ await processor.string("./remove-composes.css", input);
+
+ const { css } = await processor.output();
+
+ expect(css).toMatchSnapshot();
+ });
  });
 });