Skip to content

Commit

Permalink
chore: clean code
Browse files Browse the repository at this point in the history
  • Loading branch information
aojunhao123 committed Jan 2, 2025
1 parent dbe400e commit 4b09132
Show file tree
Hide file tree
Showing 2 changed files with 2 additions and 125 deletions.
35 changes: 2 additions & 33 deletions src/Popup.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,53 +11,22 @@ export interface ContentProps {
bodyClassName?: string;
}

const getTextContent = (node: (() => React.ReactNode) | React.ReactNode): string => {
if (!node) {
return '';
}

const resolvedNode = typeof node === 'function' ? node() : node;

if (typeof resolvedNode === 'string' || typeof resolvedNode === 'number') {
return String(resolvedNode);
}

if (Array.isArray(resolvedNode)) {
return resolvedNode.map(getTextContent).join(' ');
}

if (React.isValidElement(resolvedNode)) {
return getTextContent(resolvedNode.props.children);
}

return '';
};

export default function Popup(props: ContentProps) {
const { children, prefixCls, id, overlayInnerStyle: innerStyle, bodyClassName, className, style } =
props;

const tooltipText = getTextContent(children);

return (
<>
<div className={classNames(`${prefixCls}-content`, className)} style={style}>
<div
id={id}
role="tooltip"
className={classNames(`${prefixCls}-inner`, bodyClassName)}
style={innerStyle}
>
{typeof children === 'function' ? children() : children}
</div>
</div>
{tooltipText && (
<div
id={id}
role="tooltip"
style={{ width: 0, height: 0, position: 'absolute', overflow: 'hidden', opacity: 0 }}
>
{tooltipText}
</div>
)}
</>
);
}
92 changes: 0 additions & 92 deletions tests/popup.test.tsx
Original file line number Diff line number Diff line change
@@ -1,100 +1,8 @@
import React from 'react';
import { render } from '@testing-library/react';
import Popup from '../src/Popup';

describe('Popup', () => {
// Used in antd for C2D2C
it('should export', () => {
expect(Popup).toBeTruthy();
});

it('should correctly extract text from string, number, function, and element', () => {
const { getByRole } = render(
<Popup prefixCls="test" id="popup-id">
{() => (
<>
{'Hello'}
{123}
<span>World</span>
</>
)}
</Popup>,
);

const tooltip = getByRole('tooltip');
const hiddenTextContainer = tooltip.querySelector('div > div');

expect(hiddenTextContainer.textContent).toBe('Hello 123 World');
});

it('should apply updated hidden text styles correctly', () => {
const { getByRole } = render(
<Popup prefixCls="test" id="popup-id">
test hidden text
</Popup>,
);

const tooltip = getByRole('tooltip');
const hiddenTextContainer = tooltip.querySelector('div > div');

expect(hiddenTextContainer).toHaveStyle({
width: '0',
height: '0',
position: 'absolute',
overflow: 'hidden',
opacity: '0',
});
});

it('should return empty string if children is null or undefined', () => {
const { getByRole } = render(
<Popup prefixCls="test" id="popup-empty">
{null}
</Popup>,
);
const tooltip = getByRole('tooltip');

expect(tooltip.querySelector('div > div')).toBeNull();
});

it('should handle nested arrays correctly', () => {
const { getByRole } = render(
<Popup prefixCls="test" id="popup-nested">
{[
'First',
['Second', 'Third'],
<span key="fourth">Fourth</span>,
]}
</Popup>,
);
const tooltip = getByRole('tooltip');
const hiddenTextContainer = tooltip.querySelector('div > div');

// "First Second Third Fourth"
expect(hiddenTextContainer.textContent).toBe('First Second Third Fourth');
});

it('should handle function returning an array', () => {
const { getByRole } = render(
<Popup prefixCls="test" id="popup-func-array">
{() => ['Alpha', <span key="beta">Beta</span>]}
</Popup>,
);
const tooltip = getByRole('tooltip');
const hiddenTextContainer = tooltip.querySelector('div > div');

// "Alpha Beta"
expect(hiddenTextContainer.textContent).toBe('Alpha Beta');
});

it('should handle function returning undefined', () => {
const { getByRole } = render(
<Popup prefixCls="test" id="popup-func-undefined">
{() => undefined}
</Popup>,
);
const tooltip = getByRole('tooltip');

expect(tooltip.querySelector('div > div')).toBeNull();
});
});

0 comments on commit 4b09132

Please sign in to comment.