Handle nested Fragments in toTree (#12106) (#12107)

facebook · Jan 27, 2018 · ef8d6d9 · ef8d6d9
1 parent 40a9e64
commit ef8d6d9
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 0 deletions.
diff --git a/packages/react-test-renderer/src/ReactTestRenderer.js b/packages/react-test-renderer/src/ReactTestRenderer.js
@@ -338,6 +338,8 @@ function toTree(node: ?Fiber) {
       };
     case HostText: // 6
       return node.stateNode.text;
+    case Fragment: // 10
+      return toTree(node.child);
     default:
       invariant(
         false,

diff --git a/packages/react-test-renderer/src/__tests__/ReactTestRenderer-test.js b/packages/react-test-renderer/src/__tests__/ReactTestRenderer-test.js
@@ -530,6 +530,28 @@ describe('ReactTestRenderer', () => {
     );
   });
 
+  it('toTree() handles nested Fragments', () => {
+    const Foo = () => (
+      <React.Fragment>
+        <React.Fragment>foo</React.Fragment>
+      </React.Fragment>
+    );
+    const renderer = ReactTestRenderer.create(<Foo />);
+    const tree = renderer.toTree();
+
+    cleanNodeOrArray(tree);
+
+    expect(prettyFormat(tree)).toEqual(
+      prettyFormat({
+        nodeType: 'component',
+        type: Foo,
+        instance: null,
+        props: {},
+        rendered: 'foo',
+      }),
+    );
+  });
+
   it('toTree() handles null rendering components', () => {
     class Foo extends React.Component {
       render() {