mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-01-18 14:13:37 +08:00
Code Issues Actions 28 Packages Projects Releases Wiki Activity

fix: Typography copyable tooltips (#26259)

Browse Source 
* fix: Typography copyable tooltips cannot accept empty string

https://github.com/ant-design/ant-design/pull/25953#issuecomment-674480396

* fix snapshot change
This commit is contained in:
偏右 2020-08-18 16:14:14 +08:00 committed by GitHub
parent e17e82f549
commit abf95437f1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/typography/Base.tsx
View File

@ -391,9 +391,11 @@ class Base extends React.Component<InternalBlockProps, BaseState> {
const prefixCls = this.getPrefixCls();
const { tooltips } = copyable as CopyConfig;
const tooltipNodes = toArray(tooltips);
const title = copied ? tooltipNodes[1] || this.copiedStr : tooltipNodes[0] || this.copyStr;
let tooltipNodes = toArray(tooltips) as React.ReactNode[];
if (tooltipNodes.length === 0) {
tooltipNodes = [this.copyStr, this.copiedStr];
}
const title = copied ? tooltipNodes[1] : tooltipNodes[0];
const ariaLabel = typeof title === 'string' ? title : '';
const icons = toArray((copyable as CopyConfig).icon);

34
components/typography/__tests__/index.test.js
View File

@ -206,7 +206,7 @@ describe('Typography', () => {
describe('copyable', () => {
function copyTest(name, text, target, icon, tooltips) {
it(name, () => {
it(name, async () => {
jest.useFakeTimers();
const onCopy = jest.fn();
const wrapper = mount(
@ -229,13 +229,25 @@ describe('Typography', () => {
expect(wrapper.find('.ant-tooltip-inner').text()).toBe('Copy');
} else if (tooltips === false) {
expect(wrapper.find('.ant-tooltip-inner').length).toBeFalsy();
} else if (tooltips[0] === '' && tooltips[1] === '') {
expect(wrapper.find('.ant-tooltip-inner').length).toBeFalsy();
} else if (tooltips[0] === '' && tooltips[1]) {
expect(wrapper.find('.ant-tooltip-inner').length).toBeFalsy();
} else if (tooltips[1] === '' && tooltips[0]) {
expect(wrapper.find('.ant-tooltip-inner').text()).toBe(tooltips[0]);
} else {
expect(wrapper.find('.ant-tooltip-inner').text()).toBe(tooltips[0]);
}
wrapper.find('.ant-typography-copy').first().simulate('click');
expect(copy.lastStr).toEqual(target);
jest.useRealTimers();
wrapper.find('.ant-typography-copy').first().simulate('mouseenter');
// tooltips 为 ['', 'xxx'] 时，切换时需要延时 mousenEnterDelay 的时长
if (tooltips && tooltips[0] === '' && tooltips[1]) {
await sleep(150);
}
expect(copy.lastStr).toEqual(target);
wrapper.update();
expect(onCopy).toHaveBeenCalled();
@ -247,20 +259,29 @@ describe('Typography', () => {
}
expect(wrapper.find(copiedIcon).length).toBeTruthy();
wrapper.find('.ant-typography-copy').first().simulate('mouseenter');
if (tooltips === undefined || tooltips === true) {
expect(wrapper.find('.ant-tooltip-inner').text()).toBe('Copied');
} else if (tooltips === false) {
expect(wrapper.find('.ant-tooltip-inner').length).toBeFalsy();
} else if (tooltips[0] === '' && tooltips[1] === '') {
expect(wrapper.find('.ant-tooltip-inner').length).toBeFalsy();
} else if (tooltips[0] === '' && tooltips[1]) {
expect(wrapper.find('.ant-tooltip-inner').text()).toBe(tooltips[1]);
} else if (tooltips[1] === '' && tooltips[0]) {
expect(wrapper.find('.ant-tooltip-inner').text()).toBe('');
} else {
expect(wrapper.find('.ant-tooltip-inner').text()).toBe(tooltips[1]);
}
jest.useFakeTimers();
jest.runAllTimers();
wrapper.update();
// Will set back when 3 seconds pass
expect(wrapper.find(copiedIcon).length).toBeFalsy();
wrapper.unmount();
jest.useRealTimers();
});
}
@ -281,6 +302,15 @@ describe('Typography', () => {
'click here',
'you clicked!!',
]);
copyTest('tooltips contains two empty text', 'bamboo', 'bamboo', undefined, ['', '']);
copyTest('tooltips contains one empty text', 'bamboo', 'bamboo', undefined, [
'',
'you clicked!!',
]);
copyTest('tooltips contains one empty text 2', 'bamboo', 'bamboo', undefined, [
'click here',
'',
]);
});
describe('editable', () => {