feat: add "during" hook & support export plugins

`after` should probably just become what `during` is, it's a breaking change but not terribly different in practice. Plugins run as part of the `during` phase can add messages with a plugin name starting with `modular-css-export` and an `exports` key that will be merged into the file's exports. Fixes #401 in a roundabout way by making it possible w/o a change to core. This also makes the output module support non-array values because having to know that is just an awkward implementation detail that makes no sense for anyone but me.
tivac · Feb 18, 2018 · 943524f · 943524f
1 parent 624484e
commit 943524f
Show file tree

Hide file tree

Showing 6 changed files with 88 additions and 16 deletions.
diff --git a/packages/core/lib/output.js b/packages/core/lib/output.js
@@ -5,7 +5,11 @@ var map = require("lodash.mapvalues"),
     relative = require("./relative.js");
 
 exports.join = function(output) {
-    return map(output, (classes) => classes.join(" "));
+    return map(output, (classes) => (
+        Array.isArray(classes) ?
+            classes.join(" ") :
+            classes.toString()
+    ));
 };
 
 exports.compositions = function(cwd, processor) {

diff --git a/packages/core/processor.js b/packages/core/processor.js
@@ -87,7 +87,7 @@ function Processor(opts) {
         require("./plugins/externals.js"),
         require("./plugins/composition.js"),
         require("./plugins/keyframes.js")
-    ]);
+    ].concat(this._options.during || []));
 
     this._after = postcss(this._options.after || []);
 
@@ -134,8 +134,16 @@ Processor.prototype = {
                 return file.processed.then((result) => {
                     file.exports = Object.assign(
                         Object.create(null),
-                        mapValues(file.values, (obj) => [ obj.value ]),
-                        message(result, "classes")
+                        // export @value entries
+                        mapValues(file.values, (obj) => obj.value),
+
+                        // export classes
+                        message(result, "classes"),
+
+                        // Export anything from plugins named "modular-css-export*"
+                        result.messages
+                            .filter((msg) => msg.plugin.indexOf("modular-css-export") === 0)
+                            .reduce((prev, curr) => Object.assign(prev, curr.exports), Object.create(null))
                     );
                     file.result  = result;
                 });

diff --git a/packages/core/test/__snapshots__/options.test.js.snap b/packages/core/test/__snapshots__/options.test.js.snap
@@ -61,6 +61,23 @@ exports[`/processor.js options lifecycle options done should work with cssnano (
 
 exports[`/processor.js options lifecycle options done should work with cssnano (no preset) 1`] = `".folder{margin:2px}.booga{background:green}"`;
 
+exports[`/processor.js options lifecycle options during should include exports from 'modular-css-export' modules 1`] = `
+Object {
+  "a": true,
+  "b": false,
+}
+`;
+
+exports[`/processor.js options lifecycle options during should run async postcss plugins during processing 1`] = `
+"/* packages/core/test/specimens/async-during.css */
+a {}"
+`;
+
+exports[`/processor.js options lifecycle options during should run sync postcss plugins during processing 1`] = `
+"/* packages/core/test/specimens/sync-during.css */
+a {}"
+`;
+
 exports[`/processor.js options map should generate source maps 1`] = `
 "/* packages/core/test/specimens/folder/folder.css */
 .folder { margin: 2px; }

diff --git a/packages/core/test/__snapshots__/values.test.js.snap b/packages/core/test/__snapshots__/values.test.js.snap
@@ -41,15 +41,9 @@ Object {
   "fooga": Array [
     "fooga",
   ],
-  "local": Array [
-    "'./local.css'",
-  ],
-  "o": Array [
-    "red",
-  ],
-  "one": Array [
-    "red",
-  ],
+  "local": "'./local.css'",
+  "o": "red",
+  "one": "red",
 }
 `;
 

diff --git a/packages/core/test/issues/__snapshots__/issue-24.test.js.snap b/packages/core/test/issues/__snapshots__/issue-24.test.js.snap
@@ -6,9 +6,7 @@ Object {
     "wooga",
     "a",
   ],
-  "simple": Array [
-    "\\"./simple.css\\"",
-  ],
+  "simple": "\\"./simple.css\\"",
 }
 `;
 

diff --git a/packages/core/test/options.test.js b/packages/core/test/options.test.js
@@ -243,6 +243,57 @@ describe("/processor.js", () => {
                     .then((result) => expect(result.css).toMatchSnapshot());
                 });
             });
+
+            describe("during", () => {
+                it("should run sync postcss plugins during processing", () => {
+                    var processor = new Processor({
+                            namer,
+                            during : [ sync ]
+                        });
+
+                    return processor.string(
+                        "packages/core/test/specimens/sync-during.css",
+                        ""
+                    )
+                    .then(() => processor.output({ from : "packages/core/test/specimens/sync-during.css" }))
+                    .then((result) => expect(result.css).toMatchSnapshot());
+                });
+
+                it("should run async postcss plugins during processing", () => {
+                    var processor = new Processor({
+                            namer,
+                            during : [ async ]
+                        });
+
+                    return processor.string(
+                        "packages/core/test/specimens/async-during.css",
+                        ""
+                    )
+                    .then(() => processor.output({ from : "packages/core/test/specimens/sync-during.css" }))
+                    .then((result) => expect(result.css).toMatchSnapshot());
+                });
+
+                it("should include exports from 'modular-css-export' modules", () => {
+                    var processor = new Processor({
+                            namer,
+                            during : [ (css, result) => {
+                                result.messages.push({
+                                    plugin  : "modular-css-exporter",
+                                    exports : {
+                                        a : true,
+                                        b : false
+                                    }
+                                });
+                            } ]
+                        });
+
+                    return processor.string(
+                        "packages/core/test/specimens/async-during.css",
+                        ""
+                    )
+                    .then((file) => expect(file.exports).toMatchSnapshot());
+                });
+            });
 
             describe("after", () => {
                 it("should use postcss-url by default", () => {