Skip to content

Commit 2d2edbb

Browse files
authored
fix: set aria-describedby when overlay is a false but valid node (#544)
* fix: set aria-describedby when overlay is a falsy but valid node overlay values like 0 are valid renderable content, but the previous `overlay && open` check treated them as absent and skipped aria-describedby even while the tooltip was visible. * feat: add new tests
1 parent a43ecc7 commit 2d2edbb

2 files changed

Lines changed: 30 additions & 1 deletion

File tree

‎src/Tooltip.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,7 @@ const Tooltip = React.forwardRef<TooltipRef, TooltipProps>((props, ref) => {
121121
const getChildren: TriggerProps['children'] = ({ open }) => {
122122
const child = React.Children.only(children);
123123
const childAriaDescribedBy = (child.props as React.AriaAttributes)['aria-describedby'];
124-
const ariaDescribedBy = [childAriaDescribedBy, overlay && open ? mergedId : undefined]
124+
const ariaDescribedBy = [childAriaDescribedBy, overlay != null && open ? mergedId : undefined]
125125
.filter(Boolean)
126126
.join(' ');
127127
const ariaProps: React.AriaAttributes = {

‎tests/index.test.tsx‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -597,6 +597,35 @@ describe('rc-tooltip', () => {
597597
expect(trigger).toHaveAttribute('aria-describedby', 'existing-description');
598598
});
599599

600+
it('should set aria-describedby when overlay is a falsy but valid node like 0', () => {
601+
const { container } = render(
602+
<Tooltip overlay={0} visible>
603+
<button>Click me</button>
604+
</Tooltip>,
605+
);
606+
607+
const trigger = container.querySelector('button');
608+
const describedBy = trigger.getAttribute('aria-describedby');
609+
expect(describedBy).toBeTruthy();
610+
expect(document.getElementById(describedBy)).toHaveTextContent('0');
611+
});
612+
613+
it('should not set aria-describedby when overlay is null or undefined', () => {
614+
const { container: nullContainer } = render(
615+
<Tooltip overlay={null} visible>
616+
<button>Click me</button>
617+
</Tooltip>,
618+
);
619+
expect(nullContainer.querySelector('button')).not.toHaveAttribute('aria-describedby');
620+
621+
const { container: undefinedContainer } = render(
622+
<Tooltip overlay={undefined} visible>
623+
<button>Click me</button>
624+
</Tooltip>,
625+
);
626+
expect(undefinedContainer.querySelector('button')).not.toHaveAttribute('aria-describedby');
627+
});
628+
600629
it('should preserve original props of children', () => {
601630
const onMouseEnter = jest.fn();
602631

0 commit comments

Comments
 (0)