Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make React.forwardRef() components discoverable by TestRenderer traversal #12725

Merged
merged 1 commit into from
May 1, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion packages/react-test-renderer/src/ReactTestRenderer.js
Original file line number Diff line number Diff line change
Expand Up @@ -411,6 +411,7 @@ const validWrapperTypes = new Set([
FunctionalComponent,
ClassComponent,
HostComponent,
ForwardRef,
]);

class ReactTestInstance {
Expand Down Expand Up @@ -475,6 +476,7 @@ class ReactTestInstance {
case FunctionalComponent:
case ClassComponent:
case HostComponent:
case ForwardRef:
children.push(wrapFiber(node));
break;
case HostText:
Expand All @@ -484,7 +486,6 @@ class ReactTestInstance {
case ContextProvider:
case ContextConsumer:
case Mode:
case ForwardRef:
descend = true;
break;
default:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ describe('ReactTestRendererTraversal', () => {
<View void="void" />
<View void="void" />
</ExampleNull>
<ExampleForwardRef qux="qux" />
</View>
</View>
);
Expand All @@ -48,13 +49,17 @@ describe('ReactTestRendererTraversal', () => {
const ExampleFn = props => <View baz="baz" />;
const ExampleNull = props => null;

const ExampleForwardRef = React.forwardRef((props, ref) => (
<View {...props} ref={ref} />
));

it('initializes', () => {
const render = ReactTestRenderer.create(<Example />);
const hasFooProp = node => node.props.hasOwnProperty('foo');

// assert .props, .type and .parent attributes
const foo = render.root.find(hasFooProp);
expect(foo.props.children).toHaveLength(7);
expect(foo.props.children).toHaveLength(8);
expect(foo.type).toBe(View);
expect(render.root.parent).toBe(null);
expect(foo.children[0].parent).toBe(foo);
Expand Down Expand Up @@ -116,14 +121,16 @@ describe('ReactTestRendererTraversal', () => {

expect(() => render.root.findByType(ExampleFn)).not.toThrow(); // 1 match
expect(() => render.root.findByType(View)).not.toThrow(); // 1 match
expect(() => render.root.findByType(ExampleForwardRef)).not.toThrow(); // 1 match
// note: there are clearly multiple <View /> in general, but there
// is only one being rendered at root node level
expect(() => render.root.findByType(ExampleNull)).toThrow(); // 2 matches

expect(render.root.findAllByType(ExampleFn)).toHaveLength(1);
expect(render.root.findAllByType(View, {deep: false})).toHaveLength(1);
expect(render.root.findAllByType(View)).toHaveLength(7);
expect(render.root.findAllByType(View)).toHaveLength(8);
expect(render.root.findAllByType(ExampleNull)).toHaveLength(2);
expect(render.root.findAllByType(ExampleForwardRef)).toHaveLength(1);

const nulls = render.root.findAllByType(ExampleNull);
expect(nulls[0].findAllByType(View)).toHaveLength(0);
Expand All @@ -138,17 +145,21 @@ describe('ReactTestRendererTraversal', () => {
const foo = 'foo';
const bar = 'bar';
const baz = 'baz';
const qux = 'qux';

expect(() => render.root.findByProps({foo})).not.toThrow(); // 1 match
expect(() => render.root.findByProps({bar})).toThrow(); // >1 matches
expect(() => render.root.findByProps({baz})).toThrow(); // >1 matches
expect(() => render.root.findByProps({qux})).not.toThrow(); // 1 match

expect(render.root.findAllByProps({foo}, {deep: false})).toHaveLength(1);
expect(render.root.findAllByProps({bar}, {deep: false})).toHaveLength(5);
expect(render.root.findAllByProps({baz}, {deep: false})).toHaveLength(2);
expect(render.root.findAllByProps({qux}, {deep: false})).toHaveLength(1);

expect(render.root.findAllByProps({foo})).toHaveLength(2);
expect(render.root.findAllByProps({bar})).toHaveLength(9);
expect(render.root.findAllByProps({baz})).toHaveLength(4);
expect(render.root.findAllByProps({qux})).toHaveLength(3);
});
});