From e5aea71b99fd8ca437d41dc8f2f4b348556bdac1 Mon Sep 17 00:00:00 2001 From: afc163 Date: Sun, 29 Sep 2019 12:33:24 +0800 Subject: [PATCH 01/14] :white_check_mark: increase upload test cov --- components/upload/Upload.tsx | 2 +- .../__snapshots__/uploadlist.test.js.snap | 96 +++++++++++++++++++ components/upload/__tests__/dragger.test.js | 28 ++++++ components/upload/__tests__/upload.test.js | 56 ++++++++++- .../upload/__tests__/uploadlist.test.js | 31 ++++++ components/upload/utils.tsx | 7 +- 6 files changed, 214 insertions(+), 6 deletions(-) create mode 100644 components/upload/__tests__/dragger.test.js diff --git a/components/upload/Upload.tsx b/components/upload/Upload.tsx index fa4a6ba59b..900c529308 100644 --- a/components/upload/Upload.tsx +++ b/components/upload/Upload.tsx @@ -98,7 +98,7 @@ class Upload extends React.Component { fileList: nextFileList, }); // fix ie progress - if (!(window as any).FormData) { + if (!(window as any).File || process.env.TEST_IE) { this.autoUpdateProgress(0, targetItem); } }; diff --git a/components/upload/__tests__/__snapshots__/uploadlist.test.js.snap b/components/upload/__tests__/__snapshots__/uploadlist.test.js.snap index 20a9c10202..3ee248adbc 100644 --- a/components/upload/__tests__/__snapshots__/uploadlist.test.js.snap +++ b/components/upload/__tests__/__snapshots__/uploadlist.test.js.snap @@ -934,3 +934,99 @@ exports[`Upload List should non-image format file preview 1`] = ` `; + +exports[`Upload List should support showRemoveIcon and showPreviewIcon 1`] = ` + +
+ + + + +
+
+
+
+ + + image + + + image + + +
+
+
+
+
+ + + image + + + image + + +
+
+
+ +`; diff --git a/components/upload/__tests__/dragger.test.js b/components/upload/__tests__/dragger.test.js new file mode 100644 index 0000000000..a44d0e6574 --- /dev/null +++ b/components/upload/__tests__/dragger.test.js @@ -0,0 +1,28 @@ +/* eslint-disable react/no-string-refs, react/prefer-es6-class */ +import React from 'react'; +import { mount } from 'enzyme'; +import Upload from '..'; +import { setup, teardown } from './mock'; +import mountTest from '../../../tests/shared/mountTest'; + +describe('Upload.Dragger', () => { + mountTest(Upload.Dragger); + + beforeEach(() => setup()); + afterEach(() => teardown()); + + it('support drag file with over style', () => { + const wrapper = mount( + +
+ , + ); + + wrapper.find('.ant-upload-drag-container').simulate('dragover', { + target: { + files: [{ file: 'foo.png' }], + }, + }); + expect(wrapper.find('.ant-upload-drag').hasClass('ant-upload-drag-hover')).toBe(true); + }); +}); diff --git a/components/upload/__tests__/upload.test.js b/components/upload/__tests__/upload.test.js index 483df22595..e225c52dc9 100644 --- a/components/upload/__tests__/upload.test.js +++ b/components/upload/__tests__/upload.test.js @@ -10,7 +10,6 @@ import mountTest from '../../../tests/shared/mountTest'; describe('Upload', () => { mountTest(Upload); - mountTest(Upload.Dragger); beforeEach(() => setup()); afterEach(() => teardown()); @@ -62,6 +61,61 @@ describe('Upload', () => { }); }); + it('should update progress in IE', done => { + const originSetInterval = window.setInterval; + process.env.TEST_IE = true; + Object.defineProperty(window, 'setInterval', { + value: fn => fn(), + }); + const props = { + action: 'http://upload.com', + onChange: ({ file }) => { + if (file.status !== 'uploading') { + process.env.TEST_IE = undefined; + Object.defineProperty(window, 'setInterval', { + value: originSetInterval, + }); + done(); + } + }, + }; + + const wrapper = mount( + + + , + ); + wrapper.find('input').simulate('change', { + target: { + files: [{ file: 'foo.png' }], + }, + }); + }); + + it('beforeUpload can be falsy', done => { + const props = { + action: 'http://upload.com', + beforeUpload: false, + onChange: ({ file }) => { + if (file.status !== 'uploading') { + done(); + } + }, + }; + + const wrapper = mount( + + + , + ); + + wrapper.find('input').simulate('change', { + target: { + files: [{ file: 'foo.png' }], + }, + }); + }); + it('upload promise return file in beforeUpload', done => { const data = jest.fn(); const props = { diff --git a/components/upload/__tests__/uploadlist.test.js b/components/upload/__tests__/uploadlist.test.js index 0f0b73c968..a6c3764403 100644 --- a/components/upload/__tests__/uploadlist.test.js +++ b/components/upload/__tests__/uploadlist.test.js @@ -366,6 +366,37 @@ describe('Upload List', () => { expect(wrapper.render()).toMatchSnapshot(); }); + it('should support showRemoveIcon and showPreviewIcon', () => { + const list = [ + { + name: 'image', + status: 'uploading', + uid: '-4', + url: 'https://cdn.xxx.com/aaa', + }, + { + name: 'image', + status: 'done', + uid: '-5', + url: 'https://cdn.xxx.com/aaa', + }, + ]; + + const wrapper = mount( + + + , + ); + expect(wrapper.render()).toMatchSnapshot(); + }); + // https://github.com/ant-design/ant-design/issues/7762 it('work with form validation', () => { let errors; diff --git a/components/upload/utils.tsx b/components/upload/utils.tsx index 479dc555e1..fda980c966 100644 --- a/components/upload/utils.tsx +++ b/components/upload/utils.tsx @@ -58,16 +58,15 @@ export function removeFileItem(file: UploadFile, fileList: UploadFile[]) { } // ==================== Default Image Preview ==================== -const extname = (url: string) => { - if (!url) { - return ''; - } +const extname = (url: string = '') => { const temp = url.split('/'); const filename = temp[temp.length - 1]; const filenameWithoutSuffix = filename.split(/#|\?/)[0]; return (/\.[^./\\]*$/.exec(filenameWithoutSuffix) || [''])[0]; }; + const isImageFileType = (type: string): boolean => !!type && type.indexOf('image/') === 0; + export const isImageUrl = (file: UploadFile): boolean => { if (isImageFileType(file.type)) { return true; From e07bba91fafe21776b50f0ca30aaf5c865f90519 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: Sun, 29 Sep 2019 04:56:56 -0500 Subject: [PATCH 02/14] chore: replace resizeObserver with `rc-resize-observer` (#19057) * replace resizeObserver with rc-resize-observer * fix affix lint * fix es lint --- components/_util/__tests__/util.test.js | 45 --------- components/_util/resizeObserver.tsx | 91 ------------------- components/affix/__tests__/Affix.test.js | 2 +- components/affix/index.tsx | 3 +- components/input/TextArea.tsx | 2 +- .../__snapshots__/index.test.js.snap | 8 +- components/typography/Base.tsx | 2 +- package.json | 1 + 8 files changed, 10 insertions(+), 144 deletions(-) delete mode 100644 components/_util/resizeObserver.tsx diff --git a/components/_util/__tests__/util.test.js b/components/_util/__tests__/util.test.js index 2a86219337..039aa18efd 100644 --- a/components/_util/__tests__/util.test.js +++ b/components/_util/__tests__/util.test.js @@ -9,8 +9,6 @@ import triggerEvent from '../triggerEvent'; import Wave from '../wave'; import TransButton from '../transButton'; import openAnimation from '../openAnimation'; -import ResizeObserver from '../resizeObserver'; -import { spyElementPrototype } from '../../__tests__/util/domHook'; describe('Test utils function', () => { beforeAll(() => { @@ -226,47 +224,4 @@ describe('Test utils function', () => { expect(done).toHaveBeenCalled(); }); }); - - describe('ResizeObserver', () => { - let domMock; - - beforeAll(() => { - domMock = spyElementPrototype(HTMLDivElement, 'getBoundingClientRect', () => { - return { - width: 1128 + Math.random(), - height: 903 + Math.random(), - }; - }); - }); - - afterAll(() => { - domMock.mockRestore(); - }); - - it('should not trigger `onResize` if size shaking', () => { - const onResize = jest.fn(); - let divNode; - - const wrapper = mount( - -
{ - divNode = node; - }} - /> - , - ); - - // First trigger - wrapper.instance().onResize([{ target: divNode }]); - onResize.mockReset(); - - // Repeat trigger should not trigger outer `onResize` with shaking - for (let i = 0; i < 10; i += 1) { - wrapper.instance().onResize([{ target: divNode }]); - } - - expect(onResize).not.toHaveBeenCalled(); - }); - }); }); diff --git a/components/_util/resizeObserver.tsx b/components/_util/resizeObserver.tsx deleted file mode 100644 index 8efec93e18..0000000000 --- a/components/_util/resizeObserver.tsx +++ /dev/null @@ -1,91 +0,0 @@ -import * as React from 'react'; -import { findDOMNode } from 'react-dom'; -import ResizeObserver from 'resize-observer-polyfill'; - -type DomElement = Element | null; - -interface ResizeObserverProps { - children?: React.ReactNode; - disabled?: boolean; - onResize?: () => void; -} - -interface ResizeObserverState { - height: number; - width: number; -} - -class ReactResizeObserver extends React.Component { - resizeObserver: ResizeObserver | null = null; - - state = { - width: 0, - height: 0, - }; - - componentDidMount() { - this.onComponentUpdated(); - } - - componentDidUpdate() { - this.onComponentUpdated(); - } - - componentWillUnmount() { - this.destroyObserver(); - } - - onComponentUpdated() { - const { disabled } = this.props; - const element = findDOMNode(this) as DomElement; - if (!this.resizeObserver && !disabled && element) { - // Add resize observer - this.resizeObserver = new ResizeObserver(this.onResize); - this.resizeObserver.observe(element); - } else if (disabled) { - // Remove resize observer - this.destroyObserver(); - } - } - - onResize: ResizeObserverCallback = (entries: ResizeObserverEntry[]) => { - const { onResize } = this.props; - - const { target } = entries[0]; - - const { width, height } = target.getBoundingClientRect(); - - /** - * Resize observer trigger when content size changed. - * In most case we just care about element size, - * let's use `boundary` instead of `contentRect` here to avoid shaking. - */ - const fixedWidth = Math.floor(width); - const fixedHeight = Math.floor(height); - - if (this.state.width !== fixedWidth || this.state.height !== fixedHeight) { - this.setState({ - width: fixedWidth, - height: fixedHeight, - }); - - if (onResize) { - onResize(); - } - } - }; - - destroyObserver() { - if (this.resizeObserver) { - this.resizeObserver.disconnect(); - this.resizeObserver = null; - } - } - - render() { - const { children = null } = this.props; - return children; - } -} - -export default ReactResizeObserver; diff --git a/components/affix/__tests__/Affix.test.js b/components/affix/__tests__/Affix.test.js index f9531e81b8..2caa5f4348 100644 --- a/components/affix/__tests__/Affix.test.js +++ b/components/affix/__tests__/Affix.test.js @@ -182,7 +182,7 @@ describe('Affix Render', () => { // Mock trigger resize updateCalled.mockReset(); wrapper - .find('ReactResizeObserver') + .find('ResizeObserver') .at(index) .instance() .onResize([{ target: { getBoundingClientRect: () => ({ width: 99, height: 99 }) } }]); diff --git a/components/affix/index.tsx b/components/affix/index.tsx index e1b025a708..b974914a01 100644 --- a/components/affix/index.tsx +++ b/components/affix/index.tsx @@ -2,9 +2,9 @@ import * as React from 'react'; import { polyfill } from 'react-lifecycles-compat'; import classNames from 'classnames'; import omit from 'omit.js'; +import ResizeObserver from 'rc-resize-observer'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; import { throttleByAnimationFrameDecorator } from '../_util/throttleByAnimationFrame'; -import ResizeObserver from '../_util/resizeObserver'; import warning from '../_util/warning'; import { @@ -35,6 +35,7 @@ export interface AffixProps { target?: () => Window | HTMLElement | null; prefixCls?: string; className?: string; + children: React.ReactElement; } enum AffixStatus { diff --git a/components/input/TextArea.tsx b/components/input/TextArea.tsx index 2fe065f35f..830830e0fd 100644 --- a/components/input/TextArea.tsx +++ b/components/input/TextArea.tsx @@ -2,9 +2,9 @@ import * as React from 'react'; import omit from 'omit.js'; import classNames from 'classnames'; import { polyfill } from 'react-lifecycles-compat'; +import ResizeObserver from 'rc-resize-observer'; import calculateNodeHeight from './calculateNodeHeight'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; -import ResizeObserver from '../_util/resizeObserver'; import raf from '../_util/raf'; export interface AutoSizeType { diff --git a/components/input/__tests__/__snapshots__/index.test.js.snap b/components/input/__tests__/__snapshots__/index.test.js.snap index 9791dfe62a..c9bfa9f3dc 100644 --- a/components/input/__tests__/__snapshots__/index.test.js.snap +++ b/components/input/__tests__/__snapshots__/index.test.js.snap @@ -332,7 +332,7 @@ exports[`TextArea should support disabled 1`] = ` `; @@ -351,7 +351,7 @@ exports[`TextArea should support maxLength 1`] = ` `; diff --git a/components/typography/Base.tsx b/components/typography/Base.tsx index 91d88c36b3..e0ac416a82 100644 --- a/components/typography/Base.tsx +++ b/components/typography/Base.tsx @@ -4,11 +4,11 @@ import { polyfill } from 'react-lifecycles-compat'; import toArray from 'rc-util/lib/Children/toArray'; import copy from 'copy-to-clipboard'; import omit from 'omit.js'; +import ResizeObserver from 'rc-resize-observer'; import { withConfigConsumer, ConfigConsumerProps, configConsumerProps } from '../config-provider'; import LocaleReceiver from '../locale-provider/LocaleReceiver'; import warning from '../_util/warning'; import TransButton from '../_util/transButton'; -import ResizeObserver from '../_util/resizeObserver'; import raf from '../_util/raf'; import isStyleSupport from '../_util/styleChecker'; import Icon from '../icon'; diff --git a/package.json b/package.json index d766f714f6..3aae59ee4a 100644 --- a/package.json +++ b/package.json @@ -120,6 +120,7 @@ "rc-pagination": "~1.20.5", "rc-progress": "~2.5.0", "rc-rate": "~2.5.0", + "rc-resize-observer": "^0.1.0", "rc-select": "~9.2.0", "rc-slider": "~8.6.11", "rc-steps": "~3.5.0", From ba7ddfa046fd0766150f01f5ab971a52e23e27cd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=95=B8=E7=94=9F?= Date: Sun, 29 Sep 2019 20:02:02 +0800 Subject: [PATCH 03/14] changelog (#19056) --- CHANGELOG.en-US.md | 14 ++++++++++++++ CHANGELOG.zh-CN.md | 14 ++++++++++++++ 2 files changed, 28 insertions(+) diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md index 40ecb5aaed..055ed7cdd9 100644 --- a/CHANGELOG.en-US.md +++ b/CHANGELOG.en-US.md @@ -15,6 +15,20 @@ timeline: true --- +## 3.23.5 + +`2019-09-29` + +- 🐞 Fix Upload preview image cannot fill the picture card box. [#18990](https://github.com/ant-design/ant-design/pull/18990) +- 🐞 Fix Breadcrumb not support `data-*` and `aria-*` attributes. [#18941](https://github.com/ant-design/ant-design/pull/18941) [@sosohime](https://github.com/sosohime) +- 🐞 Fix TreeSelect `removeIcon` and `clearIcon` not working. [#18949](https://github.com/ant-design/ant-design/issues/18949) [@sosohime](https://github.com/sosohime) +- 🐞 Fix Tree `switcherIcon` prop not working when `showLine` is true. [#18829](https://github.com/ant-design/ant-design/pull/18829) [@MrHeer](https://github.com/MrHeer) +- 🐞 Fix style bug of Button with icon only when in Button.Group. [#18994](https://github.com/ant-design/ant-design/pull/18994) +- 🐞 Remove Select useless prop `searchValue` which is a total misunderstanding. [#19003](https://github.com/ant-design/ant-design/pull/19003) +- 🐞 Fix Avatar string blink when ssr render at first time. [#19029](https://github.com/ant-design/ant-design/pull/19029) +- TypeScript + - 🐞 Fix Grid type definition. [#18946](https://github.com/ant-design/ant-design/pull/18946) [@handycode](https://github.com/handycode) + ## 3.23.4 `2019-09-21` diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md index 6688a2607b..a69b953059 100644 --- a/CHANGELOG.zh-CN.md +++ b/CHANGELOG.zh-CN.md @@ -15,6 +15,20 @@ timeline: true --- +## 3.23.5 + +`2019-09-29` + +- 🐞 修复 Upload 预览图片无法填充满图片框的问题。[#18990](https://github.com/ant-design/ant-design/pull/18990) +- 🐞 修复 Breadcrumb 不支持 `data-*` 和 `aria-*` 的问题。[#18941](https://github.com/ant-design/ant-design/pull/18941) [@sosohime](https://github.com/sosohime) +- 🐞 修复 TreeSelect `removeIcon` 和 `clearIcon` 不工作的问题。[#18949](https://github.com/ant-design/ant-design/issues/18949) [@sosohime](https://github.com/sosohime) +- 🐞 修复 Tree 组件当 `showLine` 设置后 `switcherIcon` 没有正常工作的问题。[#18829](https://github.com/ant-design/ant-design/pull/18829) [@MrHeer](https://github.com/MrHeer) +- 🐞 修复按钮图标在 Button.Group 中的错位问题。[#18994](https://github.com/ant-design/ant-design/pull/18994) +- 🐞 移除 Select 中无效属性 `searchValue` 的定义及文档。[#19003](https://github.com/ant-design/ant-design/pull/19003) +- 🐞 修复 Avatar 文本头像在 ssr 时会闪烁的问题。[#19029](https://github.com/ant-design/ant-design/pull/19029) +- TypeScript + - 🐞 修复 Grid 组件的类型定义。[#18946](https://github.com/ant-design/ant-design/pull/18946) [@handycode](https://github.com/handycode) + ## 3.23.4 `2019-09-21` From e3273bb54e9eb61c36ab1037792029aeddd640f5 Mon Sep 17 00:00:00 2001 From: ikobe Date: Sun, 29 Sep 2019 20:10:56 +0800 Subject: [PATCH 04/14] Release 3.23.5 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 3aae59ee4a..c9abfdd18b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "antd", - "version": "3.23.4", + "version": "3.23.5", "description": "An enterprise-class UI design language and React components implementation", "keywords": [ "ant", From 3d378f2fd89a63caea7423d20b0f569ffc3c47a0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=AA=97=E4=BD=A0=E6=98=AF=E5=B0=8F=E7=8C=AB=E5=92=AA?= Date: Mon, 30 Sep 2019 19:37:42 +0800 Subject: [PATCH 05/14] fix: Typography funtion compoent use Ref console log warning (#19066) --- components/typography/Typography.tsx | 55 +++++++++++++++------------- 1 file changed, 29 insertions(+), 26 deletions(-) diff --git a/components/typography/Typography.tsx b/components/typography/Typography.tsx index 6e476cd570..599063225b 100644 --- a/components/typography/Typography.tsx +++ b/components/typography/Typography.tsx @@ -16,32 +16,35 @@ interface InternalTypographyProps extends TypographyProps { setContentRef?: (node: HTMLElement) => void; } -const Typography: React.SFC = ({ - prefixCls: customizePrefixCls, - component = 'article', - className, - 'aria-label': ariaLabel, - setContentRef, - children, - ...restProps -}) => ( - - {({ getPrefixCls }: ConfigConsumerProps) => { - const Component = component as any; - const prefixCls = getPrefixCls('typography', customizePrefixCls); +class Typography extends React.Component { + renderTypography = ({ getPrefixCls }: ConfigConsumerProps) => { + const { + prefixCls: customizePrefixCls, + component = 'article', + className, + 'aria-label': ariaLabel, + setContentRef, + children, + ...restProps + } = this.props; + const Component = component as any; + const prefixCls = getPrefixCls('typography', customizePrefixCls); - return ( - - {children} - - ); - }} - -); + return ( + + {children} + + ); + }; + + render() { + return {this.renderTypography}; + } +} export default Typography; From 4680ddc009b1ecbc1bfe70594508301dd8888846 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: Tue, 1 Oct 2019 01:06:09 -0500 Subject: [PATCH 06/14] fix: Typography warning for `ref` error (#19074) * Revert "fix: Typography funtion compoent use Ref console log warning (#19066)" This reverts commit 3d378f2fd89a63caea7423d20b0f569ffc3c47a0. * fix: Typography warning for ref * not crash on react 15 * still use class if react15 * fix ts define * clean up * react 15 lock ref obj * Use rc-util findDOMNode instead --- components/_util/ref.ts | 17 ++++ components/typography/Base.tsx | 5 +- components/typography/Typography.tsx | 88 +++++++++++++------ components/typography/__tests__/index.test.js | 17 +++- 4 files changed, 95 insertions(+), 32 deletions(-) create mode 100644 components/_util/ref.ts diff --git a/components/_util/ref.ts b/components/_util/ref.ts new file mode 100644 index 0000000000..6221eb1041 --- /dev/null +++ b/components/_util/ref.ts @@ -0,0 +1,17 @@ +import React from 'react'; + +export function fillRef(ref: React.Ref, node: T) { + if (typeof ref === 'function') { + ref(node); + } else if (typeof ref === 'object' && ref && 'current' in ref) { + (ref as any).current = node; + } +} + +export function composeRef(...refs: React.Ref[]): React.Ref { + return (node: T) => { + refs.forEach(ref => { + fillRef(ref, node); + }); + }; +} diff --git a/components/typography/Base.tsx b/components/typography/Base.tsx index e0ac416a82..df5715d8f6 100644 --- a/components/typography/Base.tsx +++ b/components/typography/Base.tsx @@ -2,6 +2,7 @@ import * as React from 'react'; import classNames from 'classnames'; import { polyfill } from 'react-lifecycles-compat'; import toArray from 'rc-util/lib/Children/toArray'; +import findDOMNode from 'rc-util/lib/Dom/findDOMNode'; import copy from 'copy-to-clipboard'; import omit from 'omit.js'; import ResizeObserver from 'rc-resize-observer'; @@ -297,7 +298,7 @@ class Base extends React.Component diff --git a/components/typography/Typography.tsx b/components/typography/Typography.tsx index 599063225b..bc914de8b9 100644 --- a/components/typography/Typography.tsx +++ b/components/typography/Typography.tsx @@ -1,6 +1,8 @@ import * as React from 'react'; import classNames from 'classnames'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; +import warning from '../_util/warning'; +import { composeRef } from '../_util/ref'; export interface TypographyProps { id?: string; @@ -13,38 +15,68 @@ export interface TypographyProps { interface InternalTypographyProps extends TypographyProps { component?: string; + /** @deprecated Use `ref` directly if using React 16 */ setContentRef?: (node: HTMLElement) => void; } -class Typography extends React.Component { - renderTypography = ({ getPrefixCls }: ConfigConsumerProps) => { - const { - prefixCls: customizePrefixCls, - component = 'article', - className, - 'aria-label': ariaLabel, - setContentRef, - children, - ...restProps - } = this.props; - const Component = component as any; - const prefixCls = getPrefixCls('typography', customizePrefixCls); +const Typography: React.RefForwardingComponent<{}, InternalTypographyProps> = ( + { + prefixCls: customizePrefixCls, + component = 'article', + className, + 'aria-label': ariaLabel, + setContentRef, + children, + ...restProps + }, + ref, +) => { + let mergedRef = ref; - return ( - - {children} - - ); - }; - - render() { - return {this.renderTypography}; + if (setContentRef) { + warning(false, 'Typography', '`setContentRef` is deprecated. Please use `ref` instead.'); + mergedRef = composeRef(ref, setContentRef); } + + return ( + + {({ getPrefixCls }: ConfigConsumerProps) => { + const Component = component as any; + const prefixCls = getPrefixCls('typography', customizePrefixCls); + + return ( + + {children} + + ); + }} + + ); +}; + +let RefTypography; + +if (React.forwardRef) { + RefTypography = React.forwardRef(Typography); + RefTypography.displayName = 'Typography'; +} else { + class TypographyWrapper extends React.Component { + state = {}; + + render() { + return ; + } + } + + RefTypography = TypographyWrapper; } -export default Typography; +// es default export should use const instead of let +const ExportTypography = (RefTypography as unknown) as React.FC; + +export default ExportTypography; diff --git a/components/typography/__tests__/index.test.js b/components/typography/__tests__/index.test.js index 0f83d33e62..40b06491fc 100644 --- a/components/typography/__tests__/index.test.js +++ b/components/typography/__tests__/index.test.js @@ -6,6 +6,7 @@ import Title from '../Title'; import Paragraph from '../Paragraph'; import Base from '../Base'; // eslint-disable-line import/no-named-as-default import mountTest from '../../../tests/shared/mountTest'; +import Typography from '../Typography'; jest.mock('copy-to-clipboard'); @@ -94,10 +95,13 @@ describe('Typography', () => { }); it('connect children', () => { + const bamboo = 'Bamboo'; + const is = ' is '; + const wrapper = mount( - {'Bamboo'} - {' is '} + {bamboo} + {is} Little Light , @@ -237,4 +241,13 @@ describe('Typography', () => { }); }); }); + + it('warning if use setContentRef', () => { + function refFunc() {} + mount(); + + expect(errorSpy).toHaveBeenCalledWith( + 'Warning: [antd: Typography] `setContentRef` is deprecated. Please use `ref` instead.', + ); + }); }); From 0a09b3b0085dc2715f6725602bcd04eacf1edb25 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BF=A1=E9=91=AB-King?= <45808948@qq.com> Date: Tue, 1 Oct 2019 16:22:19 +0800 Subject: [PATCH 07/14] tweak: site title unescape --- site/theme/static/template.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/theme/static/template.html b/site/theme/static/template.html index bde0cbc79f..cc6d549201 100644 --- a/site/theme/static/template.html +++ b/site/theme/static/template.html @@ -4,7 +4,7 @@ - {% if title %}{{ title }}{% else %}{% endif %} + {% if title %}{{ title | safe }}{% else %}{% endif %} {% if meta %}{{ meta | safe }}{% endif %} Date: Thu, 3 Oct 2019 07:20:13 +0000 Subject: [PATCH 08/14] chore(deps-dev): bump logrocket-react from 3.0.1 to 4.0.0 Bumps [logrocket-react](https://github.com/LogRocket/logrocket-react) from 3.0.1 to 4.0.0. - [Release notes](https://github.com/LogRocket/logrocket-react/releases) - [Changelog](https://github.com/LogRocket/logrocket-react/blob/master/CHANGELOG.md) - [Commits](https://github.com/LogRocket/logrocket-react/compare/beta-3.0.1...v4.0.0) Signed-off-by: dependabot-preview[bot] --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index c9abfdd18b..2495af6943 100644 --- a/package.json +++ b/package.json @@ -196,7 +196,7 @@ "jsdom": "^15.1.1", "jsonml.js": "^0.1.0", "logrocket": "^1.0.0", - "logrocket-react": "^3.0.0", + "logrocket-react": "^4.0.0", "lz-string": "^1.4.4", "mockdate": "^2.0.2", "node-fetch": "^2.6.0", From 47dee4c7d756a088ea18cab170add4e4d56dddc7 Mon Sep 17 00:00:00 2001 From: afc163 Date: Sat, 5 Oct 2019 17:35:49 +0800 Subject: [PATCH 09/14] :white_check_mark: fix eslint problems --- .eslintrc.js | 1 + components/button/__tests__/index.test.js | 1 + components/collapse/demo/extra.md | 2 +- components/drawer/demo/user-profile.md | 2 +- components/form/__tests__/message.test.js | 1 + components/result/demo/error.md | 2 +- components/select/demo/option-label-prop.md | 14 ++++++++++---- components/table/Table.tsx | 1 + components/typography/demo/basic.md | 4 ++-- components/typography/demo/ellipsis-debug.md | 14 +++----------- components/typography/demo/paragraph-debug.md | 4 ++-- site/theme/template/Layout/Footer.jsx | 4 +++- 12 files changed, 27 insertions(+), 23 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 46a4bfffb2..487c2881d2 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -70,6 +70,7 @@ const eslintrc = { 'import/no-cycle': 0, 'react/no-find-dom-node': 0, 'no-underscore-dangle': 0, + 'react/sort-comp': 0, // label-has-for has been deprecated // https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/label-has-for.md 'jsx-a11y/label-has-for': 0, diff --git a/components/button/__tests__/index.test.js b/components/button/__tests__/index.test.js index a5ef8080c2..8e3b270777 100644 --- a/components/button/__tests__/index.test.js +++ b/components/button/__tests__/index.test.js @@ -206,6 +206,7 @@ describe('Button', () => { it('should merge text if children using variable', () => { const wrapper = mount( , ); diff --git a/components/collapse/demo/extra.md b/components/collapse/demo/extra.md index 0c79f8f413..770bc11588 100644 --- a/components/collapse/demo/extra.md +++ b/components/collapse/demo/extra.md @@ -68,7 +68,7 @@ class Demo extends React.Component {
- Expand Icon Position:{' '} + Expand Icon Position: - - -
-
-
-
- - - image - - - image - - -
-
-
-
-
- - - image - - image + + + + + + +