Skip to content

Commit 416309b

Browse files
afc163zombieJ
andauthored
fix: ref could be passed as a prop in 19.x (#623)
* fix: ref could be passed as a prop in 19.x close ant-design/ant-design#52282 * Update ref.ts * test: add test case --------- Co-authored-by: 二货机器人 <[email protected]>
1 parent 6c00fea commit 416309b

File tree

2 files changed

+21
-6
lines changed

2 files changed

+21
-6
lines changed

src/ref.ts

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import type * as React from 'react';
2-
import { isValidElement } from 'react';
2+
import { isValidElement, version } from 'react';
33
import { ForwardRef, isMemo } from 'react-is';
44
import useMemo from './hooks/useMemo';
55
import isFragment from './React/isFragment';
66

7+
const ReactMajorVersion = Number(version.split('.')[0]);
8+
79
export const fillRef = <T>(ref: React.Ref<T>, node: T) => {
810
if (typeof ref === 'function') {
911
ref(node);
@@ -43,10 +45,7 @@ export const supportRef = (nodeOrComponent: any): boolean => {
4345
}
4446

4547
// React 19 no need `forwardRef` anymore. So just pass if is a React element.
46-
if (
47-
isReactElement(nodeOrComponent) &&
48-
(nodeOrComponent as any).props.propertyIsEnumerable('ref')
49-
) {
48+
if (isReactElement(nodeOrComponent) && ReactMajorVersion >= 19) {
5049
return true;
5150
}
5251

tests/ref-19.test.tsx

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/* eslint-disable no-eval */
22
import React from 'react';
3-
import { getNodeRef, useComposeRef } from '../src/ref';
3+
import { getNodeRef, useComposeRef, supportRef } from '../src/ref';
44
import { render } from '@testing-library/react';
55

66
jest.mock('react', () => {
@@ -76,4 +76,20 @@ describe('ref: React 19', () => {
7676
expect(outerRef.current?.className).toBe('bamboo');
7777
expect(container.querySelector('.test-output')?.textContent).toBe('bamboo');
7878
});
79+
80+
it('supportRef with not provide ref', () => {
81+
const Empty = () => <div />;
82+
83+
const Checker = ({ children }: { children: React.ReactElement }) => {
84+
return <p>{String(supportRef(children))}</p>;
85+
};
86+
87+
const { container } = render(
88+
<Checker>
89+
<Empty />
90+
</Checker>,
91+
);
92+
93+
expect(container.querySelector('p')?.textContent).toBe('true');
94+
});
7995
});

0 commit comments

Comments
 (0)