feat: allow to define raw parameter

BREAKING CHANGE: the `define` option is `Array` now
webpack-contrib · Sep 10, 2020 · b5c75ed · b5c75ed
1 parent 739d46b
commit b5c75ed
Show file tree

Hide file tree

Showing 6 changed files with 72 additions and 11 deletions.
diff --git a/README.md b/README.md
@@ -85,9 +85,11 @@ module.exports = {
                 use: ['nib'],
                 include: [path.join(__dirname, 'src/styl/config')],
                 import: ['nib', path.join(__dirname, 'src/styl/mixins')],
-                define: {
-                  $development: process.env.NODE_ENV === 'development',
-                },
+                define: [
+                  // [key, value, raw]
+                  ['$development', process.env.NODE_ENV === 'development'],
+                  ['rawVar', 42, true],
+                ],
                 includeCSS: false,
                 resolveUrl: false,
               },

diff --git a/src/index.js b/src/index.js
@@ -54,8 +54,8 @@ export default async function stylusLoader(source) {
   }
 
   if (typeof stylusOptions.define !== 'undefined') {
-    for (const entry of Object.entries(stylusOptions.define)) {
-      styl.define(...entry);
+    for (const defined of stylusOptions.define) {
+      styl.define(...defined);
     }
   }
 

diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap
@@ -241,6 +241,28 @@ exports[`loader should import stylus: errors 1`] = `Array []`;
 
 exports[`loader should import stylus: warnings 1`] = `Array []`;
 
+exports[`loader should work "define" option with raw: css 1`] = `
+"section.current-stylus-support {
+  raw: \\"hash property access must use brackets\\";
+  raw: \\"hash property access must be last in selector :/\\";
+  answer: 42;
+}
+ul.frisbee-golf {
+  list-style: disc;
+}
+section.type-checks {
+  castedType: 'object';
+  rawType: 'object';
+  answer: 42;
+  hooray: \\"mixins can work around limits\\";
+}
+"
+`;
+
+exports[`loader should work "define" option with raw: errors 1`] = `Array []`;
+
+exports[`loader should work "define" option with raw: warnings 1`] = `Array []`;
+
 exports[`loader should work "define" option: css 1`] = `
 "body {
   width: 100%;

diff --git a/test/fixtures/defineRaw.styl b/test/fixtures/defineRaw.styl
@@ -0,0 +1,19 @@
+unquoteList(strings)
+  unquote(join(' ', strings))
+
+hashLookup(obj, key)
+  obj[key]
+
+section.current-stylus-support
+  raw "hash property access must use brackets"
+  raw "hash property access must be last in selector :/"
+  answer rawVar['nestedVar']
+
+ul.frisbee-golf
+  list-style unquoteList(castedVar)
+
+section.type-checks
+  castedType type(castedVar)
+  rawType type(rawVar)
+  answer hashLookup(rawVar, 'nestedVar')
+  hooray "mixins can work around limits"
diff --git a/test/loader.test.js b/test/loader.test.js
@@ -251,9 +251,26 @@ describe('loader', () => {
     const testId = './webpack.config-plugin.styl';
     const compiler = getCompiler(testId, {
       stylusOptions: {
-        define: {
-          add: (a, b) => a.operate('+', b),
-        },
+        define: [['add', (a, b) => a.operate('+', b)]],
+      },
+    });
+    const stats = await compile(compiler);
+    const codeFromBundle = getCodeFromBundle(stats, compiler);
+
+    expect(codeFromBundle.css).toMatchSnapshot('css');
+    expect(getWarnings(stats)).toMatchSnapshot('warnings');
+    expect(getErrors(stats)).toMatchSnapshot('errors');
+  });
+
+  it('should work "define" option with raw', async () => {
+    const testId = './defineRaw.styl';
+    const compiler = getCompiler(testId, {
+      stylusOptions: {
+        define: [
+          ['rawVar', { nestedVar: 42 }, true],
+          ['castedVar', { disc: 'outside' }, true],
+          ['rawDefine', ['rawVar'], true],
+        ],
       },
     });
     const stats = await compile(compiler);

diff --git a/test/validate-options.test.js b/test/validate-options.test.js
@@ -8,9 +8,10 @@ describe('validate options', () => {
         { resolveCss: true },
         { includeCSS: false },
         {
-          define: {
-            $development: process.env.NODE_ENV === 'development',
-          },
+          define: [
+            ['$development', process.env.NODE_ENV === 'development'],
+            ['rawVar', 42, true],
+          ],
         },
         () => {},
         () => {