diff --git a/packages/react/src/forwardRef.tsx b/packages/react/src/forwardRef.tsx index 4aa32471..713c0970 100644 --- a/packages/react/src/forwardRef.tsx +++ b/packages/react/src/forwardRef.tsx @@ -63,8 +63,8 @@ export function forwardRef< Props extends Record = Record, >( component: ForwardRefRenderFunction< - unknown, - AssignCommon, Props> & { + never, + AssignCommon, Props> & { as?: ElementType } >, diff --git a/packages/react/test/forward-ref.test.tsx b/packages/react/test/forward-ref.test.tsx new file mode 100644 index 00000000..27cb2923 --- /dev/null +++ b/packages/react/test/forward-ref.test.tsx @@ -0,0 +1,30 @@ +import { createRef } from 'react' +import type { HTMLPolymorphicProps } from '../src' +import { polymorphicFactory, forwardRef } from '../src' +import { render } from '@testing-library/react' + +describe('forwardRef', () => { + const poly = polymorphicFactory() + + it('should forward the ref', () => { + const ComponentUnderTest = forwardRef<'div', HTMLPolymorphicProps<'div'>>((props, ref) => ( + + )) + + const ref = createRef() + render() + expect(ref.current).toBeInstanceOf(HTMLDivElement) + }) + + it('should forward the ref with as prop', () => { + const ComponentUnderTest = forwardRef<'div', HTMLPolymorphicProps<'div'>>((props, ref) => ( + + )) + + // known issue: with the `as` prop refs are not inherited correctly + // workaround: + const ref = createRef() + render() + expect(ref.current).toBeInstanceOf(HTMLFormElement) + }) +})