Make React.forwardRef() components discoverable by TestRenderer traversal (#12725)
Dan Abramov committed
May 1, 2018 at 19:55 UTC
e0ca51a85d7c5b01c1efa7edb40080770d508cad
2 files changed
+15
-3
packages/react-test-renderer/src/ReactTestRenderer.js
+2
-1
@@ -411,6 +411,7 @@ const validWrapperTypes = new Set([
411
FunctionalComponent,
412
ClassComponent,
413
HostComponent,
414
+ ForwardRef,
415
]);
416
417
class ReactTestInstance {
@@ -475,6 +476,7 @@ class ReactTestInstance {
476
case FunctionalComponent:
477
case ClassComponent:
478
case HostComponent:
479
+ case ForwardRef:
480
children.push(wrapFiber(node));
481
break;
482
case HostText:
@@ -484,7 +486,6 @@ class ReactTestInstance {
486
case ContextProvider:
487
case ContextConsumer:
488
case Mode:
487
- case ForwardRef:
489
descend = true;
490
break;
491
default:
packages/react-test-renderer/src/__tests__/ReactTestRendererTraversal-test.js
+13
-2
@@ -37,6 +37,7 @@ describe('ReactTestRendererTraversal', () => {
37
<View void="void" />
38
<View void="void" />
39
</ExampleNull>
40
+ <ExampleForwardRef qux="qux" />
41
</View>
42
</View>
43
);
@@ -48,13 +49,17 @@ describe('ReactTestRendererTraversal', () => {
49
const ExampleFn = props => <View baz="baz" />;
50
const ExampleNull = props => null;
51
52
+ const ExampleForwardRef = React.forwardRef((props, ref) => (
53
+ <View {...props} ref={ref} />
54
+ ));
55
+
56
it('initializes', () => {
57
const render = ReactTestRenderer.create(<Example />);
58
const hasFooProp = node => node.props.hasOwnProperty('foo');
59
60
// assert .props, .type and .parent attributes
61
const foo = render.root.find(hasFooProp);
57
- expect(foo.props.children).toHaveLength(7);
62
+ expect(foo.props.children).toHaveLength(8);
63
expect(foo.type).toBe(View);
64
expect(render.root.parent).toBe(null);
65
expect(foo.children[0].parent).toBe(foo);
@@ -116,14 +121,16 @@ describe('ReactTestRendererTraversal', () => {
121
122
expect(() => render.root.findByType(ExampleFn)).not.toThrow(); // 1 match
123
expect(() => render.root.findByType(View)).not.toThrow(); // 1 match
124
+ expect(() => render.root.findByType(ExampleForwardRef)).not.toThrow(); // 1 match
125
// note: there are clearly multiple <View /> in general, but there
126
// is only one being rendered at root node level
127
expect(() => render.root.findByType(ExampleNull)).toThrow(); // 2 matches
128
129
expect(render.root.findAllByType(ExampleFn)).toHaveLength(1);
130
expect(render.root.findAllByType(View, {deep: false})).toHaveLength(1);
125
- expect(render.root.findAllByType(View)).toHaveLength(7);
131
+ expect(render.root.findAllByType(View)).toHaveLength(8);
132
expect(render.root.findAllByType(ExampleNull)).toHaveLength(2);
133
+ expect(render.root.findAllByType(ExampleForwardRef)).toHaveLength(1);
134
135
const nulls = render.root.findAllByType(ExampleNull);
136
expect(nulls[0].findAllByType(View)).toHaveLength(0);
@@ -138,17 +145,21 @@ describe('ReactTestRendererTraversal', () => {
145
const foo = 'foo';
146
const bar = 'bar';
147
const baz = 'baz';
148
+ const qux = 'qux';
149
150
expect(() => render.root.findByProps({foo})).not.toThrow(); // 1 match
151
expect(() => render.root.findByProps({bar})).toThrow(); // >1 matches
152
expect(() => render.root.findByProps({baz})).toThrow(); // >1 matches
153
+ expect(() => render.root.findByProps({qux})).not.toThrow(); // 1 match
154
155
expect(render.root.findAllByProps({foo}, {deep: false})).toHaveLength(1);
156
expect(render.root.findAllByProps({bar}, {deep: false})).toHaveLength(5);
157
expect(render.root.findAllByProps({baz}, {deep: false})).toHaveLength(2);
158
+ expect(render.root.findAllByProps({qux}, {deep: false})).toHaveLength(1);
159
160
expect(render.root.findAllByProps({foo})).toHaveLength(2);
161
expect(render.root.findAllByProps({bar})).toHaveLength(9);
162
expect(render.root.findAllByProps({baz})).toHaveLength(4);
163
+ expect(render.root.findAllByProps({qux})).toHaveLength(3);
164
});
165
});