tailwind SCSS test

parcel-bundler · Dec 14, 2021 · 009577f · 009577f
1 parent b3b56e6
commit 009577f
Show file tree

Hide file tree

Showing 9 changed files with 264 additions and 50 deletions.
diff --git a/packages/core/integration-tests/package.json b/packages/core/integration-tests/package.json
@@ -12,6 +12,7 @@
     "test-ci": "yarn test --reporter mocha-multi-reporters --reporter-options configFile=./test/mochareporters.json"
   },
   "devDependencies": {
+    "autoprefixer": "^10.4.0",
     "@babel/core": "^7.12.0",
     "@babel/plugin-syntax-class-properties": "^7.12.1",
     "@babel/plugin-syntax-export-default-from": "^7.2.0",
@@ -52,6 +53,7 @@
     "react-dom": "^16.11.0",
     "rimraf": "^2.6.1",
     "sugarss": "^3.0.3",
+    "tailwindcss": "^3.0.2",
     "tempy": "^0.3.0",
     "ws": "^7.0.0"
   }

diff --git a/packages/core/integration-tests/test/integration/tailwind-scss/.postcssrc.js b/packages/core/integration-tests/test/integration/tailwind-scss/.postcssrc.js
@@ -0,0 +1,7 @@
+const path = require("path");
+
+module.exports = {
+  plugins: [
+      require('tailwindcss')(path.resolve(__dirname, "tailwind.config.js")),
+  ]
+}
diff --git a/packages/core/integration-tests/test/integration/tailwind-scss/index.html b/packages/core/integration-tests/test/integration/tailwind-scss/index.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <link rel="stylesheet" href="index.scss">
+  </head>
+  <body class="p-2">
+    test
+  </body>
+</html>
diff --git a/packages/core/integration-tests/test/integration/tailwind-scss/index.scss b/packages/core/integration-tests/test/integration/tailwind-scss/index.scss
@@ -0,0 +1,7 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+body {
+  @apply p-4 m-4;
+}
diff --git a/packages/core/integration-tests/test/integration/tailwind-scss/package.json b/packages/core/integration-tests/test/integration/tailwind-scss/package.json
@@ -0,0 +1,3 @@
+{
+
+}
diff --git a/packages/core/integration-tests/test/integration/tailwind-scss/tailwind.config.js b/packages/core/integration-tests/test/integration/tailwind-scss/tailwind.config.js
@@ -0,0 +1,7 @@
+module.exports = {
+    content: ["index.html"],
+    theme: {
+        extend: {},
+    },
+    plugins: [],
+}
diff --git a/packages/core/integration-tests/test/integration/tailwind-scss/yarn.lock b/packages/core/integration-tests/test/integration/tailwind-scss/yarn.lock
diff --git a/packages/core/integration-tests/test/tailwind.js b/packages/core/integration-tests/test/tailwind.js
@@ -0,0 +1,17 @@
+import assert from 'assert';
+import path from 'path';
+import {bundle, outputFS} from '@parcel/test-utils';
+
+describe('tailwind', function () {
+  it('should support tailwind via SCSS', async function () {
+    let fixture = path.join(__dirname, '/integration/tailwind-scss');
+    let b = await bundle(path.join(fixture, 'index.html'));
+
+    let css = await outputFS.readFile(
+      b.getBundles().find(b => b.type === 'css'),
+      'utf8',
+    );
+    assert(css.includes('.p-2'));
+    assert(!css.includes('.m-2'));
+  });
+});