refactor(🆙): upgrade @ant-design/colors and fix test cases (#400)

* refactor(:up:): upgrade @ant-design/colors to 5.0 * 🆙 upgrade devDeps * upgrade @typescript-eslint/eslint-plugin * fix circle ci * add ci to vue and react-native * fix packages/icons-react/.eslintrc.js * fix test * fix vue test * fix react-native test * fix react-native test * fix test snapshot
ant-design · Nov 13, 2020 · 2525c27 · 2525c27
1 parent 3404c64
commit 2525c27
Show file tree

Hide file tree

Showing 13 changed files with 46 additions and 51 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -27,6 +27,14 @@ references:
           requires:
           - setup
           - icons-svg
+      - icons-vue:
+          requires:
+          - setup
+          - icons-svg
+      - icons-react-native:
+          requires:
+          - setup
+          - icons-svg
 
 jobs:
   setup:
@@ -47,8 +55,6 @@ jobs:
           paths:
             - node_modules
             - packages/icons-*/node_modules
-      - store_artifacts:
-          path: yarn.lock
 
   icons-svg:
     <<: *container_config
@@ -79,6 +85,20 @@ jobs:
       - *attach_workspace
       - run: yarn angular:ci
 
+  icons-vue:
+    <<: *container_config
+    steps:
+      - checkout
+      - *attach_workspace
+      - run: yarn vue:ci
+
+  icons-react-native:
+    <<: *container_config
+    steps:
+      - checkout
+      - *attach_workspace
+      - run: yarn react-native:ci
+
 workflows:
   version: 2
   build_test:

diff --git a/package.json b/package.json
@@ -2,13 +2,16 @@
   "private": true,
   "scripts": {
     "bootstrap": "lerna bootstrap",
+    "clean": "lerna clean",
     "bootstrap:china": "lerna bootstrap --registry=https://registry.npm.taobao.org",
     "rn:generate": "lerna run --scope @ant-design/icons-react-native generate",
     "icons:generate": "lerna run --scope @ant-design/icons-svg generate",
     "icons:build": "lerna run --scope @ant-design/icons-svg build",
     "icons:test": "lerna run --scope @ant-design/icons-svg test",
     "react:ci": "lerna run --scope @ant-design/icons ci",
     "angular:ci": "lerna run --scope @ant-design/icons-angular-workspace ci",
+    "vue:ci": "lerna run --scope @ant-design/icons-vue ci",
+    "react-native:ci": "lerna run --scope @ant-design/icons-react-native ci",
     "lint": "lerna run lint"
   },
   "devDependencies": {

diff --git a/packages/icons-angular/package.json b/packages/icons-angular/package.json
@@ -15,7 +15,7 @@
   "license": "MIT",
   "private": true,
   "dependencies": {
-    "@ant-design/colors": "^4.0.0",
+    "@ant-design/colors": "^5.0.0",
     "@angular/common": "^10.0.0",
     "@angular/core": "^10.0.0"
   },
@@ -31,7 +31,6 @@
     "@angular/platform-browser-dynamic": "^10.0.0",
     "@angular/platform-browser": "^10.0.0",
     "@angular/router": "^10.0.0",
-    "@ant-design/colors": "^3.1.0",
     "@ant-design/icons-svg": "^4.0.0",
     "@types/jasmine": "~3.3.8",
     "@types/jasminewd2": "~2.0.3",

diff --git a/packages/icons-angular/src/package.json b/packages/icons-angular/src/package.json
@@ -7,7 +7,7 @@
     "Wendell Hu <wendellhu95@gmail.com>"
   ],
   "dependencies": {
-    "@ant-design/colors": "^3.1.0",
+    "@ant-design/colors": "^5.0.0",
     "tslib": "^2.0.0"
 },
   "peerDependencies": {

diff --git a/packages/icons-react-native/package.json b/packages/icons-react-native/package.json
@@ -21,7 +21,9 @@
     "pregenerate": "npm run clean",
     "clean": "rimraf -rf fonts iconfont src/*.tsx",
     "prepublishOnly": "npm run lint && npm run test && npm run compile",
-    "patch-package": "patch-package"
+    "postinstall": "npm run patch-package",
+    "patch-package": "patch-package",
+    "ci": "npm run lint && npm run test && npm run compile"
   },
   "files": [
     "es",

diff --git a/packages/icons-react-native/test/IconFill.spec.tsx b/packages/icons-react-native/test/IconFill.spec.tsx
@@ -15,7 +15,7 @@ describe('IconFill', () => {
 
   it('should create Icon element.', () => {
     const icon = mount({ name: 'account-book' });
-    expect(icon!.children![0]).toBe(
+    expect((icon as any).children![0]).toBe(
       String.fromCharCode(fillGlyphMap['account-book'])
     );
     expect(icon).toMatchSnapshot();

diff --git a/packages/icons-react-native/test/IconOutline.spec.tsx b/packages/icons-react-native/test/IconOutline.spec.tsx
@@ -15,7 +15,7 @@ describe('IconOutline', () => {
 
   it('should create Icon element.', () => {
     const icon = mount({ name: 'account-book' });
-    expect(icon!.children![0]).toBe(
+    expect((icon as any).children![0]).toBe(
       String.fromCharCode(outlineGlyphMap['account-book'])
     );
     expect(icon).toMatchSnapshot();

diff --git a/packages/icons-react/.eslintrc.js b/packages/icons-react/.eslintrc.js
@@ -1,13 +1,9 @@
-const base = require('@umijs/fabric/dist/eslint');
-
 module.exports = {
-  ...base,
+  extends: [require.resolve('@umijs/fabric/dist/eslint')],
   env: {
-    ...base.env,
     jest: true,
   },
   rules: {
-    ...base.rules,
     '@typescript-eslint/no-explicit-any': 0,
     'react/no-did-update-set-state': 0,
     'react/no-find-dom-node': 0,

diff --git a/packages/icons-react/package.json b/packages/icons-react/package.json
@@ -31,7 +31,7 @@
     "postcompile": "npm run clean && TS_NODE_PROJECT=scripts/tsconfig.json node -r ts-node/register scripts/generate.ts --target=entry"
   },
   "peerDependencies": {
-    "react": "16.x"
+    "react": ">=16.0.0"
   },
   "devDependencies": {
     "@types/classnames": "^2.2.9",
@@ -43,7 +43,9 @@
     "@types/react": "^16.9.23",
     "@types/react-dom": "^16.9.5",
     "@umijs/fabric": "^2.2.2",
-    "antd": "^3.20.7",
+    "@typescript-eslint/eslint-plugin": "^4.7.0",
+    "@typescript-eslint/parser": "^4.7.0",
+    "antd": "^4.8.2",
     "cross-env": "^5.2.0",
     "enzyme": "^3.10.0",
     "enzyme-to-json": "^3.3.5",
@@ -56,11 +58,11 @@
     "react-dom": "^16.4.2",
     "rimraf": "^3.0.0",
     "styled-components": "^3.3.3",
-    "ts-node": "^8.3.0",
-    "typescript": "^3.0.3"
+    "ts-node": "^9.0.0",
+    "typescript": "^4.0.2"
   },
   "dependencies": {
-    "@ant-design/colors": "^3.1.0",
+    "@ant-design/colors": "^5.0.0",
     "@ant-design/icons-svg": "^4.0.0",
     "@babel/runtime": "^7.10.4",
     "classnames": "^2.2.6",

diff --git a/packages/icons-react/tests/__snapshots__/index.test.tsx.snap b/packages/icons-react/tests/__snapshots__/index.test.tsx.snap
@@ -53,7 +53,6 @@ exports[`Icon should render to a <span class="xxx"><svg>...</svg></span> 1`] = `
 >
   <svg
     aria-hidden="true"
-    class=""
     data-icon="home"
     fill="currentColor"
     focusable="false"
@@ -77,7 +76,6 @@ exports[`Icon should support basic usage 1`] = `
   >
     <svg
       aria-hidden="true"
-      class=""
       data-icon="home"
       fill="currentColor"
       focusable="false"
@@ -97,7 +95,6 @@ exports[`Icon should support basic usage 1`] = `
   >
     <svg
       aria-hidden="true"
-      class=""
       data-icon="setting"
       fill="currentColor"
       focusable="false"
@@ -117,7 +114,6 @@ exports[`Icon should support basic usage 1`] = `
   >
     <svg
       aria-hidden="true"
-      class=""
       data-icon="smile"
       fill="currentColor"
       focusable="false"
@@ -132,12 +128,11 @@ exports[`Icon should support basic usage 1`] = `
   </span>
   <span
     aria-label="sync"
-    class="anticon anticon-sync"
+    class="anticon anticon-sync anticon-spin"
     role="img"
   >
     <svg
       aria-hidden="true"
-      class="anticon-spin"
       data-icon="sync"
       fill="currentColor"
       focusable="false"
@@ -152,12 +147,11 @@ exports[`Icon should support basic usage 1`] = `
   </span>
   <span
     aria-label="loading"
-    class="anticon anticon-loading"
+    class="anticon anticon-loading anticon-spin"
     role="img"
   >
     <svg
       aria-hidden="true"
-      class="anticon-spin"
       data-icon="loading"
       fill="currentColor"
       focusable="false"
@@ -181,7 +175,6 @@ exports[`Icon should support config global two-tone primary color 1`] = `
 >
   <svg
     aria-hidden="true"
-    class=""
     data-icon="check-circle"
     fill="currentColor"
     focusable="false"
@@ -213,7 +206,6 @@ exports[`Icon should support config global two-tone primary color 2`] = `
 >
   <svg
     aria-hidden="true"
-    class=""
     data-icon="check-circle"
     fill="currentColor"
     focusable="false"
@@ -245,7 +237,6 @@ exports[`Icon should support config global two-tone primary color 3`] = `
 >
   <svg
     aria-hidden="true"
-    class=""
     data-icon="check-circle"
     fill="currentColor"
     focusable="false"
@@ -306,7 +297,6 @@ exports[`Icon should support event listeners 1`] = `
         tabIndex={-1}
       >
         <IconReact
-          className=""
           icon={
             Object {
               "icon": Object {
@@ -331,7 +321,6 @@ exports[`Icon should support event listeners 1`] = `
         >
           <svg
             aria-hidden="true"
-            className=""
             data-icon="home"
             fill="currentColor"
             focusable="false"
@@ -379,7 +368,6 @@ exports[`Icon should support event listeners 1`] = `
         role="img"
       >
         <IconReact
-          className=""
           icon={
             Object {
               "icon": Object {
@@ -404,7 +392,6 @@ exports[`Icon should support event listeners 1`] = `
         >
           <svg
             aria-hidden="true"
-            className=""
             data-icon="setting"
             fill="currentColor"
             focusable="false"
@@ -456,7 +443,6 @@ exports[`Icon should support event listeners 1`] = `
         role="img"
       >
         <IconReact
-          className=""
           icon={
             Object {
               "icon": Object {
@@ -481,7 +467,6 @@ exports[`Icon should support event listeners 1`] = `
         >
           <svg
             aria-hidden="true"
-            className=""
             data-icon="smile"
             fill="currentColor"
             focusable="false"
@@ -530,12 +515,11 @@ exports[`Icon should support event listeners 1`] = `
     >
       <span
         aria-label="sync"
-        className="anticon anticon-sync"
+        className="anticon anticon-sync anticon-spin"
         onKeyUp={[MockFunction]}
         role="img"
       >
         <IconReact
-          className="anticon-spin"
           icon={
             Object {
               "icon": Object {
@@ -560,7 +544,6 @@ exports[`Icon should support event listeners 1`] = `
         >
           <svg
             aria-hidden="true"
-            className="anticon-spin"
             data-icon="sync"
             fill="currentColor"
             focusable="false"
@@ -762,7 +745,6 @@ exports[`Icon should support two-tone icon 1`] = `
 >
   <svg
     aria-hidden="true"
-    class=""
     data-icon="check-circle"
     fill="currentColor"
     focusable="false"
@@ -794,7 +776,6 @@ exports[`Icon should support two-tone icon 2`] = `
 >
   <svg
     aria-hidden="true"
-    class=""
     data-icon="check-circle"
     fill="currentColor"
     focusable="false"

diff --git a/packages/icons-react/tests/index.test.tsx b/packages/icons-react/tests/index.test.tsx
@@ -155,11 +155,8 @@ describe('Icon', () => {
     const icon = wrapper.find('span').at(0);
     icon.simulate('mouseenter');
     expect(onVisibleChange).toHaveBeenCalledWith(true);
-    expect((wrapper.instance() as any).tooltip.props.visible).toBe(true);
-
     icon.simulate('mouseleave');
     expect(onVisibleChange).toHaveBeenCalledWith(false);
-    expect((wrapper.instance() as any).tooltip.props.visible).toBe(false);
   });
 
   it('should support custom usage of children', () => {
@@ -352,11 +349,9 @@ describe('Icon.createFromIconfontCN()', () => {
     const icon = wrapper.find('span').at(0);
     icon.simulate('mouseenter');
     expect(onVisibleChange).toHaveBeenCalledWith(true);
-    expect((wrapper.instance() as any).tooltip.props.visible).toBe(true);
 
     icon.simulate('mouseleave');
     expect(onVisibleChange).toHaveBeenCalledWith(false);
-    expect((wrapper.instance() as any).tooltip.props.visible).toBe(false);
   });
 });
 
@@ -435,11 +430,8 @@ describe('Icon.createFromIconfontCN({scriptUrl:[]})', () => {
     const icon = wrapper.find('span').at(0);
     icon.simulate('mouseenter');
     expect(onVisibleChange).toHaveBeenCalledWith(true);
-    expect((wrapper.instance() as any).tooltip.props.visible).toBe(true);
-
     icon.simulate('mouseleave');
     expect(onVisibleChange).toHaveBeenCalledWith(false);
-    expect((wrapper.instance() as any).tooltip.props.visible).toBe(false);
   });
 
   const IconFont2 = createFromIconfontCN({

diff --git a/packages/icons-vue/package.json b/packages/icons-vue/package.json
@@ -20,7 +20,8 @@
     "test": "cross-env NODE_ENV=test jest --config .jest.js",
     "prepublishOnly": "npm run lint && npm run generate && npm run compile && npm run test",
     "generate": "rimraf src/icons && TS_NODE_PROJECT=scripts/tsconfig.json node -r ts-node/register scripts/generate.ts --target=icon",
-    "postcompile": "npm run clean && TS_NODE_PROJECT=scripts/tsconfig.json node -r ts-node/register scripts/generate.ts --target=entry"
+    "postcompile": "npm run clean && TS_NODE_PROJECT=scripts/tsconfig.json node -r ts-node/register scripts/generate.ts --target=entry",
+    "ci": "npm run lint && npm run compile && npm run test"
   },
   "peerDependencies": {
     "vue": ">=3.0.0"
@@ -55,7 +56,7 @@
     "vue-jest": "^5.0.0-alpha.3"
   },
   "dependencies": {
-    "@ant-design/colors": "^4.0.0",
+    "@ant-design/colors": "^5.0.0",
     "@ant-design/icons-svg": "^4.0.0",
     "@babel/runtime": "^7.10.4",
     "lodash": "^4.17.15"

diff --git a/packages/testTheme/account-book b/packages/testTheme/account-book