move to require.extensions ava approach

package.json

@@ -25,7 +25,7 @@
   },
   "scripts": {
     "test": "ava",
-    "start": "ava --watch --serial",
+    "start": "ava --watch",
     "beforeStage": "npx auto-changelog"
   },
   "devDependencies": {
@@ -34,6 +34,7 @@
     "ava": "^1.0.1",
     "del": "^3.0.0",
     "node-sass": "^4.11.0",
+    "require-extension-hooks": "^0.3.3",
     "sass": "^1.15.2",
     "write": "^1.0.3"
   },
@@ -46,8 +47,17 @@
   },
   "ava": {
     "verbose": true,
+    "extensions": [
+      "scss"
+    ],
+    "compileEnhancements": false,
+    "require": [
+      "./tests/helpers/setup.js"
+    ],
     "files": [
-      "tests/*{.js,.scss}"
+      "tests/*.scss",
+      "!**/_*/**",
+      "!**/_*"
     ],
     "sources": [
       "_index.scss",

tests/_holding/renders/scratch.dartsass.css

@@ -0,0 +1,38 @@
+.private {
+  result: 1.5;
+  result: 0.15;
+  /* NB ref units will always be px or rem */
+  result: 0.8333333333;
+  result: 1.2;
+}
+
+.bad-args {
+  /* domain units must be em, %, or one of vw, vh, vmin, vmax */
+  result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $domain [1rem] invalid; unit must be one of the following: vw, vh, vmin, vmax, %, em";
+  /* table key units must be px or rem */
+  result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table key [50%] invalid; unit must be rem or px";
+  /* domain v* allows only px and rem table vals */
+  /* domain % allows only px, rem and % table vals */
+  result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table $val [0.5em] invalid for $domain 100%; unit must be one of the following: px rem %";
+  /* domain em allows px, rem, % and em table vals */
+}
+
+.viewport-relative {
+  result: calc(75vw - 100px);
+  result: calc(8vw + 16px);
+}
+
+.parent-relative {
+  /* following should be equal */
+  result: calc(0.8333333333em + 13.3333333333px);
+  result: calc(0.8333333333em + 13.3333333333px);
+  result: calc(0.8333333333em + 13.3333333333px);
+  /* the following will mean the same, if applied to a font-size relative property e.g line-height */
+  result: calc(110% - 60px);
+  result: calc(1.1em - 60px);
+  /* container related */
+  result: calc(110% - 60px);
+  result: calc(30% + 20px);
+  result: calc(13.3333333333% - 1.6666666667rem);
+  result: calc(100% - 10rem);
+}

tests/_holding/renders/scratch.libsass.css

@@ -0,0 +1,38 @@
+.private {
+  result: 1.5;
+  result: 0.15;
+  /* NB ref units will always be px or rem */
+  result: 0.83333;
+  result: 1.2;
+}
+
+.bad-args {
+  /* domain units must be em, %, or one of vw, vh, vmin, vmax */
+  result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $domain [1rem] invalid; unit must be one of the following: vw, vh, vmin, vmax, %, em";
+  /* table key units must be px or rem */
+  result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table key [50%] invalid; unit must be rem or px";
+  /* domain v* allows only px and rem table vals */
+  /* domain % allows only px, rem and % table vals */
+  result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table $val [0.5em] invalid for $domain 100%; unit must be one of the following: px rem %";
+  /* domain em allows px, rem, % and em table vals */
+}
+
+.viewport-relative {
+  result: calc(75vw - 100px);
+  result: calc(8vw + 16px);
+}
+
+.parent-relative {
+  /* following should be equal */
+  result: calc(0.83333em + 13.33333px);
+  result: calc(0.83333em + 13.33333px);
+  result: calc(0.83333em + 13.33333px);
+  /* the following will mean the same, if applied to a font-size relative property e.g line-height */
+  result: calc(110% - 60px);
+  result: calc(1.1em - 60px);
+  /* container related */
+  result: calc(110% - 60px);
+  result: calc(30% + 20px);
+  result: calc(13.33333% - 1.66667rem);
+  result: calc(100% - 10rem);
+}

tests/helpers/setup.js

@@ -0,0 +1,39 @@
+// @ts-nocheck
+
+var hooks = require('require-extension-hooks');
+
+hooks('.scss').push(() => {
+  return `
+    const path = require('path');
+    const writeFile = require('write');
+    const test = require('ava');
+    const compilers = {
+      dartsass: require('sass'),
+      libsass: require('node-sass'),
+    };
+
+    function render(compiler, file) {
+      return new Promise((resolve, reject) => {
+        compiler.render({
+          file,
+          includePaths: [__dirname, path.resolve(__dirname, '../node_modules')],
+          outputStyle: 'expanded',
+          precision: 10
+        }, (err, data) => {
+          if (err) reject(err.formatted);
+          else resolve(data.css.toString());
+        });
+      });
+    }
+
+    Object.keys(compilers).forEach(compiler => {
+      const outFile = path.join(__dirname, 'renders', path.relative(__dirname, __filename)).replace(/\.scss$/, '.'+compiler+'.css');
+      test(path.basename(__filename, path.extname(__filename))+'['+compiler+']', t => {
+        return render(compilers[compiler], __filename).then(css => {
+          writeFile.sync(outFile, css);
+          t.snapshot(css);
+        });
+      });
+    });
+  `;
+});

tests/renders/scratch.libsass.css

@@ -2,7 +2,7 @@
   result: 1.5;
   result: 0.15;
   /* NB ref units will always be px or rem */
-  result: 0.83333;
+  result: 0.8333333333;
   result: 1.2;
 }
 
@@ -24,15 +24,15 @@
 
 .parent-relative {
   /* following should be equal */
-  result: calc(0.83333em + 13.33333px);
-  result: calc(0.83333em + 13.33333px);
-  result: calc(0.83333em + 13.33333px);
+  result: calc(0.8333333333em + 13.3333333333px);
+  result: calc(0.8333333333em + 13.3333333333px);
+  result: calc(0.8333333333em + 13.3333333333px);
   /* the following will mean the same, if applied to a font-size relative property e.g line-height */
   result: calc(110% - 60px);
   result: calc(1.1em - 60px);
   /* container related */
   result: calc(110% - 60px);
   result: calc(30% + 20px);
-  result: calc(13.33333% - 1.66667rem);
+  result: calc(13.3333333333% - 1.6666666667rem);
   result: calc(100% - 10rem);
 }

tests/snapshots/scratch.scss.md

@@ -0,0 +1,92 @@
+# Snapshot report for `tests/scratch.scss`
+
+The actual snapshot is saved in `scratch.scss.snap`.
+
+Generated by [AVA](https://ava.li).
+
+## scratch[dartsass]
+
+> Snapshot 1
+
+    `.private {␊
+      result: 1.5;␊
+      result: 0.15;␊
+      /* NB ref units will always be px or rem */␊
+      result: 0.8333333333;␊
+      result: 1.2;␊
+    }␊
+    ␊
+    .bad-args {␊
+      /* domain units must be em, %, or one of vw, vh, vmin, vmax */␊
+      result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $domain [1rem] invalid; unit must be one of the following: vw, vh, vmin, vmax, %, em";␊
+      /* table key units must be px or rem */␊
+      result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table key [50%] invalid; unit must be rem or px";␊
+      /* domain v* allows only px and rem table vals */␊
+      /* domain % allows only px, rem and % table vals */␊
+      result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table $val [0.5em] invalid for $domain 100%; unit must be one of the following: px rem %";␊
+      /* domain em allows px, rem, % and em table vals */␊
+    }␊
+    ␊
+    .viewport-relative {␊
+      result: calc(75vw - 100px);␊
+      result: calc(8vw + 16px);␊
+    }␊
+    ␊
+    .parent-relative {␊
+      /* following should be equal */␊
+      result: calc(0.8333333333em + 13.3333333333px);␊
+      result: calc(0.8333333333em + 13.3333333333px);␊
+      result: calc(0.8333333333em + 13.3333333333px);␊
+      /* the following will mean the same, if applied to a font-size relative property e.g line-height */␊
+      result: calc(110% - 60px);␊
+      result: calc(1.1em - 60px);␊
+      /* container related */␊
+      result: calc(110% - 60px);␊
+      result: calc(30% + 20px);␊
+      result: calc(13.3333333333% - 1.6666666667rem);␊
+      result: calc(100% - 10rem);␊
+    }`
+
+## scratch[libsass]
+
+> Snapshot 1
+
+    `.private {␊
+      result: 1.5;␊
+      result: 0.15;␊
+      /* NB ref units will always be px or rem */␊
+      result: 0.8333333333;␊
+      result: 1.2;␊
+    }␊
+    ␊
+    .bad-args {␊
+      /* domain units must be em, %, or one of vw, vh, vmin, vmax */␊
+      result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $domain [1rem] invalid; unit must be one of the following: vw, vh, vmin, vmax, %, em";␊
+      /* table key units must be px or rem */␊
+      result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table key [50%] invalid; unit must be rem or px";␊
+      /* domain v* allows only px and rem table vals */␊
+      /* domain % allows only px, rem and % table vals */␊
+      result: "ERROR: lerp($table, $domain: 100vw, $rem-px: 16): $table $val [0.5em] invalid for $domain 100%; unit must be one of the following: px rem %";␊
+      /* domain em allows px, rem, % and em table vals */␊
+    }␊
+    ␊
+    .viewport-relative {␊
+      result: calc(75vw - 100px);␊
+      result: calc(8vw + 16px);␊
+    }␊
+    ␊
+    .parent-relative {␊
+      /* following should be equal */␊
+      result: calc(0.8333333333em + 13.3333333333px);␊
+      result: calc(0.8333333333em + 13.3333333333px);␊
+      result: calc(0.8333333333em + 13.3333333333px);␊
+      /* the following will mean the same, if applied to a font-size relative property e.g line-height */␊
+      result: calc(110% - 60px);␊
+      result: calc(1.1em - 60px);␊
+      /* container related */␊
+      result: calc(110% - 60px);␊
+      result: calc(30% + 20px);␊
+      result: calc(13.3333333333% - 1.6666666667rem);␊
+      result: calc(100% - 10rem);␊
+    }␊
+    `