fix: jest

.jest.js

@@ -2,28 +2,36 @@ const libDir = process.env.LIB_DIR;
 
 const transformIgnorePatterns = [
   '/dist/',
-  'node_modules/[^/]+?/(?!(node_modules)/)', // Ignore modules without es dir
+  // Ignore modules without es dir.
+  // Update: @babel/runtime should also be transformed
+  'node_modules/(?!.*(@babel|lodash-es))[^/]+?/(?!(es|node_modules)/)',
 ];
-
+const testPathIgnorePatterns = ['/node_modules/', 'node'];
 module.exports = {
   testURL: 'http://localhost/',
   preset: 'ts-jest',
   moduleFileExtensions: ['js', 'ts', 'tsx', 'json', 'vue'],
   modulePathIgnorePatterns: ['/_site/'],
-  testPathIgnorePatterns: ['/node_modules/', 'node'],
   transform: {
     '.*\\.(vue)$': '<rootDir>/node_modules/vue-jest',
-    '^.+\\.(ts|tsx)$': '<rootDir>/node_modules/babel-jest',
+    '^.+\\.(js|jsx)$': '<rootDir>/node_modules/babel-jest',
+    '^.+\\.(ts|tsx)$': '<rootDir>/node_modules/ts-jest',
     '.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
   },
   testRegex: libDir === 'dist' ? 'demo\\.test\\.ts$' : '.*\\.test\\.tsx$',
-  testEnvironment: 'node',
+  testEnvironment: 'jest-environment-jsdom-fifteen',
   moduleNameMapper: {
     '^@/(.*)$': '<rootDir>/$1',
   },
   snapshotSerializers: ['<rootDir>/node_modules/jest-serializer-vue'],
   collectCoverage: process.env.COVERAGE === 'true',
   collectCoverageFrom: ['src/**/*.{ts,tsx,vue}'],
+  testPathIgnorePatterns,
   transformIgnorePatterns,
   verbose: true,
+  globals: {
+    'ts-jest': {
+      babelConfig: true,
+    },
+  },
 };

package.json

@@ -18,10 +18,9 @@
     "start": "vc-tools run server",
     "lint": "eslint src/ -c .eslintrc.js --ext .tsx,.ts",
     "lint:fix": "eslint --fix src/ -c .eslintrc.js --ext .tsx,.ts",
-    "compile": "cross-env TS_NODE_PROJECT=scripts/tsconfig.json vc-tools run compile",
+    "compile": "vc-tools run compile",
     "test": "cross-env NODE_ENV=test jest --config .jest.js",
-    "prepublishOnly": "npm run lint && npm run compile && npm run test",
-    "postcompile": "npm run clean"
+    "prepublishOnly": "npm run lint && npm run compile && npm run test"
   },
   "peerDependencies": {
     "ant-design-vue": ">=2.0.0",
@@ -51,10 +50,12 @@
     "eslint-plugin-vue": "^7.0.0-0",
     "fs-extra": "^9.0.1",
     "jest": "^25.4.0",
+    "jest-environment-jsdom-fifteen": "^1.0.2",
     "jest-serializer-vue": "^2.0.2",
     "jest-transform-stub": "^2.0.0",
     "prettier": "^1.19.1",
     "rimraf": "^3.0.2",
+    "ts-jest": "^26.4.4",
     "ts-node": "^8.10.2",
     "typescript": "~3.9.3",
     "vue": "^3.0.0-0",

scripts/cleanup.ts

@@ -1,9 +1,11 @@
-const rimraf = require('rimraf');
-const path = require('path');
+import rimraf from 'rimraf';
+import path from 'path';
 
-const errorHandler = (err) => {
-  console.error('err', err);
-}
+const errorHandler = err => {
+  if (err !== null) {
+    console.warn(err);
+  }
+};
 
-rimraf(path.resolve(__dirname, 'es'), errorHandler);
-rimraf(path.resolve(__dirname, 'lib'), errorHandler);
+rimraf(path.resolve(__dirname, '../es'), errorHandler);
+rimraf(path.resolve(__dirname, '../lib'), errorHandler);

scripts/tsconfig.json

@@ -1,24 +1,6 @@
 {
   "compilerOptions": {
-    "allowSyntheticDefaultImports": true,
-    "declaration": true,
-    "module": "esnext",
-    "target": "esnext",
-    "moduleResolution": "node",
-    "jsx": "preserve",
+    "module": "commonJS",
     "esModuleInterop": true
-  },
-  "include": ["./src", "./typings/"],
-  "typings": "./typings/index.d.ts",
-  "exclude": [
-    "node_modules",
-    "build",
-    "scripts",
-    "acceptance-tests",
-    "webpack",
-    "jest",
-    "src/setupTests.ts",
-    "tslint:latest",
-    "tslint-config-prettier"
-  ]
-}
+  }
+}

src/GridContent/index.tsx

@@ -10,10 +10,9 @@ export interface GridContentProps {
 }
 
 const GridContent: FunctionalComponent<GridContentProps> = (props, { slots }) => {
-  const proConfig = useProProvider();
-  const { contentWidth, getPrefixCls } = toRefs(proConfig);
-  const customPrefixCls = props.prefixCls || getPrefixCls.value();
-  const customContentWidth = props.contentWidth || contentWidth.value;
+  const { contentWidth, getPrefixCls } = useProProvider();
+  const customPrefixCls = props.prefixCls || getPrefixCls();
+  const customContentWidth = props.contentWidth || contentWidth;
   return (
     <div
       class={{

tests/__snapshots__/grid-content.test.tsx.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`GridContent shoul render with empty children 1`] = `
+<div class="ant-pro-grid-content">
+  <div class="ant-pro-grid-content-children">
+    <!---->
+  </div>
+</div>
+`;

tests/grid-content.test.tsx

@@ -0,0 +1,34 @@
+import { mount } from '@vue/test-utils';
+import GridContent from '../src/GridContent';
+
+describe('GridContent', () => {
+
+  it('shoul render with empty children', () => {
+    const wrapper = mount(GridContent, { });
+    expect(wrapper.html()).toMatchSnapshot();
+  });
+
+  it('shoul render with prop Fixed', () => {
+    const wrapper = mount({
+      setup() {
+        return () => (
+          <GridContent contentWidth="Fixed"></GridContent>
+        );
+      },
+    });
+    expect(wrapper.classes().indexOf('wide') > -1).toBe(true);
+  });
+
+  it('shoul render with children', () => {
+    const wrapper = mount({
+      setup() {
+        return () => (
+          <GridContent contentWidth="Fixed">
+            <div>children</div>
+          </GridContent>
+        );
+      },
+    });
+    expect(wrapper.find('.ant-pro-grid-content-children').element.innerHTML === '<div>children</div>').toBe(true);
+  });
+});

tests/index.test.tsx

@@ -1,9 +1,12 @@
 import { mount } from '@vue/test-utils';
+// import BasicLayout from '../src/BasicLayout';
 
-describe('index', () => {
+describe('BasicLayout', () => {
 
-  it('shoul render GridContent', () => {
-    // empty
+  it('🥩 base use', () => {
+    // const wrapper = mount(BasicLayout, { });
+    // console.log(wrapper.html());
+    // expect(wrapper.html()).toMatchSnapshot();
   });
 
 });