From 272ff9885a197b2d57b3ff519c765c7cc0e207e3 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: Mon, 13 Sep 2021 15:59:57 +0800 Subject: [PATCH] fix: Cascader missing props (#32143) * fix: Cascader deps * docs: Update using new API * test: Test case cover * chore: compressed skip dup check --- .github/workflows/compressed-size.yml | 2 +- components/cascader/__tests__/index.test.js | 14 +++++++++++ components/cascader/index.en-US.md | 12 ++++----- components/cascader/index.tsx | 25 ++++++++++++++++--- components/cascader/index.zh-CN.md | 12 ++++----- .../__tests__/container.test.js | 9 ++++++- package.json | 7 +++--- webpack.config.js | 14 ++++++----- 8 files changed, 68 insertions(+), 27 deletions(-) diff --git a/.github/workflows/compressed-size.yml b/.github/workflows/compressed-size.yml index 25e4e34f48..2af90bf700 100644 --- a/.github/workflows/compressed-size.yml +++ b/.github/workflows/compressed-size.yml @@ -15,5 +15,5 @@ jobs: with: repo-token: "${{ secrets.GITHUB_TOKEN }}" pattern: "./dist/**/*.min.{js,css}" - build-script: "dist:esbuild" + build-script: "dist:esbuild-no-dup-check" clean-script: "clean-lockfiles" \ No newline at end of file diff --git a/components/cascader/__tests__/index.test.js b/components/cascader/__tests__/index.test.js index c4151463f5..479d654178 100644 --- a/components/cascader/__tests__/index.test.js +++ b/components/cascader/__tests__/index.test.js @@ -473,4 +473,18 @@ describe('Cascader', () => { clickOption(wrapper, 0, 0); expect(onChange).toHaveBeenCalledWith(['Zhejiang', 'Hangzhou', 'West Lake'], expect.anything()); }); + + it('legacy props', () => { + const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); + const wrapper = mount(); + + expect(wrapper.exists('.mock-cls')).toBeTruthy(); + expect(wrapper.find('Trigger').prop('popupPlacement')).toEqual('topRight'); + + expect(errorSpy).toHaveBeenCalledWith( + 'Warning: [antd: Cascader] `popupClassName` is deprecated. Please use `dropdownClassName` instead.', + ); + + errorSpy.mockRestore(); + }); }); diff --git a/components/cascader/index.en-US.md b/components/cascader/index.en-US.md index 1ec137bf17..7db69ddefd 100644 --- a/components/cascader/index.en-US.md +++ b/components/cascader/index.en-US.md @@ -29,6 +29,7 @@ Cascade selection box. | defaultValue | Initial selected value | string\[] \| number\[] | \[] | | | disabled | Whether disabled select | boolean | false | | | displayRender | The render function of displaying selected options | (label, selectedOptions) => ReactNode | label => label.join(`/`) | | +| dropdownClassName | The additional className of popup overlay | string | - | 4.17.0 | | dropdownRender | Customize dropdown content | (menus: ReactNode) => ReactNode | - | 4.4.0 | | expandIcon | Customize the current item expand icon | ReactNode | - | 4.4.0 | | expandTrigger | expand current item when click or hover, one of `click` `hover` | string | `click` | | @@ -39,8 +40,7 @@ Cascade selection box. | open | Set visible of cascader popup | boolean | - | 4.17.0 | | options | The data options of cascade | [Option](#Option)\[] | - | | | placeholder | The input placeholder | string | `Please select` | | -| popupClassName | The additional className of popup overlay | string | - | | -| popupPlacement | Use preset popup align config from builtinPlacements：`bottomLeft` `bottomRight` `topLeft` `topRight` | string | `bottomLeft` | | +| placement | Use preset popup align config from builtinPlacements：`bottomLeft` `bottomRight` `topLeft` `topRight` | string | `bottomLeft` | 4.17.0 | | showSearch | Whether show search input in single mode | boolean \| [Object](#showSearch) | false | | | size | The input size | `large` \| `middle` \| `small` | - | | | style | The additional style | CSSProperties | - | | @@ -72,7 +72,7 @@ interface Option { ## Methods -| Name | Description | Version | -| --- | --- | --- | -| blur() | Remove focus | | -| focus() | Get focus | | +| Name | Description | Version | +| ------- | ------------ | ------- | +| blur() | Remove focus | | +| focus() | Get focus | | diff --git a/components/cascader/index.tsx b/components/cascader/index.tsx index 6de339baca..d12acd1223 100644 --- a/components/cascader/index.tsx +++ b/components/cascader/index.tsx @@ -7,6 +7,7 @@ import omit from 'rc-util/lib/omit'; import RightOutlined from '@ant-design/icons/RightOutlined'; import RedoOutlined from '@ant-design/icons/RedoOutlined'; import LeftOutlined from '@ant-design/icons/LeftOutlined'; +import devWarning from '../_util/devWarning'; import { ConfigContext } from '../config-provider'; import type { SizeType } from '../config-provider/SizeContext'; import SizeContext from '../config-provider/SizeContext'; @@ -91,19 +92,21 @@ const Cascader = React.forwardRef((props: CascaderProps, ref: React.Ref { @@ -205,6 +221,7 @@ const Cascader = React.forwardRef((props: CascaderProps, ref: React.Ref ); diff --git a/components/cascader/index.zh-CN.md b/components/cascader/index.zh-CN.md index c88a08e98a..24a897e048 100644 --- a/components/cascader/index.zh-CN.md +++ b/components/cascader/index.zh-CN.md @@ -30,6 +30,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/UdS8y8xyZ/Cascader.svg | defaultValue | 默认的选中项 | string\[] \| number\[] | \[] | | | disabled | 禁用 | boolean | false | | | displayRender | 选择后展示的渲染函数 | (label, selectedOptions) => ReactNode | label => label.join(`/`) | | +| dropdownClassName | 自定义浮层类名 | string | - | 4.17.0 | | dropdownRender | 自定义下拉框内容 | (menus: ReactNode) => ReactNode | - | 4.4.0 | | expandIcon | 自定义次级菜单展开图标 | ReactNode | - | 4.4.0 | | expandTrigger | 次级菜单的展开方式，可选 'click' 和 'hover' | string | `click` | | @@ -40,8 +41,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/UdS8y8xyZ/Cascader.svg | open | 控制浮层显隐 | boolean | - | 4.17.0 | | options | 可选项数据源 | [Option](#Option)\[] | - | | | placeholder | 输入框占位文本 | string | `请选择` | | -| popupClassName | 自定义浮层类名 | string | - | | -| popupPlacement | 浮层预设位置：`bottomLeft` `bottomRight` `topLeft` `topRight` | string | `bottomLeft` | | +| placement | 浮层预设位置：`bottomLeft` `bottomRight` `topLeft` `topRight` | string | `bottomLeft` | 4.17.0 | | showSearch | 在选择框中显示搜索框 | boolean \| [Object](#showSearch) | false | | | size | 输入框大小 | `large` \| `middle` \| `small` | - | | | style | 自定义样式 | CSSProperties | - | | @@ -75,9 +75,9 @@ interface Option { ## 方法 -| 名称 | 描述 | 版本 | -| --- | --- | --- | -| blur() | 移除焦点 | | -| focus() | 获取焦点 | | +| 名称 | 描述 | 版本 | +| ------- | -------- | ---- | +| blur() | 移除焦点 | | +| focus() | 获取焦点 | | > 注意，如果需要获得中国省市区数据，可以参考 [china-division](https://gist.github.com/afc163/7582f35654fd03d5be7009444345ea17)。 diff --git a/components/config-provider/__tests__/container.test.js b/components/config-provider/__tests__/container.test.js index 1549078adf..d5377d0bc5 100644 --- a/components/config-provider/__tests__/container.test.js +++ b/components/config-provider/__tests__/container.test.js @@ -4,6 +4,7 @@ import ConfigProvider from '..'; import DatePicker from '../../date-picker'; import Slider from '../../slider'; import Drawer from '../../drawer'; +import Cascader from '../../cascader'; describe('ConfigProvider.GetPopupContainer', () => { it('Datepicker', () => { @@ -27,7 +28,7 @@ describe('ConfigProvider.GetPopupContainer', () => { expect(getPopupContainer).toHaveBeenCalled(); }); - it('drawer', () => { + it('Drawer', () => { const getPopupContainer = jest.fn(node => node.parentNode); const Demo = ({ visible }) => ( @@ -37,4 +38,10 @@ describe('ConfigProvider.GetPopupContainer', () => { mount(); expect(getPopupContainer).toHaveBeenCalled(); }); + + it('Cascader', () => { + const getPopupContainer = jest.fn(node => node.parentNode); + mount(); + expect(getPopupContainer).toHaveBeenCalled(); + }); }); diff --git a/package.json b/package.json index 33b7735a28..e1d3e199c6 100644 --- a/package.json +++ b/package.json @@ -68,6 +68,7 @@ "deploy:china-mirror": "git checkout gh-pages && git pull origin gh-pages && git push git@gitee.com:ant-design/ant-design.git gh-pages", "dist": "antd-tools run dist", "dist:esbuild": "ESBUILD=true npm run dist", + "dist:esbuild-no-dup-check": "ESBUILD=true NO_DUP_CHECK=true npm run dist", "lint": "npm run tsc && npm run lint:script && npm run lint:demo && npm run lint:style && npm run lint:deps && npm run lint:md", "lint-fix": "npm run lint-fix:script && npm run lint-fix:demo && npm run lint-fix:style", "lint-fix:demo": "npm run lint:demo -- --fix", @@ -117,7 +118,7 @@ "copy-to-clipboard": "^3.2.0", "lodash": "^4.17.21", "moment": "^2.25.3", - "rc-cascader": "~2.0.0-alpha.17", + "rc-cascader": "~2.0.0-alpha.18", "rc-checkbox": "~2.3.0", "rc-collapse": "~3.1.0", "rc-dialog": "~8.6.0", @@ -135,7 +136,7 @@ "rc-progress": "~3.1.0", "rc-rate": "~2.9.0", "rc-resize-observer": "^1.0.0", - "rc-select": "~13.0.0-alpha.4", + "rc-select": "~13.1.0-alpha.0", "rc-slider": "~9.7.1", "rc-steps": "~4.1.0", "rc-switch": "~3.2.0", @@ -144,7 +145,7 @@ "rc-textarea": "~0.3.0", "rc-tooltip": "~5.1.1", "rc-tree": "~5.0.1", - "rc-tree-select": "~4.4.0-alpha.4", + "rc-tree-select": "~4.5.0-alpha.0", "rc-trigger": "^5.2.10", "rc-upload": "~4.3.0", "rc-util": "^5.13.1", diff --git a/webpack.config.js b/webpack.config.js index e8f200fe45..d7fda02373 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -145,12 +145,14 @@ if (process.env.RUN_ENV === 'PRODUCTION') { }), ); - config.plugins.push( - new DuplicatePackageCheckerPlugin({ - verbose: true, - emitError: true, - }), - ); + if (!process.env.NO_DUP_CHECK) { + config.plugins.push( + new DuplicatePackageCheckerPlugin({ + verbose: true, + emitError: true, + }), + ); + } }); processWebpackThemeConfig(webpackDarkConfig, 'dark', darkVars);