test(taro-plugin-sass): 添加测试用例

packages/taro-plugin-sass/__tests__/__snapshots__/bundler.test.js.snap

@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`getBundleContent test file name and project directory path 1`] = `
+"$color-ui-info: #78A4FA !default;
+$color-ui-positive: #13CE66 !default;
+$color-ui-negative: #FF4949 !default;
+$color-ui-warning: #FFC82C !default;
+"
+`;
+
+exports[`getBundleContent test file path 1`] = `
+"$color-ui-info: #78A4FA !default;
+$color-ui-positive: #13CE66 !default;
+$color-ui-negative: #FF4949 !default;
+$color-ui-warning: #FFC82C !default;
+"
+`;

packages/taro-plugin-sass/__tests__/__snapshots__/compile.test.js.snap

@@ -0,0 +1,90 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`compileSass text compile only content 1`] = `
+".index {
+  background-color: #ececec; }
+"
+`;
+
+exports[`compileSass text compile only sass file path 1`] = `
+"body {
+  font: 100% Helvetica, sans-serif;
+  color: #333; }
+"
+`;
+
+exports[`compileSass text compile sass file and multiple resource file with directory 1`] = `
+".ui-color--info {
+  color: #78A4FA; }
+
+.ui-color--positive {
+  color: #13CE66; }
+
+.ui-color--negative {
+  color: #FF4949; }
+
+.ui-color--warning {
+  color: #FFC82C; }
+
+.box {
+  -webkit-transform: rotate(30deg);
+  -ms-transform: rotate(30deg);
+  transform: rotate(30deg); }
+"
+`;
+
+exports[`compileSass text compile sass file and multiple resource path 1`] = `
+".ui-color--info {
+  color: #78A4FA; }
+
+.ui-color--positive {
+  color: #13CE66; }
+
+.ui-color--negative {
+  color: #FF4949; }
+
+.ui-color--warning {
+  color: #FFC82C; }
+
+.box {
+  -webkit-transform: rotate(30deg);
+  -ms-transform: rotate(30deg);
+  transform: rotate(30deg); }
+"
+`;
+
+exports[`compileSass text compile sass file and single resource file with directory 1`] = `
+".index {
+  font-size: 20px; }
+
+.ui-color--info {
+  color: #78A4FA; }
+
+.ui-color--positive {
+  color: #13CE66; }
+
+.ui-color--negative {
+  color: #FF4949; }
+
+.ui-color--warning {
+  color: #FFC82C; }
+"
+`;
+
+exports[`compileSass text compile sass file and single resource path 1`] = `
+".index {
+  font-size: 20px; }
+
+.ui-color--info {
+  color: #78A4FA; }
+
+.ui-color--positive {
+  color: #13CE66; }
+
+.ui-color--negative {
+  color: #FF4949; }
+
+.ui-color--warning {
+  color: #FFC82C; }
+"
+`;

packages/taro-plugin-sass/__tests__/bundler.test.js

@@ -0,0 +1,20 @@
+const path = require('path')
+const getBundleContent = require('../bundler')
+
+const filePath = path.resolve(__dirname, '.', 'styles/variables.scss')
+const fileConfig = {
+  name: 'styles/variables.scss',
+  path: path.resolve(__dirname, '.')
+}
+
+describe('getBundleContent', () => {
+  test('test file path', async () => {
+    const res = await getBundleContent(filePath)
+    expect(res.bundledContent).toMatchSnapshot()
+  })
+
+  test('test file name and project directory path', async () => {
+    const res = await getBundleContent(fileConfig.name, fileConfig.path)
+    expect(res.bundledContent).toMatchSnapshot()
+  })
+})

packages/taro-plugin-sass/__tests__/compile.test.js

@@ -0,0 +1,69 @@
+const path = require('path')
+const fs = require('fs')
+const compileSass = require('../index')
+
+const sassContent = `
+.index {
+  background-color: #ececec;
+}
+`
+
+const indexPath = path.resolve(__dirname, '.', 'styles/index.scss')
+
+const singlePath = path.resolve(__dirname, '.', 'styles/single.scss')
+const singlePathContent = fs.readFileSync(singlePath)
+const singleConfig = {
+  resource: path.resolve(__dirname, '.', 'styles/variables.scss')
+}
+const singleConfigWithDirectory = {
+  resource: 'styles/variables.scss',
+  projectDirectory: path.resolve(__dirname, '.')
+}
+
+const multiplePath = path.resolve(__dirname, '.', 'styles/multiple.scss')
+const multiplePathContent = fs.readFileSync(multiplePath)
+const multipleConfig = {
+  resource: [
+    path.resolve(__dirname, '.', 'styles/variables.scss'),
+    path.resolve(__dirname, '.', 'styles/mixins.scss')
+  ]
+}
+const multipleConfigWithDirectory = {
+  resource: [
+    'styles/variables.scss',
+    'styles/mixins.scss'
+  ],
+  projectDirectory: path.resolve(__dirname, '.')
+}
+
+describe('compileSass', () => {
+  test('text compile only content', async () => {
+    const res = await compileSass(sassContent, '', {})
+    expect(res.css.toString()).toMatchSnapshot()
+  })
+
+  test('text compile only sass file path', async () => {
+    const res = await compileSass('', indexPath, {})
+    expect(res.css.toString()).toMatchSnapshot()
+  })
+
+  test('text compile sass file and single resource path', async () => {
+    const res = await compileSass(singlePathContent, singlePath, singleConfig)
+    expect(res.css.toString()).toMatchSnapshot()
+  })
+
+  test('text compile sass file and single resource file with directory', async () => {
+    const res = await compileSass(singlePathContent, singlePath, singleConfigWithDirectory)
+    expect(res.css.toString()).toMatchSnapshot()
+  })
+
+  test('text compile sass file and multiple resource path', async () => {
+    const res = await compileSass(multiplePathContent, multiplePath, multipleConfig)
+    expect(res.css.toString()).toMatchSnapshot()
+  })
+
+  test('text compile sass file and multiple resource file with directory', async () => {
+    const res = await compileSass(multiplePathContent, multiplePath, multipleConfigWithDirectory)
+    expect(res.css.toString()).toMatchSnapshot()
+  })
+})

packages/taro-plugin-sass/__tests__/styles/index.scss

@@ -0,0 +1,7 @@
+$font-stack:    Helvetica, sans-serif;
+$primary-color: #333;
+
+body {
+  font: 100% $font-stack;
+  color: $primary-color;
+}

packages/taro-plugin-sass/__tests__/styles/mixins.scss

@@ -0,0 +1,5 @@
+@mixin transform($property) {
+  -webkit-transform: $property;
+  -ms-transform: $property;
+  transform: $property;
+}

packages/taro-plugin-sass/__tests__/styles/multiple.scss

@@ -0,0 +1,18 @@
+.ui-color {
+  &--info {
+    color: $color-ui-info;
+  }
+  &--positive {
+    color: $color-ui-positive;
+  }
+  &--negative {
+    color: $color-ui-negative;
+  }
+  &--warning {
+    color: $color-ui-warning;
+  }
+}
+
+.box {
+  @include transform(rotate(30deg));
+}

packages/taro-plugin-sass/__tests__/styles/single.scss

@@ -0,0 +1,17 @@
+.index {
+  font-size: 20px;
+}
+.ui-color {
+  &--info {
+    color: $color-ui-info;
+  }
+  &--positive {
+    color: $color-ui-positive;
+  }
+  &--negative {
+    color: $color-ui-negative;
+  }
+  &--warning {
+    color: $color-ui-warning;
+  }
+}

packages/taro-plugin-sass/__tests__/styles/variables.scss

@@ -0,0 +1,4 @@
+$color-ui-info: #78A4FA !default;
+$color-ui-positive: #13CE66 !default;
+$color-ui-negative: #FF4949 !default;
+$color-ui-warning: #FFC82C !default;

packages/taro-plugin-sass/package.json

@@ -8,7 +8,7 @@
     "index.js"
   ],
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "jest"
   },
   "repository": {
     "type": "git",
@@ -22,5 +22,9 @@
   "dependencies": {
     "node-sass": "^4.12.0",
     "scss-bundle": "^2.5.1"
+  },
+  "devDependencies": {
+    "@types/jest": "^24.0.19",
+    "jest": "^24.9.0"
   }
 }