From b4b44da5d1f209182fb684959fa1bcadd47e841f Mon Sep 17 00:00:00 2001 From: hydraZty <670688667@qq.com> Date: Thu, 2 Dec 2021 11:47:13 +0800 Subject: [PATCH 01/15] fix: Radio dot offset when zooming (#33086) Co-authored-by: hydraZty --- components/radio/style/index.less | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/components/radio/style/index.less b/components/radio/style/index.less index 66356b3e8082..f3a5d21c9fc0 100644 --- a/components/radio/style/index.less +++ b/components/radio/style/index.less @@ -81,15 +81,17 @@ &-inner { &::after { position: absolute; - top: ((@radio-size - @radio-dot-size) / 2) - @radio-border-width; - left: ((@radio-size - @radio-dot-size) / 2) - @radio-border-width; + top: 50%; + left: 50%; display: block; - width: @radio-dot-size; - height: @radio-dot-size; + width: @radio-size; + height: @radio-size; + margin-top: -(@radio-size / 2); + margin-left: -(@radio-size / 2); background-color: @radio-dot-color; border-top: 0; border-left: 0; - border-radius: @radio-dot-size; + border-radius: @radio-size; transform: scale(0); opacity: 0; transition: all @radio-duration @ease-in-out-circ; @@ -128,7 +130,7 @@ border-color: @radio-dot-color; &::after { - transform: scale(1); + transform: scale((unit(@radio-dot-size) / unit(@radio-size))); opacity: 1; transition: all @radio-duration @ease-in-out-circ; } From 441eb649bd7c7609fffd960c29e1b999361f1e4e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?= Date: Thu, 2 Dec 2021 13:59:22 +0800 Subject: [PATCH 02/15] chore: bump version (#33124) --- package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index c5c42e076811..baefdaab13ab 100644 --- a/package.json +++ b/package.json @@ -121,7 +121,7 @@ "lodash": "^4.17.21", "memoize-one": "^6.0.0", "moment": "^2.25.3", - "rc-cascader": "~2.2.0", + "rc-cascader": "~2.3.0", "rc-checkbox": "~2.3.0", "rc-collapse": "~3.1.0", "rc-dialog": "~8.6.0", @@ -139,7 +139,7 @@ "rc-progress": "~3.1.0", "rc-rate": "~2.9.0", "rc-resize-observer": "^1.1.0", - "rc-select": "~13.1.0-alpha.0", + "rc-select": "~13.2.1", "rc-slider": "~9.7.4", "rc-steps": "~4.1.0", "rc-switch": "~3.2.0", @@ -148,7 +148,7 @@ "rc-textarea": "~0.3.0", "rc-tooltip": "~5.1.1", "rc-tree": "~5.3.0", - "rc-tree-select": "~4.7.0", + "rc-tree-select": "~4.8.0", "rc-trigger": "^5.2.10", "rc-upload": "~4.3.0", "rc-util": "^5.14.0", From e49a451650bda323ce129df00e8bfe657d07dd3e Mon Sep 17 00:00:00 2001 From: afc163 Date: Thu, 2 Dec 2021 14:40:03 +0800 Subject: [PATCH 03/15] fix: Select width bug when searching (#32988) * fix: select placeholder should take place when searching close #27688 * fix snapshot --- .../select/__tests__/__snapshots__/demo.test.js.snap | 1 - components/select/demo/search.md | 11 ----------- components/select/style/single.less | 1 + 3 files changed, 1 insertion(+), 12 deletions(-) diff --git a/components/select/__tests__/__snapshots__/demo.test.js.snap b/components/select/__tests__/__snapshots__/demo.test.js.snap index 6663597385f2..ad1e10f98280 100644 --- a/components/select/__tests__/__snapshots__/demo.test.js.snap +++ b/components/select/__tests__/__snapshots__/demo.test.js.snap @@ -1711,7 +1711,6 @@ exports[`renders ./components/select/demo/responsive.md correctly 1`] = ` exports[`renders ./components/select/demo/search.md correctly 1`] = `
option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0 diff --git a/components/select/style/single.less b/components/select/style/single.less index 08fc31d68843..500dd7298883 100644 --- a/components/select/style/single.less +++ b/components/select/style/single.less @@ -40,6 +40,7 @@ } .@{select-prefix-cls}-selection-placeholder { + transition: none; pointer-events: none; } From 98e36aa036e33f798ad3ff51b2f1fdb8a925b4b3 Mon Sep 17 00:00:00 2001 From: Stef Schenkelaars Date: Thu, 2 Dec 2021 13:25:31 +0100 Subject: [PATCH 04/15] test: add test helper for accessibility As proposed in #22343, the components can be automatically validated for accessibility. This adds a test helper that runs Axe to check for accessibility violations. --- components/affix/__tests__/Affix.test.tsx | 2 ++ components/alert/__tests__/index.test.tsx | 2 ++ package.json | 2 ++ tests/setupAfterEnv.ts | 2 ++ tests/shared/accessibilityTest.tsx | 15 +++++++++++++++ typings/jest.d.ts | 1 + 6 files changed, 24 insertions(+) create mode 100644 tests/shared/accessibilityTest.tsx diff --git a/components/affix/__tests__/Affix.test.tsx b/components/affix/__tests__/Affix.test.tsx index 1bf228375705..e67833cbbb8d 100644 --- a/components/affix/__tests__/Affix.test.tsx +++ b/components/affix/__tests__/Affix.test.tsx @@ -4,6 +4,7 @@ import Affix, { AffixProps, AffixState } from '..'; import { getObserverEntities } from '../utils'; import Button from '../../button'; import rtlTest from '../../../tests/shared/rtlTest'; +import accessibilityTest from '../../../tests/shared/accessibilityTest'; import { sleep } from '../../../tests/utils'; const events: Partial) => void>> = {}; @@ -53,6 +54,7 @@ class AffixMounter extends React.Component<{ describe('Affix Render', () => { rtlTest(Affix); + accessibilityTest(Affix); const domMock = jest.spyOn(HTMLElement.prototype, 'getBoundingClientRect'); let affixMounterWrapper: ReactWrapper; diff --git a/components/alert/__tests__/index.test.tsx b/components/alert/__tests__/index.test.tsx index 038985c21a3f..e27eeb2c5c35 100644 --- a/components/alert/__tests__/index.test.tsx +++ b/components/alert/__tests__/index.test.tsx @@ -5,12 +5,14 @@ import Button from '../../button'; import Tooltip from '../../tooltip'; import Popconfirm from '../../popconfirm'; import rtlTest from '../../../tests/shared/rtlTest'; +import accessibilityTest from '../../../tests/shared/accessibilityTest'; import { sleep } from '../../../tests/utils'; const { ErrorBoundary } = Alert; describe('Alert', () => { rtlTest(Alert); + accessibilityTest(Alert); beforeAll(() => { jest.useFakeTimers(); diff --git a/package.json b/package.json index baefdaab13ab..5a95f00b1a59 100644 --- a/package.json +++ b/package.json @@ -166,6 +166,7 @@ "@types/enzyme": "^3.10.5", "@types/gtag.js": "^0.0.8", "@types/jest": "^27.0.0", + "@types/jest-axe": "^3.5.3", "@types/jest-environment-puppeteer": "^4.4.0", "@types/jest-image-snapshot": "^4.1.0", "@types/lodash": "^4.14.139", @@ -225,6 +226,7 @@ "intersection-observer": "^0.12.0", "isomorphic-fetch": "^3.0.0", "jest": "^27.0.3", + "jest-axe": "^5.0.1", "jest-image-snapshot": "^4.5.1", "jest-puppeteer": "^6.0.0", "jquery": "^3.4.1", diff --git a/tests/setupAfterEnv.ts b/tests/setupAfterEnv.ts index f88f29fed296..797743d9c3b2 100644 --- a/tests/setupAfterEnv.ts +++ b/tests/setupAfterEnv.ts @@ -1,5 +1,7 @@ +import { toHaveNoViolations } from 'jest-axe'; import toMatchRenderedSnapshot from './matchers/rendered-snapshot'; +expect.extend(toHaveNoViolations); expect.extend({ toMatchRenderedSnapshot, }); diff --git a/tests/shared/accessibilityTest.tsx b/tests/shared/accessibilityTest.tsx new file mode 100644 index 000000000000..87b49ff15c44 --- /dev/null +++ b/tests/shared/accessibilityTest.tsx @@ -0,0 +1,15 @@ +import React from 'react'; +import { mount } from 'enzyme'; +import { axe } from 'jest-axe'; + +// eslint-disable-next-line jest/no-export +export default function accessibilityTest(Component: React.ComponentType) { + describe(`accessibility`, () => { + it(`component does not have any violations`, async () => { + jest.useRealTimers(); + const wrapper = mount(); + const results = await axe(wrapper.getDOMNode()); + expect(results).toHaveNoViolations(); + }); + }); +} diff --git a/typings/jest.d.ts b/typings/jest.d.ts index e2022de6bfea..3cf01d83df03 100644 --- a/typings/jest.d.ts +++ b/typings/jest.d.ts @@ -1,5 +1,6 @@ declare namespace jest { interface Matchers { toMatchRenderedSnapshot(): R; + toHaveNoViolations(): R; } } From f0fb377d1452253ef6116fcb4a0a2098b16efddb Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 3 Dec 2021 15:05:04 +0800 Subject: [PATCH 05/15] chore(deps-dev): bump react-helmet-async from 1.1.2 to 1.2.0 (#33133) Bumps [react-helmet-async](https://github.com/staylor/react-helmet-async) from 1.1.2 to 1.2.0. - [Release notes](https://github.com/staylor/react-helmet-async/releases) - [Commits](https://github.com/staylor/react-helmet-async/commits) --- updated-dependencies: - dependency-name: react-helmet-async dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index baefdaab13ab..4f02243a66f8 100644 --- a/package.json +++ b/package.json @@ -250,7 +250,7 @@ "react-draggable": "^4.4.3", "react-fast-marquee": "^1.2.1", "react-github-button": "^0.1.11", - "react-helmet-async": "~1.1.2", + "react-helmet-async": "~1.2.0", "react-highlight-words": "^0.17.0", "react-infinite-scroll-component": "^6.1.0", "react-intl": "^5.20.4", From bcb5002f08445b04f81069e59dfd71d6e05808b4 Mon Sep 17 00:00:00 2001 From: afc163 Date: Fri, 3 Dec 2021 23:54:08 +0800 Subject: [PATCH 06/15] chore: fix ci in npm 8 --- .github/workflows/preview-build.yml | 4 ++-- .github/workflows/site-deploy.yml | 2 +- .github/workflows/test.yml | 4 ++-- .github/workflows/ui.yml | 25 ++++++++++++++++++++++++- package.json | 15 +++++++-------- webpack.config.js | 19 ++++++++++++++++--- 6 files changed, 52 insertions(+), 17 deletions(-) diff --git a/.github/workflows/preview-build.yml b/.github/workflows/preview-build.yml index 97db4c35a156..c468c70a17f4 100644 --- a/.github/workflows/preview-build.yml +++ b/.github/workflows/preview-build.yml @@ -2,7 +2,7 @@ name: Preview Build -on: +on: pull_request: types: [opened, synchronize, reopened] @@ -22,7 +22,7 @@ jobs: key: lock-${{ github.sha }} - name: create package-lock.json - run: npm i --package-lock-only + run: npm i --package-lock-only --ignore-scripts - name: hack for single file run: | diff --git a/.github/workflows/site-deploy.yml b/.github/workflows/site-deploy.yml index 3dcb97516860..89d9e6f4cbbd 100644 --- a/.github/workflows/site-deploy.yml +++ b/.github/workflows/site-deploy.yml @@ -19,7 +19,7 @@ jobs: key: lock-${{ github.sha }} - name: create package-lock.json - run: npm i --package-lock-only + run: npm i --package-lock-only --ignore-scripts - name: hack for single file run: | diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index b8e8438486ea..d7b2086d6bd8 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -18,7 +18,7 @@ jobs: key: lock-${{ github.sha }} - name: create package-lock.json - run: npm i --package-lock-only + run: npm i --package-lock-only --ignore-scripts - name: hack for single file run: | @@ -496,4 +496,4 @@ jobs: - name: lessc mixins run: npx lessc --js ./es/style/mixins/index.less - needs: setup \ No newline at end of file + needs: setup diff --git a/.github/workflows/ui.yml b/.github/workflows/ui.yml index 21b5d6085beb..4a29ce4bd60b 100644 --- a/.github/workflows/ui.yml +++ b/.github/workflows/ui.yml @@ -14,8 +14,31 @@ jobs: - name: checkout uses: actions/checkout@master + - name: cache package-lock.json + uses: actions/cache@v2 + with: + path: package-temp-dir + key: lock-${{ github.sha }} + + - name: create package-lock.json + run: npm i --package-lock-only --ignore-scripts + + - name: hack for single file + run: | + if [ ! -d "package-temp-dir" ]; then + mkdir package-temp-dir + fi + cp package-lock.json package-temp-dir + - name: cache node_modules + id: node_modules_cache_id + uses: actions/cache@v2 + with: + path: node_modules + key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }} + - name: install - run: npm install + if: steps.node_modules_cache_id.outputs.cache-hit != 'true' + run: npm ci - name: test run: npm run test-image diff --git a/package.json b/package.json index 4f02243a66f8..5e8d20e58c0f 100644 --- a/package.json +++ b/package.json @@ -98,7 +98,7 @@ "site:test": "jest --config .jest.site.js --cache=false --force-exit", "test-image": "npm run dist && docker-compose run tests", "version": "node ./scripts/generate-version", - "install-react-16": "npm i --no-save react@16 react-dom@16 react-test-renderer@16 enzyme-adapter-react-16", + "install-react-16": "npm i --no-save --legacy-peer-deps react@16 react-dom@16 react-test-renderer@16 enzyme-adapter-react-16", "argos": "argos upload imageSnapshots" }, "browserslist": [ @@ -157,7 +157,7 @@ "devDependencies": { "@ant-design/bisheng-plugin": "^3.0.1", "@ant-design/hitu": "^0.0.0-alpha.13", - "@ant-design/tools": "^14.0.0-alpha.3", + "@ant-design/tools": "^14.0.2", "@docsearch/css": "^3.0.0-alpha.39", "@docsearch/react": "^3.0.0-alpha.39", "@qixian.cs/github-contributors-list": "^1.0.3", @@ -192,6 +192,7 @@ "cheerio": "^1.0.0-rc.3", "concurrently": "^6.0.0", "cross-env": "^7.0.0", + "css-minimizer-webpack-plugin": "^3.2.0", "dekko": "^0.2.1", "docsearch.js": "^2.6.3", "duplicate-package-checker-webpack-plugin": "^3.0.0", @@ -218,7 +219,6 @@ "http-server": "^14.0.0", "husky": "^7.0.1", "identity-obj-proxy": "^3.0.0", - "ignore-emit-webpack-plugin": "^2.0.6", "immer": "^9.0.1", "immutability-helper": "^3.0.0", "inquirer": "^8.0.0", @@ -232,15 +232,16 @@ "jsonml.js": "^0.1.0", "less-vars-to-js": "^1.3.0", "lz-string": "^1.4.4", + "mini-css-extract-plugin": "^2.4.5", "mockdate": "^3.0.0", "open": "^8.0.1", "prettier": "^2.3.2", "prettier-plugin-jsdoc": "^0.3.0", "pretty-quick": "^3.0.0", - "querystring": "^0.2.0", + "qs": "^6.10.1", "rc-footer": "^0.6.6", "rc-tween-one": "^3.0.3", - "rc-virtual-list": "^3.2.4", + "rc-virtual-list": "^3.4.2", "react": "^17.0.1", "react-color": "^2.17.3", "react-copy-to-clipboard": "^5.0.1", @@ -260,13 +261,12 @@ "react-sticky": "^6.0.3", "react-test-renderer": "^17.0.1", "react-text-loop-next": "0.0.3", - "react-virtualized": "^9.22.0", "react-window": "^1.8.5", "remark": "^14.0.1", "remark-cli": "^10.0.0", "remark-lint": "^9.0.0", "remark-preset-lint-recommended": "^6.0.0", - "reqwest": "^2.0.5", + "remove-files-webpack-plugin": "^1.4.5", "rimraf": "^3.0.0", "scrollama": "^2.0.0", "simple-git": "^2.23.0", @@ -281,7 +281,6 @@ "typescript": "~4.5.2", "webpack-bundle-analyzer": "^4.1.0", "xhr-mock": "^2.4.1", - "xhr2": "^0.2.0", "yaml-front-matter": "^4.0.0" }, "peerDependencies": { diff --git a/webpack.config.js b/webpack.config.js index 31ee02bcc2de..6a4dbba35732 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -2,7 +2,7 @@ // This config is for building dist files const chalk = require('chalk'); const getWebpackConfig = require('@ant-design/tools/lib/getWebpackConfig'); -const IgnoreEmitPlugin = require('ignore-emit-webpack-plugin'); +const RemovePlugin = require('remove-files-webpack-plugin'); const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer'); const { ESBuildMinifyPlugin } = require('esbuild-loader'); const DuplicatePackageCheckerPlugin = require('duplicate-package-checker-webpack-plugin'); @@ -103,9 +103,22 @@ function processWebpackThemeConfig(themeConfig, theme, vars) { // apply ${theme} less variables injectLessVariables(config, vars); - const themeReg = new RegExp(`${theme}(.min)?\\.js(\\.map)?$`); // ignore emit ${theme} entry js & js.map file - config.plugins.push(new IgnoreEmitPlugin(themeReg)); + config.plugins.push( + new RemovePlugin({ + after: { + root: './dist', + include: [ + `antd.${theme}.js`, + `antd.${theme}.js.map`, + `antd.${theme}.min.js`, + `antd.${theme}.min.js.map`, + ], + log: false, + logWarning: false, + }, + }), + ); }); } From ef8179e6b52d48645e3dbbff79313480c92c3044 Mon Sep 17 00:00:00 2001 From: afc163 Date: Fri, 3 Dec 2021 23:54:19 +0800 Subject: [PATCH 07/15] chore: remove react-virtualized from demo --- .../__tests__/__snapshots__/demo.test.js.snap | 45 +++-- .../list/demo/infinite-virtualized-load.md | 166 ------------------ components/list/demo/loadmore.md | 91 +++++----- components/list/demo/virtual-list.md | 72 ++++++++ components/select/demo/search-box.md | 4 +- components/table/demo/ajax.md | 33 ++-- components/upload/demo/upload-manually.md | 27 ++- docs/react/recommendation.en-US.md | 2 +- docs/react/recommendation.zh-CN.md | 2 +- 9 files changed, 174 insertions(+), 268 deletions(-) delete mode 100644 components/list/demo/infinite-virtualized-load.md create mode 100644 components/list/demo/virtual-list.md diff --git a/components/list/__tests__/__snapshots__/demo.test.js.snap b/components/list/__tests__/__snapshots__/demo.test.js.snap index 11f4a566b53f..56e0c6a1be28 100644 --- a/components/list/__tests__/__snapshots__/demo.test.js.snap +++ b/components/list/__tests__/__snapshots__/demo.test.js.snap @@ -1122,20 +1122,6 @@ exports[`renders ./components/list/demo/infinite-load.md correctly 1`] = `
`; -exports[`renders ./components/list/demo/infinite-virtualized-load.md correctly 1`] = ` -
-
-
-
-
-`; - exports[`renders ./components/list/demo/loadmore.md correctly 1`] = `
`; + +exports[`renders ./components/list/demo/virtual-list.md correctly 1`] = ` +
+
+
+
+
+
+
+
+
+
+
+
+
+`; diff --git a/components/list/demo/infinite-virtualized-load.md b/components/list/demo/infinite-virtualized-load.md deleted file mode 100644 index 86919658327d..000000000000 --- a/components/list/demo/infinite-virtualized-load.md +++ /dev/null @@ -1,166 +0,0 @@ ---- -order: 7 -title: - zh-CN: 滚动加载无限长列表 - en-US: Infinite & virtualized ---- - -## zh-CN - -结合 [react-virtualized](https://github.com/bvaughn/react-virtualized) 实现滚动加载无限长列表，带有虚拟化（[virtualization](https://blog.jscrambler.com/optimizing-react-rendering-through-virtualization/)）功能，能够提高数据量大时候长列表的性能。 - -`virtualized` 是在大数据列表中应用的一种技术，主要是为了减少不可见区域不必要的渲染从而提高性能，特别是数据量在成千上万条效果尤为明显。[了解更多](https://blog.jscrambler.com/optimizing-react-rendering-through-virtualization/) - -## en-US - -An example of infinite list & virtualized loading using [react-virtualized](https://github.com/bvaughn/react-virtualized). [Learn more](https://blog.jscrambler.com/optimizing-react-rendering-through-virtualization/). - -`Virtualized` rendering is a technique to mount big sets of data. It reduces the amount of rendered DOM nodes by tracking and hiding whatever isn't currently visible. - -```jsx -import { List, message, Avatar, Spin } from 'antd'; -import reqwest from 'reqwest'; -import WindowScroller from 'react-virtualized/dist/commonjs/WindowScroller'; -import AutoSizer from 'react-virtualized/dist/commonjs/AutoSizer'; -import VList from 'react-virtualized/dist/commonjs/List'; -import InfiniteLoader from 'react-virtualized/dist/commonjs/InfiniteLoader'; - -const fakeDataUrl = 'https://randomuser.me/api/?results=5&inc=name,gender,email,nat,picture&noinfo'; - -class VirtualizedExample extends React.Component { - state = { - data: [], - loading: false, - }; - - loadedRowsMap = {}; - - componentDidMount() { - this.fetchData(res => { - this.setState({ - data: res.results, - }); - }); - } - - fetchData = callback => { - reqwest({ - url: fakeDataUrl, - type: 'json', - method: 'get', - contentType: 'application/json', - success: res => { - callback(res); - }, - }); - }; - - handleInfiniteOnLoad = ({ startIndex, stopIndex }) => { - let { data } = this.state; - this.setState({ - loading: true, - }); - for (let i = startIndex; i <= stopIndex; i++) { - // 1 means loading - this.loadedRowsMap[i] = 1; - } - if (data.length > 19) { - message.warning('Virtualized List loaded all'); - this.setState({ - loading: false, - }); - return; - } - this.fetchData(res => { - data = data.concat(res.results); - this.setState({ - data, - loading: false, - }); - }); - }; - - isRowLoaded = ({ index }) => !!this.loadedRowsMap[index]; - - renderItem = ({ index, key, style }) => { - const { data } = this.state; - const item = data[index]; - return ( - - } - title={{item.name.last}} - description={item.email} - /> -
Content
- - ); - }; - - render() { - const { data } = this.state; - const vlist = ({ height, isScrolling, onChildScroll, scrollTop, onRowsRendered, width }) => ( - - ); - const autoSize = ({ height, isScrolling, onChildScroll, scrollTop, onRowsRendered }) => ( - - {({ width }) => - vlist({ - height, - isScrolling, - onChildScroll, - scrollTop, - onRowsRendered, - width, - }) - } - - ); - const infiniteLoader = ({ height, isScrolling, onChildScroll, scrollTop }) => ( - - {({ onRowsRendered }) => - autoSize({ - height, - isScrolling, - onChildScroll, - scrollTop, - onRowsRendered, - }) - } - - ); - return ( - - {data.length > 0 && {infiniteLoader}} - {this.state.loading && } - - ); - } -} - -ReactDOM.render(, mountNode); -``` - -```css -.demo-loading { - position: absolute; - bottom: -40px; - left: 50%; -} -``` diff --git a/components/list/demo/loadmore.md b/components/list/demo/loadmore.md index 86e76afe7ca3..0ba11a8e92a1 100644 --- a/components/list/demo/loadmore.md +++ b/components/list/demo/loadmore.md @@ -15,7 +15,6 @@ Load more list with `loadMore` property. ```jsx import { List, Avatar, Button, Skeleton } from 'antd'; -import reqwest from 'reqwest'; const count = 3; const fakeDataUrl = `https://randomuser.me/api/?results=${count}&inc=name,gender,email,nat,picture&noinfo`; @@ -29,27 +28,17 @@ class LoadMoreList extends React.Component { }; componentDidMount() { - this.getData(res => { - this.setState({ - initLoading: false, - data: res.results, - list: res.results, + fetch(fakeDataUrl) + .then(res => res.json()) + .then(res => { + this.setState({ + initLoading: false, + data: res.results, + list: res.results, + }); }); - }); } - getData = callback => { - reqwest({ - url: fakeDataUrl, - type: 'json', - method: 'get', - contentType: 'application/json', - success: res => { - callback(res); - }, - }); - }; - onLoadMore = () => { this.setState({ loading: true, @@ -57,22 +46,24 @@ class LoadMoreList extends React.Component { [...new Array(count)].map(() => ({ loading: true, name: {}, picture: {} })), ), }); - this.getData(res => { - const data = this.state.data.concat(res.results); - this.setState( - { - data, - list: data, - loading: false, - }, - () => { - // Resetting window's offsetTop so as to display react-virtualized demo underfloor. - // In real scene, you can using public method of react-virtualized: - // https://stackoverflow.com/questions/46700726/how-to-use-public-method-updateposition-of-react-virtualized - window.dispatchEvent(new Event('resize')); - }, - ); - }); + fetch(fakeDataUrl) + .then(res => res.json()) + .then(res => { + const data = this.state.data.concat(res.results); + this.setState( + { + data, + list: data, + loading: false, + }, + () => { + // Resetting window's offsetTop so as to display react-virtualized demo underfloor. + // In real scene, you can using public method of react-virtualized: + // https://stackoverflow.com/questions/46700726/how-to-use-public-method-updateposition-of-react-virtualized + window.dispatchEvent(new Event('resize')); + }, + ); + }); }; render() { @@ -98,22 +89,20 @@ class LoadMoreList extends React.Component { itemLayout="horizontal" loadMore={loadMore} dataSource={list} - renderItem={item => - console.log(item) || ( - edit, more]} - > - - } - title={{item.name.last}} - description="Ant Design, a design language for background applications, is refined by Ant UED Team" - /> -
content
- - - ) - } + renderItem={item => ( + edit, more]} + > + + } + title={{item.name.last}} + description="Ant Design, a design language for background applications, is refined by Ant UED Team" + /> +
content
+ + + )} /> ); } diff --git a/components/list/demo/virtual-list.md b/components/list/demo/virtual-list.md new file mode 100644 index 000000000000..ae3f531fdf33 --- /dev/null +++ b/components/list/demo/virtual-list.md @@ -0,0 +1,72 @@ +--- +order: 7 +title: + zh-CN: 滚动加载无限长列表 + en-US: virtual list +--- + +## zh-CN + +结合 [rc-virtual-list](https://github.com/react-component/virtual-list) 实现滚动加载无限长列表，能够提高数据量大时候长列表的性能。 + +## en-US + +An example of infinite & virtualized list via using [rc-virtual-list](https://github.com/react-component/virtual-list). + +```jsx +import React, { useState, useEffect } from 'react'; +import { List, message, Avatar } from 'antd'; +import VirtualList from 'rc-virtual-list'; + +const fakeDataUrl = + 'https://randomuser.me/api/?results=20&inc=name,gender,email,nat,picture&noinfo'; +const ContainerHeight = 400; + +const VirtualizedExample = () => { + const [data, setData] = useState([]); + + const appendData = () => { + fetch(fakeDataUrl) + .then(res => res.json()) + .then(body => { + setData(data.concat(body.results)); + message.success(`${body.results.length} more items loaded!`); + }); + }; + + useEffect(() => { + appendData(); + }, []); + + const onScroll = e => { + if (e.target.scrollHeight - e.target.scrollTop === ContainerHeight) { + appendData(); + } + }; + + return ( + + + {item => ( + + } + title={{item.name.last}} + description={item.email} + /> +
Content
+ + )} + + + ); +}; + +ReactDOM.render(, mountNode); +``` diff --git a/components/select/demo/search-box.md b/components/select/demo/search-box.md index 0de8ede39327..b98beb7b9707 100644 --- a/components/select/demo/search-box.md +++ b/components/select/demo/search-box.md @@ -16,7 +16,7 @@ Search with remote data. ```jsx import { Select } from 'antd'; import jsonp from 'fetch-jsonp'; -import querystring from 'querystring'; +import qs from 'qs'; const { Option } = Select; @@ -31,7 +31,7 @@ function fetch(value, callback) { currentValue = value; function fake() { - const str = querystring.encode({ + const str = qs.stringify({ code: 'utf-8', q: value, }); diff --git a/components/table/demo/ajax.md b/components/table/demo/ajax.md index e84ecff8ceea..8292952afa4f 100644 --- a/components/table/demo/ajax.md +++ b/components/table/demo/ajax.md @@ -27,7 +27,7 @@ Setting `rowSelection.preserveSelectedRowKeys` to keep the `key` when enable sel ```jsx import { Table } from 'antd'; -import reqwest from 'reqwest'; +import qs from 'qs'; const columns = [ { @@ -84,24 +84,21 @@ class App extends React.Component { fetch = (params = {}) => { this.setState({ loading: true }); - reqwest({ - url: 'https://randomuser.me/api', - method: 'get', - type: 'json', - data: getRandomuserParams(params), - }).then(data => { - console.log(data); - this.setState({ - loading: false, - data: data.results, - pagination: { - ...params.pagination, - total: 200, - // 200 is mock data, you should read it from server - // total: data.totalCount, - }, + fetch(`https://randomuser.me/api?${qs.stringify(getRandomuserParams(params))}`) + .then(res => res.json()) + .then(data => { + console.log(data); + this.setState({ + loading: false, + data: data.results, + pagination: { + ...params.pagination, + total: 200, + // 200 is mock data, you should read it from server + // total: data.totalCount, + }, + }); }); - }); }; render() { diff --git a/components/upload/demo/upload-manually.md b/components/upload/demo/upload-manually.md index c8c3f0cc578a..1db5f147d3a3 100644 --- a/components/upload/demo/upload-manually.md +++ b/components/upload/demo/upload-manually.md @@ -16,7 +16,6 @@ Upload files manually after `beforeUpload` returns `false`. ```jsx import { Upload, Button, message } from 'antd'; import { UploadOutlined } from '@ant-design/icons'; -import reqwest from 'reqwest'; class Demo extends React.Component { state = { @@ -30,31 +29,29 @@ class Demo extends React.Component { fileList.forEach(file => { formData.append('files[]', file); }); - this.setState({ uploading: true, }); - // You can use any AJAX library you like - reqwest({ - url: 'https://www.mocky.io/v2/5cc8019d300000980a055e76', - method: 'post', - processData: false, - data: formData, - success: () => { + fetch('https://www.mocky.io/v2/5cc8019d300000980a055e76', { + method: 'POST', + body: formData, + }) + .then(res => res.json()) + .then(() => { this.setState({ fileList: [], - uploading: false, }); message.success('upload successfully.'); - }, - error: () => { + }) + .catch(() => { + message.error('upload failed.'); + }) + .finally(() => { this.setState({ uploading: false, }); - message.error('upload failed.'); - }, - }); + }); }; render() { diff --git a/docs/react/recommendation.en-US.md b/docs/react/recommendation.en-US.md index 95f55d33eeb4..64ea436e38f5 100644 --- a/docs/react/recommendation.en-US.md +++ b/docs/react/recommendation.en-US.md @@ -26,7 +26,7 @@ title: Third-Party Libraries | i18n | [FormatJS](https://github.com/formatjs/formatjs) [react-i18next](https://react.i18next.com) | | Code highlight | [react-syntax-highlighter](https://github.com/conorhastings/react-syntax-highlighter) | | Markdown renderer | [react-markdown](https://remarkjs.github.io/react-markdown/) | -| Infinite Scroll | [rc-virtual-list](https://github.com/react-component/virtual-list/) [react-virtualized](https://github.com/bvaughn/react-virtualized) [react-infinite-scroll-component](https://github.com/ankeetmaini/react-infinite-scroll-component) | +| Infinite Scroll | [rc-virtual-list](https://github.com/react-component/virtual-list/) [react-infinite-scroll-component](https://github.com/ankeetmaini/react-infinite-scroll-component) | | Map | [react-google-maps](https://github.com/tomchentw/react-google-maps) [google-map-react](https://github.com/istarkov/google-map-react) [react-amap](https://github.com/ElemeFE/react-amap) | | Video | [react-player](https://github.com/CookPete/react-player) [video-react](https://github.com/video-react/video-react) [video.js](http://docs.videojs.com/tutorial-react.html) | | Context Menu | [react-contextmenu](https://github.com/vkbansal/react-contextmenu/) [react-contexify](https://github.com/fkhadra/react-contexify) | diff --git a/docs/react/recommendation.zh-CN.md b/docs/react/recommendation.zh-CN.md index 8501c987b4d3..8c34b9c77962 100644 --- a/docs/react/recommendation.zh-CN.md +++ b/docs/react/recommendation.zh-CN.md @@ -26,7 +26,7 @@ title: 社区精选组件 | 应用国际化 | [FormatJS](https://github.com/formatjs/formatjs) [react-i18next](https://react.i18next.com) | | 代码高亮 | [react-syntax-highlighter](https://github.com/conorhastings/react-syntax-highlighter) | | Markdown 渲染 | [react-markdown](https://remarkjs.github.io/react-markdown/) | -| 无限滚动 | [rc-virtual-list](https://github.com/react-component/virtual-list/) [react-virtualized](https://github.com/bvaughn/react-virtualized) [react-infinite-scroll-component](https://github.com/ankeetmaini/react-infinite-scroll-component) | +| 无限滚动 | [rc-virtual-list](https://github.com/react-component/virtual-list/) [react-infinite-scroll-component](https://github.com/ankeetmaini/react-infinite-scroll-component) | | 地图 | [react-google-maps](https://github.com/tomchentw/react-google-maps) [google-map-react](https://github.com/istarkov/google-map-react) [react-amap 高德](https://github.com/ElemeFE/react-amap) | | 视频播放 | [react-player](https://github.com/CookPete/react-player) [video-react](https://github.com/video-react/video-react) [video.js](http://docs.videojs.com/tutorial-react.html) | | 右键菜单 | [react-contextmenu](https://github.com/vkbansal/react-contextmenu/) [react-contexify](https://github.com/fkhadra/react-contexify) | From e0c777d5b4f155d149458d657f66ffd077dbc08c Mon Sep 17 00:00:00 2001 From: Tom And Jerry <45513363+sunkuangdong@users.noreply.github.com> Date: Sat, 4 Dec 2021 00:10:59 +0800 Subject: [PATCH 08/15] refactor: replace let with const (#33134) * refactor: replace let with const * refactor: replace let with const * refactor: replace let with const * refactor: replace let with const new * Update components/affix/index.tsx * Apply suggestions from code review * Apply suggestions from code review Co-authored-by: afc163 --- components/affix/index.tsx | 13 +++---------- 1 file changed, 3 insertions(+), 10 deletions(-) diff --git a/components/affix/index.tsx b/components/affix/index.tsx index 8efae73988f4..c39d282b2f1a 100644 --- a/components/affix/index.tsx +++ b/components/affix/index.tsx @@ -92,10 +92,7 @@ class Affix extends React.Component { componentDidUpdate(prevProps: AffixProps) { const { prevTarget } = this.state; const targetFunc = this.getTargetFunc(); - let newTarget = null; - if (targetFunc) { - newTarget = targetFunc() || null; - } + const newTarget = targetFunc?.() || null; if (prevTarget !== newTarget) { removeObserveTarget(this); @@ -128,12 +125,8 @@ class Affix extends React.Component { } getOffsetTop = () => { - const { offsetBottom } = this.props; - let { offsetTop } = this.props; - if (offsetBottom === undefined && offsetTop === undefined) { - offsetTop = 0; - } - return offsetTop; + const { offsetBottom, offsetTop } = this.props; + return (offsetBottom === undefined && offsetTop === undefined) ? 0 : offsetTop; }; getOffsetBottom = () => this.props.offsetBottom; From b9a381e51d0d1d580b139c857ad97b3a8f7f4b9d Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sat, 4 Dec 2021 00:36:24 +0800 Subject: [PATCH 09/15] chore(deps-dev): bump jsdom from 18.1.1 to 19.0.0 (#33156) Bumps [jsdom](https://github.com/jsdom/jsdom) from 18.1.1 to 19.0.0. - [Release notes](https://github.com/jsdom/jsdom/releases) - [Changelog](https://github.com/jsdom/jsdom/blob/master/Changelog.md) - [Commits](https://github.com/jsdom/jsdom/compare/18.1.1...19.0.0) --- updated-dependencies: - dependency-name: jsdom dependency-type: direct:development update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9f056320de29..a6c7423714ef 100644 --- a/package.json +++ b/package.json @@ -230,7 +230,7 @@ "jest-image-snapshot": "^4.5.1", "jest-puppeteer": "^6.0.0", "jquery": "^3.4.1", - "jsdom": "^18.0.0", + "jsdom": "^19.0.0", "jsonml.js": "^0.1.0", "less-vars-to-js": "^1.3.0", "lz-string": "^1.4.4", From b34f72b1b68a7821dedfc66b6a496662f8d58450 Mon Sep 17 00:00:00 2001 From: afc163 Date: Sat, 4 Dec 2021 17:06:36 +0800 Subject: [PATCH 10/15] test: fix ci warnings (#33160) --- .../__snapshots__/index.test.tsx.snap | 297 ++++++++++++++---- components/alert/__tests__/index.test.tsx | 15 +- .../__snapshots__/index.test.js.snap | 34 +- .../auto-complete/__tests__/index.test.js | 2 +- components/avatar/__tests__/Avatar.test.js | 4 +- .../__snapshots__/Avatar.test.js.snap | 17 +- .../__snapshots__/index.test.js.snap | 4 +- .../__snapshots__/index.test.tsx.snap | 64 +--- components/button/__tests__/index.test.tsx | 40 +-- .../__snapshots__/index.test.js.snap | 22 +- .../__snapshots__/index.test.js.snap | 2 +- .../__snapshots__/index.test.js.snap | 11 +- .../__snapshots__/checkbox.test.js.snap | 1 + components/comment/__tests__/index.test.js | 2 +- .../config-provider/__tests__/form.test.js | 2 +- .../config-provider/__tests__/index.test.js | 2 +- .../date-picker/__tests__/RangePicker.test.js | 2 +- .../__snapshots__/RangePicker.test.js.snap | 20 +- .../__snapshots__/mount.test.js.snap | 2 +- .../__snapshots__/index.test.js.snap | 8 +- components/dropdown/__tests__/index.test.js | 4 +- components/form/__tests__/index.test.js | 4 +- .../__snapshots__/index.test.js.snap | 2 +- .../__snapshots__/index.test.js.snap | 5 +- .../__snapshots__/index.test.js.snap | 8 +- components/progress/__tests__/index.test.js | 2 +- .../__snapshots__/radio.test.js.snap | 2 + .../__snapshots__/index.test.js.snap | 11 +- .../__snapshots__/index.test.js.snap | 4 +- .../__snapshots__/index.test.js.snap | 4 +- .../__snapshots__/index.test.js.snap | 2 +- .../__snapshots__/Table.test.js.snap | 2 +- .../__snapshots__/index.test.js.snap | 60 +++- components/tabs/__tests__/index.test.js | 20 +- .../__snapshots__/index.test.js.snap | 18 ++ .../__tests__/__snapshots__/list.test.js.snap | 4 + components/transfer/__tests__/index.test.js | 8 +- components/transfer/__tests__/list.test.js | 2 +- components/transfer/__tests__/search.test.js | 4 +- .../__snapshots__/index.test.js.snap | 11 +- .../__snapshots__/directory.test.js.snap | 16 +- .../__snapshots__/upload.test.js.snap | 4 +- site/bisheng.config.js | 1 + tests/matchers/rendered-snapshot.ts | 21 -- tests/setupAfterEnv.ts | 4 - tests/shared/rtlTest.tsx | 2 +- typings/jest.d.ts | 1 - 47 files changed, 478 insertions(+), 299 deletions(-) delete mode 100644 tests/matchers/rendered-snapshot.ts diff --git a/components/alert/__tests__/__snapshots__/index.test.tsx.snap b/components/alert/__tests__/__snapshots__/index.test.tsx.snap index d07a3c448ea9..1323b431c740 100644 --- a/components/alert/__tests__/__snapshots__/index.test.tsx.snap +++ b/components/alert/__tests__/__snapshots__/index.test.tsx.snap @@ -1,77 +1,238 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Alert action of Alert custom action 1`] = ` - + + + + + + + + + +
+
+ Success Tips +
+
+
+ + +
+ +
+ + + `; exports[`Alert could accept none react element icon 1`] = ` diff --git a/components/alert/__tests__/index.test.tsx b/components/alert/__tests__/index.test.tsx index e27eeb2c5c35..e30928f29796 100644 --- a/components/alert/__tests__/index.test.tsx +++ b/components/alert/__tests__/index.test.tsx @@ -1,5 +1,6 @@ import React from 'react'; -import { mount, render } from 'enzyme'; +import { mount } from 'enzyme'; +import { act } from 'react-dom/test-utils'; import Alert from '..'; import Button from '../../button'; import Tooltip from '../../tooltip'; @@ -32,14 +33,18 @@ describe('Alert', () => { onClose={onClose} />, ); - wrapper.find('.ant-alert-close-icon').simulate('click'); - jest.runAllTimers(); + act(() => { + jest.useFakeTimers(); + wrapper.find('.ant-alert-close-icon').simulate('click'); + jest.runAllTimers(); + jest.useRealTimers(); + }); expect(onClose).toHaveBeenCalled(); }); describe('action of Alert', () => { it('custom action', () => { - const wrapper = render( + const wrapper = mount( { it('could accept none react element icon', () => { const wrapper = mount(); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); it('should not render message div when no message', () => { diff --git a/components/auto-complete/__tests__/__snapshots__/index.test.js.snap b/components/auto-complete/__tests__/__snapshots__/index.test.js.snap index fa28dcb9693a..0d8ed7794154 100644 --- a/components/auto-complete/__tests__/__snapshots__/index.test.js.snap +++ b/components/auto-complete/__tests__/__snapshots__/index.test.js.snap @@ -11,14 +11,15 @@ exports[`AutoComplete legacy dataSource should accept react element option 1`] = class="ant-select-selection-search" >
key @@ -50,20 +51,20 @@ exports[`AutoComplete legacy dataSource should accept react element option 1`] =
@@ -99,13 +100,14 @@ exports[`AutoComplete rtl render component should be rendered correctly in RTL d class="ant-select-selection-search" > { it('legacy dataSource should accept react element option', () => { const wrapper = mount(ReactNode]} />); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); it('legacy AutoComplete.Option should be compatiable', () => { diff --git a/components/avatar/__tests__/Avatar.test.js b/components/avatar/__tests__/Avatar.test.js index aa066fdf7a17..a65782dba0be 100644 --- a/components/avatar/__tests__/Avatar.test.js +++ b/components/avatar/__tests__/Avatar.test.js @@ -155,7 +155,7 @@ describe('Avatar Render', () => { it('support size is number', () => { const wrapper = mount(TestString); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); Object.entries(sizes).forEach(([key, value]) => { @@ -189,7 +189,7 @@ describe('Avatar Render', () => { ); wrapper.find('img').simulate('error'); wrapper.update(); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); wrapper.detach(); global.document.body.removeChild(div); }); diff --git a/components/avatar/__tests__/__snapshots__/Avatar.test.js.snap b/components/avatar/__tests__/__snapshots__/Avatar.test.js.snap index 66ab85ed28c9..8d66c5c98f76 100644 --- a/components/avatar/__tests__/__snapshots__/Avatar.test.js.snap +++ b/components/avatar/__tests__/__snapshots__/Avatar.test.js.snap @@ -86,11 +86,14 @@ exports[`Avatar Render adjusts component size to 100 when window size is xxl 1`] exports[`Avatar Render fallback 1`] = ` - + + A + `; @@ -100,7 +103,7 @@ exports[`Avatar Render rtl render component should be rendered correctly in RTL > `; @@ -229,11 +232,11 @@ exports[`Avatar Render should show image on success after a failure state 2`] = exports[`Avatar Render support size is number 1`] = ` TestString diff --git a/components/badge/__tests__/__snapshots__/index.test.js.snap b/components/badge/__tests__/__snapshots__/index.test.js.snap index d9155ad6c456..d21432a4c6c0 100644 --- a/components/badge/__tests__/__snapshots__/index.test.js.snap +++ b/components/badge/__tests__/__snapshots__/index.test.js.snap @@ -173,12 +173,12 @@ exports[`Badge rtl render component should be rendered correctly in RTL directio - - - - - 按钮 - - + `; exports[`Button renders Chinese characters correctly 4`] = ` - + 按钮 + `; exports[`Button renders Chinese characters correctly 5`] = ` @@ -169,10 +124,11 @@ exports[`Button renders Chinese characters correctly 6`] = ` > { rtlTest(() => ); it('renders correctly', () => { - expect().toMatchRenderedSnapshot(); + expect(mount().render()).toMatchSnapshot(); }); it('mount correctly', () => { @@ -47,33 +47,37 @@ describe('Button', () => { }); it('renders Chinese characters correctly', () => { - expect().toMatchRenderedSnapshot(); + expect(mount().render()).toMatchSnapshot(); // should not insert space when there is icon - expect(}>按钮).toMatchRenderedSnapshot(); + expect(mount(}>按钮).render()).toMatchSnapshot(); // should not insert space when there is icon expect( , - ).toMatchRenderedSnapshot(); + ).toMatchSnapshot(); // should not insert space when there is icon - expect(}>按钮).toMatchRenderedSnapshot(); + expect(}>按钮).toMatchSnapshot(); // should not insert space when there is icon while loading expect( - } loading> - 按钮 - , - ).toMatchRenderedSnapshot(); + mount( + } loading> + 按钮 + , + ).render(), + ).toMatchSnapshot(); // should insert space while loading - expect().toMatchRenderedSnapshot(); + expect(mount().render()).toMatchSnapshot(); // should insert space while only one nested element expect( - 按钮 - , - ).toMatchRenderedSnapshot(); + mount( + , + ).render(), + ).toMatchSnapshot(); }); it('renders Chinese characters correctly in HOC', () => { @@ -206,9 +210,9 @@ describe('Button', () => { }); it('fixbug renders {0} , 0 and {false}', () => { - expect().toMatchRenderedSnapshot(); - expect().toMatchRenderedSnapshot(); - expect().toMatchRenderedSnapshot(); + expect(mount().render()).toMatchSnapshot(); + expect(mount().render()).toMatchSnapshot(); + expect(mount().render()).toMatchSnapshot(); }); it('should not render as link button when href is undefined', async () => { @@ -320,6 +324,6 @@ describe('Button', () => { <>text , ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); }); diff --git a/components/calendar/__tests__/__snapshots__/index.test.js.snap b/components/calendar/__tests__/__snapshots__/index.test.js.snap index 3cb53bd8576b..3182f3e41cf4 100644 --- a/components/calendar/__tests__/__snapshots__/index.test.js.snap +++ b/components/calendar/__tests__/__snapshots__/index.test.js.snap @@ -1905,16 +1905,17 @@ exports[`Calendar rtl render component should be rendered correctly in RTL direc class="ant-select-selection-search" >
diff --git a/components/cascader/__tests__/__snapshots__/index.test.js.snap b/components/cascader/__tests__/__snapshots__/index.test.js.snap index 4385c6965982..87bf5ca963cb 100644 --- a/components/cascader/__tests__/__snapshots__/index.test.js.snap +++ b/components/cascader/__tests__/__snapshots__/index.test.js.snap @@ -1264,16 +1264,17 @@ exports[`Cascader rtl render component should be rendered correctly in RTL direc class="ant-select-selection-search" > { datetime="YYYY-MM-DD HH:mm:ss" />, ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); }); diff --git a/components/config-provider/__tests__/form.test.js b/components/config-provider/__tests__/form.test.js index f5617ce56d1a..71d1204a9bde 100644 --- a/components/config-provider/__tests__/form.test.js +++ b/components/config-provider/__tests__/form.test.js @@ -88,7 +88,7 @@ describe('ConfigProvider.Form', () => { , ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); }); }); diff --git a/components/config-provider/__tests__/index.test.js b/components/config-provider/__tests__/index.test.js index 83f93d9aca35..4b11c42a307b 100644 --- a/components/config-provider/__tests__/index.test.js +++ b/components/config-provider/__tests__/index.test.js @@ -113,6 +113,6 @@ describe('ConfigProvider', () => { , ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); }); diff --git a/components/date-picker/__tests__/RangePicker.test.js b/components/date-picker/__tests__/RangePicker.test.js index bd890d5e5e51..26a347abef1c 100644 --- a/components/date-picker/__tests__/RangePicker.test.js +++ b/components/date-picker/__tests__/RangePicker.test.js @@ -87,7 +87,7 @@ describe('RangePicker', () => { open />, ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); }); diff --git a/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap b/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap index 23e2cc902b22..250e9bbec620 100644 --- a/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap +++ b/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap @@ -118,7 +118,7 @@ Array [
,
,
menu @@ -31,8 +31,8 @@ Array [ ,
string diff --git a/components/dropdown/__tests__/index.test.js b/components/dropdown/__tests__/index.test.js index bb991dfd8534..06631ea92ac3 100644 --- a/components/dropdown/__tests__/index.test.js +++ b/components/dropdown/__tests__/index.test.js @@ -25,7 +25,7 @@ describe('Dropdown', () => { , ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); it('overlay is string', () => { @@ -34,7 +34,7 @@ describe('Dropdown', () => { , ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); it('support Menu expandIcon', async () => { diff --git a/components/form/__tests__/index.test.js b/components/form/__tests__/index.test.js index b741fbc473d4..bf6432db3e0a 100644 --- a/components/form/__tests__/index.test.js +++ b/components/form/__tests__/index.test.js @@ -796,7 +796,7 @@ describe('Form', () => { , ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); it('noStyle should not work when hidden', () => { @@ -807,7 +807,7 @@ describe('Form', () => { , ); - expect(wrapper).toMatchRenderedSnapshot(); + expect(wrapper.render()).toMatchSnapshot(); }); }); diff --git a/components/layout/__tests__/__snapshots__/index.test.js.snap b/components/layout/__tests__/__snapshots__/index.test.js.snap index c449351cd4a0..80c2074bd169 100644 --- a/components/layout/__tests__/__snapshots__/index.test.js.snap +++ b/components/layout/__tests__/__snapshots__/index.test.js.snap @@ -28,7 +28,7 @@ exports[`Layout rtl render component should be rendered correctly in RTL directi exports[`Layout rtl render component should be rendered correctly in RTL direction 3`] = `