mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-07 09:26:06 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

fix(popover): fix the problem that popover display when the props'content is empty (#33835)

Browse Source 
* fix(popover): fix the problem that popover display when the props'content is empty

* refactor(popover): 更新代码判断逻辑

* test(popover): 添加popover的test

* feat(popover): 更新snapshot

* feat(popover): 更新剩余的snapshot
This commit is contained in:
Dawnlck 2022-02-07 15:28:46 +08:00 committed by GitHub
parent 1176454437
commit 17d6a5e407
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 31 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
components/config-provider/__tests__/__snapshots__/components.test.js.snap
View File

@ -18555,11 +18555,7 @@ exports[`ConfigProvider components Popover configProvider 1`] = `
<div
class="config-popover-inner"
role="tooltip"
>
<div
class="config-popover-inner-content"
/>
</div>
/>
</div>
</div>
</div>
@ -18591,11 +18587,7 @@ exports[`ConfigProvider components Popover configProvider componentSize large 1`
<div
class="config-popover-inner"
role="tooltip"
>
<div
class="config-popover-inner-content"
/>
</div>
/>
</div>
</div>
</div>
@ -18627,11 +18619,7 @@ exports[`ConfigProvider components Popover configProvider componentSize middle 1
<div
class="config-popover-inner"
role="tooltip"
>
<div
class="config-popover-inner-content"
/>
</div>
/>
</div>
</div>
</div>
@ -18663,11 +18651,7 @@ exports[`ConfigProvider components Popover configProvider virtual and dropdownMa
<div
class="ant-popover-inner"
role="tooltip"
>
<div
class="ant-popover-inner-content"
/>
</div>
/>
</div>
</div>
</div>
@ -18699,11 +18683,7 @@ exports[`ConfigProvider components Popover normal 1`] = `
<div
class="ant-popover-inner"
role="tooltip"
>
<div
class="ant-popover-inner-content"
/>
</div>
/>
</div>
</div>
</div>
@ -18735,11 +18715,7 @@ exports[`ConfigProvider components Popover prefixCls 1`] = `
<div
class="prefix-Popover-inner"
role="tooltip"
>
<div
class="prefix-Popover-inner-content"
/>
</div>
/>
</div>
</div>
</div>

2
components/popover/__tests__/__snapshots__/index.test.js.snap
View File

@ -1,7 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Popover handles empty title/content props safely 1`] = `"<div class=\\"ant-popover-content\\"><div class=\\"ant-popover-arrow\\"><span class=\\"ant-popover-arrow-content\\"></span></div><div class=\\"ant-popover-inner\\" role=\\"tooltip\\"><div class=\\"ant-popover-inner-content\\"></div></div></div>"`;
exports[`Popover should be rendered correctly in RTL direction 1`] = `
Array [
<span

18
components/popover/__tests__/index.test.js
View File

@ -54,8 +54,22 @@ describe('Popover', () => {
popover.find('span').simulate('click');
const popup = ref.current.getPopupDomNode();
expect(popup).not.toBe(null);
expect(popup.innerHTML).toMatchSnapshot();
expect(popup).toBe(null);
});
it('should not render popover when the title & content props is empty', () => {
const ref = React.createRef();
const popover = mount(
<Popover trigger="click" ref={ref} content="">
<span>show me your code</span>
</Popover>,
);
popover.find('span').simulate('click');
const popup = ref.current.getPopupDomNode();
expect(popup).toBe(null);
});
it('props#overlay do not warn anymore', () => {

15
components/popover/index.tsx
View File

@ -13,12 +13,15 @@ const Popover = React.forwardRef<unknown, PopoverProps>(
({ prefixCls: customizePrefixCls, title, content, ...otherProps }, ref) => {
const { getPrefixCls } = React.useContext(ConfigContext);
const getOverlay = (prefixCls: string) => (
<>
{title && <div className={`${prefixCls}-title`}>{getRenderPropValue(title)}</div>}
<div className={`${prefixCls}-inner-content`}>{getRenderPropValue(content)}</div>
</>
);
const getOverlay = (prefixCls: string) => {
if (!title && !content) return undefined;
return (
<>
{title && <div className={`${prefixCls}-title`}>{getRenderPropValue(title)}</div>}
<div className={`${prefixCls}-inner-content`}>{getRenderPropValue(content)}</div>
</>
);
};
const prefixCls = getPrefixCls('popover', customizePrefixCls);
const rootPrefixCls = getPrefixCls();