Add support for sibling iterables

enzymejs · Oct 27, 2017 · 3ad399c · 3ad399c
1 parent 321c807
commit 3ad399c
Show file tree

Hide file tree

Showing 3 changed files with 93 additions and 10 deletions.
diff --git a/packages/enzyme-adapter-react-13/src/ReactThirteenElementToTree.js b/packages/enzyme-adapter-react-13/src/ReactThirteenElementToTree.js
@@ -1,5 +1,4 @@
-import flatten from 'lodash/flatten';
-import { isIterable } from 'enzyme-adapter-utils';
+import { flatten, isArrayLike } from 'enzyme-adapter-utils';
 
 export function nodeTypeFromType(type) {
   if (typeof type === 'string') {
@@ -22,9 +21,7 @@ export default function elementToTree(el) {
   const { type, props, key, ref } = el;
   const { children } = props;
   let rendered = null;
-  if (Array.isArray(children)) {
-    rendered = flatten(children, true).map(elementToTree);
-  } else if (isIterable(children) && typeof children !== 'string') {
+  if (isArrayLike(children)) {
     rendered = flatten([...children], true).map(elementToTree);
   } else if (typeof children !== 'undefined') {
     rendered = elementToTree(children);

diff --git a/packages/enzyme-adapter-utils/src/Utils.js b/packages/enzyme-adapter-utils/src/Utils.js
@@ -1,4 +1,3 @@
-import flatten from 'lodash/flatten';
 import createMountWrapper from './createMountWrapper';
 import createRenderWrapper from './createRenderWrapper';
 
@@ -95,7 +94,7 @@ export function nodeTypeFromType(type) {
   return 'function';
 }
 
-export function isIterable(obj) {
+function isIterable(obj) {
   return (
     obj != null &&
     typeof Symbol === 'function' &&
@@ -104,16 +103,25 @@ export function isIterable(obj) {
   );
 }
 
+export function isArrayLike(obj) {
+  return Array.isArray(obj) || (isIterable(obj) && typeof obj !== 'string');
+}
+
+export function flatten(arrs) {
+  return arrs.reduce(
+    (flattened, item) => flattened.concat(isArrayLike(item) ? flatten([...item]) : item),
+    [],
+  );
+}
+
 export function elementToTree(el) {
   if (el === null || typeof el !== 'object' || !('type' in el)) {
     return el;
   }
   const { type, props, key, ref } = el;
   const { children } = props;
   let rendered = null;
-  if (Array.isArray(children)) {
-    rendered = flatten(children, true).map(elementToTree);
-  } else if (isIterable(children) && typeof children !== 'string') {
+  if (isArrayLike(children)) {
     rendered = flatten([...children], true).map(elementToTree);
   } else if (typeof children !== 'undefined') {
     rendered = elementToTree(children);

diff --git a/packages/enzyme-test-suite/test/RSTTraversal-spec.jsx b/packages/enzyme-test-suite/test/RSTTraversal-spec.jsx
@@ -202,6 +202,32 @@ describe('RSTTraversal', () => {
       expect(nodes).to.deep.equal([node, divA, divB]);
     });
 
+    it('should handle array siblings', () => {
+      const spy = sinon.spy();
+      const array1 = [
+        <div key="a" />,
+        <div key="b" />,
+      ];
+      const array2 = [
+        <div key="c" />,
+        <div key="d" />,
+      ];
+      const divA = $(<div key="a" />);
+      const divB = $(<div key="b" />);
+      const divC = $(<div key="c" />);
+      const divD = $(<div key="d" />);
+      const node = $(
+        <div>
+          {array1}
+          {array2}
+        </div>,
+      );
+      treeForEach(node, spy);
+      expect(spy.callCount).to.equal(5);
+      const nodes = spy.args.map(arg => arg[0]);
+      expect(nodes).to.deep.equal([node, divA, divB, divC, divD]);
+    });
+
     it('should handle Map children', () => {
       const spy = sinon.spy();
       const twoDivMap = new Map([
@@ -221,6 +247,32 @@ describe('RSTTraversal', () => {
       expect(nodes).to.deep.equal([node, divA, divB]);
     });
 
+    it('should handle Map siblings', () => {
+      const spy = sinon.spy();
+      const map1 = new Map([
+        [<div key="a" />],
+        [<div key="b" />],
+      ]);
+      const map2 = new Map([
+        [<div key="c" />],
+        [<div key="d" />],
+      ]);
+      const divA = $(<div key="a" />);
+      const divB = $(<div key="b" />);
+      const divC = $(<div key="c" />);
+      const divD = $(<div key="d" />);
+      const node = $(
+        <div>
+          {map1}
+          {map2}
+        </div>,
+      );
+      treeForEach(node, spy);
+      expect(spy.callCount).to.equal(5);
+      const nodes = spy.args.map(arg => arg[0]);
+      expect(nodes).to.deep.equal([node, divA, divB, divC, divD]);
+    });
+
     it('should handle Set children', () => {
       const spy = sinon.spy();
       const twoDivSet = new Set([
@@ -240,6 +292,32 @@ describe('RSTTraversal', () => {
       expect(nodes).to.deep.equal([node, divA, divB]);
     });
 
+    it('should handle Set siblings', () => {
+      const spy = sinon.spy();
+      const set1 = new Set([
+        <div key="a" />,
+        <div key="b" />,
+      ]);
+      const set2 = new Set([
+        <div key="c" />,
+        <div key="d" />,
+      ]);
+      const divA = $(<div key="a" />);
+      const divB = $(<div key="b" />);
+      const divC = $(<div key="c" />);
+      const divD = $(<div key="d" />);
+      const node = $(
+        <div>
+          {set1}
+          {set2}
+        </div>,
+      );
+      treeForEach(node, spy);
+      expect(spy.callCount).to.equal(5);
+      const nodes = spy.args.map(arg => arg[0]);
+      expect(nodes).to.deep.equal([node, divA, divB, divC, divD]);
+    });
+
     it('should not get trapped from empty strings', () => {
       const spy = sinon.spy();
       const node = $(