How to use traverseAllChildren method in Playwright Internal

1/**
2 * Copyright 2013-2015, Facebook, Inc.
3 * All rights reserved.
4 *
5 * This source code is licensed under the BSD-style license found in the
6 * LICENSE file in the root directory of this source tree. An additional grant
7 * of patent rights can be found in the PATENTS file in the same directory.
8 *
9 * @emails react-core
10 */
11
12'use strict';
13
14describe('traverseAllChildren', function() {
15  var traverseAllChildren;
16  var React;
17  var ReactFragment;
18  beforeEach(function() {
19    require('mock-modules').dumpCache();
20    traverseAllChildren = require('traverseAllChildren');
21    React = require('React');
22    ReactFragment = require('ReactFragment');
23  });
24
25  function frag(obj) {
26    return ReactFragment.create(obj);
27  }
28
29  it('should support identity for simple', function() {
30    var traverseContext = [];
31    var traverseFn =
32      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
33        context.push(true);
34      });
35
36    var simpleKid = <span key="simple" />;
37
38    // Jasmine doesn't provide a way to test that the fn was invoked with scope.
39    var instance = <div>{simpleKid}</div>;
40    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
41    expect(traverseFn).toHaveBeenCalledWith(
42      traverseContext,
43      simpleKid,
44      '.$simple'
45    );
46    expect(traverseContext.length).toEqual(1);
47  });
48
49  it('should treat single arrayless child as being in array', function() {
50    var traverseContext = [];
51    var traverseFn =
52      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
53        context.push(true);
54      });
55
56    var simpleKid = <span />;
57    var instance = <div>{simpleKid}</div>;
58    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
59    expect(traverseFn).toHaveBeenCalledWith(
60      traverseContext,
61      simpleKid,
62      '.0'
63    );
64    expect(traverseContext.length).toEqual(1);
65  });
66
67  it('should treat single child in array as expected', function() {
68    spyOn(console, 'error');
69    var traverseContext = [];
70    var traverseFn =
71      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
72        context.push(true);
73      });
74
75    var simpleKid = <span />;
76    var instance = <div>{[simpleKid]}</div>;
77    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
78    expect(traverseFn).toHaveBeenCalledWith(
79      traverseContext,
80      simpleKid,
81      '.0'
82    );
83    expect(traverseContext.length).toEqual(1);
84    expect(console.error.calls.length).toBe(1);
85    expect(console.error.calls[0].args[0]).toContain('Warning: Each child in an array or iterator should have a unique "key" prop.');
86  });
87
88  it('should be called for each child', function() {
89    var zero = <div key="keyZero" />;
90    var one = null;
91    var two = <div key="keyTwo" />;
92    var three = null;
93    var four = <div key="keyFour" />;
94
95    var traverseContext = [];
96    var traverseFn =
97      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
98        context.push(true);
99      });
100
101    var instance = (
102      <div>
103        {zero}
104        {one}
105        {two}
106        {three}
107        {four}
108      </div>
109    );
110
111    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
112    expect(traverseFn).toHaveBeenCalledWith(
113      traverseContext,
114      zero,
115      '.$keyZero'
116    );
117    expect(traverseFn).toHaveBeenCalledWith(traverseContext, one, '.1');
118    expect(traverseFn).toHaveBeenCalledWith(
119      traverseContext,
120      two,
121      '.$keyTwo'
122    );
123    expect(traverseFn).toHaveBeenCalledWith(traverseContext, three, '.3');
124    expect(traverseFn).toHaveBeenCalledWith(
125      traverseContext,
126      four,
127      '.$keyFour'
128    );
129  });
130
131  it('should traverse children of different kinds', function() {
132    var div = <div key="divNode" />;
133    var span = <span key="spanNode" />;
134    var a = <a key="aNode" />;
135
136    var traverseContext = [];
137    var traverseFn =
138      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
139        context.push(true);
140      });
141
142    var instance = (
143      <div>
144        {div}
145        {[frag({span})]}
146        {frag({a: a})}
147        {'string'}
148        {1234}
149        {true}
150        {false}
151        {null}
152        {undefined}
153      </div>
154    );
155
156    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
157
158    expect(traverseFn.calls.length).toBe(9);
159    expect(traverseContext.length).toEqual(9);
160
161    expect(traverseFn).toHaveBeenCalledWith(
162      traverseContext, div, '.$divNode'
163    );
164    expect(traverseFn).toHaveBeenCalledWith(
165      traverseContext, <span key="span/.$spanNode" />, '.1:0:$span/=1$spanNode'
166    );
167    expect(traverseFn).toHaveBeenCalledWith(
168      traverseContext, <a key="a/.$aNode" />, '.2:$a/=1$aNode'
169    );
170    expect(traverseFn).toHaveBeenCalledWith(
171      traverseContext, 'string', '.3'
172    );
173    expect(traverseFn).toHaveBeenCalledWith(
174      traverseContext, 1234, '.4'
175    );
176    expect(traverseFn).toHaveBeenCalledWith(
177      traverseContext, null, '.5'
178    );
179    expect(traverseFn).toHaveBeenCalledWith(
180      traverseContext, null, '.6'
181    );
182    expect(traverseFn).toHaveBeenCalledWith(
183      traverseContext, null, '.7'
184    );
185    expect(traverseFn).toHaveBeenCalledWith(
186      traverseContext, null, '.8'
187    );
188  });
189
190  it('should be called for each child in nested structure', function() {
191    var zero = <div key="keyZero" />;
192    var one = null;
193    var two = <div key="keyTwo" />;
194    var three = null;
195    var four = <div key="keyFour" />;
196    var five = <div key="keyFiveInner" />;
197    // five is placed into a JS object with a key that is joined to the
198    // component key attribute.
199    // Precedence is as follows:
200    // 1. If grouped in an Object, the object key combined with `key` prop
201    // 2. If grouped in an Array, the `key` prop, falling back to array index
202
203
204    var traverseContext = [];
205    var traverseFn =
206      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
207        context.push(true);
208      });
209
210    var instance = (
211      <div>{
212        [
213          frag({
214            firstHalfKey: [zero, one, two],
215            secondHalfKey: [three, four],
216            keyFive: five,
217          }),
218        ]
219      }</div>
220    );
221
222    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
223    expect(traverseFn.calls.length).toBe(4);
224    expect(traverseContext.length).toEqual(4);
225    expect(traverseFn).toHaveBeenCalledWith(
226      traverseContext,
227      <div key="firstHalfKey/.$keyZero" />,
228      '.0:$firstHalfKey/=1$keyZero'
229    );
230
231    expect(traverseFn).toHaveBeenCalledWith(
232      traverseContext,
233      <div key="firstHalfKey/.$keyTwo" />,
234      '.0:$firstHalfKey/=1$keyTwo'
235    );
236
237    expect(traverseFn).toHaveBeenCalledWith(
238      traverseContext,
239      <div key="secondHalfKey/.$keyFour" />,
240      '.0:$secondHalfKey/=1$keyFour'
241    );
242
243    expect(traverseFn).toHaveBeenCalledWith(
244      traverseContext,
245      <div key="keyFive/.$keyFiveInner" />,
246      '.0:$keyFive/=1$keyFiveInner'
247    );
248  });
249
250  it('should retain key across two mappings', function() {
251    var zeroForceKey = <div key="keyZero" />;
252    var oneForceKey = <div key="keyOne" />;
253    var traverseContext = [];
254    var traverseFn =
255      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
256        context.push(true);
257      });
258
259    var forcedKeys = (
260      <div>
261        {zeroForceKey}
262        {oneForceKey}
263      </div>
264    );
265
266    traverseAllChildren(forcedKeys.props.children, traverseFn, traverseContext);
267    expect(traverseContext.length).toEqual(2);
268    expect(traverseFn).toHaveBeenCalledWith(
269      traverseContext,
270      zeroForceKey,
271      '.$keyZero'
272    );
273    expect(traverseFn).toHaveBeenCalledWith(
274      traverseContext,
275      oneForceKey,
276      '.$keyOne'
277    );
278  });
279
280  it('should be called for each child in an iterable without keys', function() {
281    spyOn(console, 'error');
282    var threeDivIterable = {
283      '@@iterator': function() {
284        var i = 0;
285        return {
286          next: function() {
287            if (i++ < 3) {
288              return {value: <div />, done: false};
289            } else {
290              return {value: undefined, done: true};
291            }
292          },
293        };
294      },
295    };
296
297    var traverseContext = [];
298    var traverseFn =
299      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
300        context.push(kid);
301      });
302
303    var instance = (
304      <div>
305        {threeDivIterable}
306      </div>
307    );
308
309    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
310    expect(traverseFn.calls.length).toBe(3);
311
312    expect(traverseFn).toHaveBeenCalledWith(
313      traverseContext,
314      traverseContext[0],
315      '.0'
316    );
317    expect(traverseFn).toHaveBeenCalledWith(
318      traverseContext,
319      traverseContext[1],
320      '.1'
321    );
322    expect(traverseFn).toHaveBeenCalledWith(
323      traverseContext,
324      traverseContext[2],
325      '.2'
326    );
327
328    expect(console.error.calls.length).toBe(1);
329    expect(console.error.calls[0].args[0]).toContain('Warning: Each child in an array or iterator should have a unique "key" prop.');
330  });
331
332  it('should be called for each child in an iterable with keys', function() {
333    var threeDivIterable = {
334      '@@iterator': function() {
335        var i = 0;
336        return {
337          next: function() {
338            if (i++ < 3) {
339              return {value: <div key={'#' + i} />, done: false};
340            } else {
341              return {value: undefined, done: true};
342            }
343          },
344        };
345      },
346    };
347
348    var traverseContext = [];
349    var traverseFn =
350      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
351        context.push(kid);
352      });
353
354    var instance = (
355      <div>
356        {threeDivIterable}
357      </div>
358    );
359
360    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
361    expect(traverseFn.calls.length).toBe(3);
362
363    expect(traverseFn).toHaveBeenCalledWith(
364      traverseContext,
365      traverseContext[0],
366      '.$#1'
367    );
368    expect(traverseFn).toHaveBeenCalledWith(
369      traverseContext,
370      traverseContext[1],
371      '.$#2'
372    );
373    expect(traverseFn).toHaveBeenCalledWith(
374      traverseContext,
375      traverseContext[2],
376      '.$#3'
377    );
378  });
379
380  it('should use keys from entry iterables', function() {
381    spyOn(console, 'error');
382
383    var threeDivEntryIterable = {
384      '@@iterator': function() {
385        var i = 0;
386        return {
387          next: function() {
388            if (i++ < 3) {
389              return {value: ['#' + i, <div />], done: false};
390            } else {
391              return {value: undefined, done: true};
392            }
393          },
394        };
395      },
396    };
397    threeDivEntryIterable.entries = threeDivEntryIterable['@@iterator'];
398
399    var traverseContext = [];
400    var traverseFn =
401      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
402        context.push(kid);
403      });
404
405    var instance = (
406      <div>
407        {threeDivEntryIterable}
408      </div>
409    );
410
411    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
412    expect(traverseFn.calls.length).toBe(3);
413
414    expect(traverseFn).toHaveBeenCalledWith(
415      traverseContext,
416      traverseContext[0],
417      '.$#1:0'
418    );
419    expect(traverseFn).toHaveBeenCalledWith(
420      traverseContext,
421      traverseContext[1],
422      '.$#2:0'
423    );
424    expect(traverseFn).toHaveBeenCalledWith(
425      traverseContext,
426      traverseContext[2],
427      '.$#3:0'
428    );
429
430    expect(console.error.argsForCall.length).toBe(1);
431    expect(console.error.argsForCall[0][0]).toContain(
432      'Warning: Using Maps as children is not yet fully supported. It is an ' +
433      'experimental feature that might be removed. Convert it to a sequence ' +
434      '/ iterable of keyed ReactElements instead.'
435    );
436  });
437
438  it('should not enumerate enumerable numbers (#4776)', function() {
439    /*eslint-disable no-extend-native */
440    Number.prototype['@@iterator'] = function() {
441      throw new Error('number iterator called');
442    };
443    /*eslint-enable no-extend-native */
444
445    try {
446      var instance = (
447        <div>
448          {5}
449          {12}
450          {13}
451        </div>
452      );
453
454      var traverseFn = jasmine.createSpy();
455
456      traverseAllChildren(instance.props.children, traverseFn, null);
457      expect(traverseFn.calls.length).toBe(3);
458
459      expect(traverseFn).toHaveBeenCalledWith(
460        null,
461        5,
462        '.0'
463      );
464      expect(traverseFn).toHaveBeenCalledWith(
465        null,
466        12,
467        '.1'
468      );
469      expect(traverseFn).toHaveBeenCalledWith(
470        null,
471        13,
472        '.2'
473      );
474    } finally {
475      delete Number.prototype['@@iterator'];
476    }
477  });
478
479  it('should throw on object', function() {
480    expect(function() {
481      traverseAllChildren({a: 1, b: 2}, function() {}, null);
482    }).toThrow(
483      'Objects are not valid as a React child (found: object with keys ' +
484      '{a, b}). If you meant to render a collection of children, use an ' +
485      'array instead or wrap the object using createFragment(object) from ' +
486      'the React add-ons.'
487    );
488  });
489
490  it('should throw on regex', function() {
491    // Really, we care about dates (#4840) but those have nondeterministic
492    // serialization (timezones) so let's test a regex instead:
493    expect(function() {
494      traverseAllChildren(/abc/, function() {}, null);
495    }).toThrow(
496      'Objects are not valid as a React child (found: /abc/). If you meant ' +
497      'to render a collection of children, use an array instead or wrap the ' +
498      'object using createFragment(object) from the React add-ons.'
499    );
500  });
501
502});
503

Source: traverseAllChildren-test.js

/**
 * Copyright 2013-2015, Facebook, Inc.
 * All rights reserved.
 *
 * This source code is licensed under the BSD-style license found in the
 * LICENSE file in the root directory of this source tree. An additional grant
 * of patent rights can be found in the PATENTS file in the same directory.
 *
 * @emails react-core
 */

'use strict';

describe('traverseAllChildren', function() {
  var traverseAllChildren;
  var React;
  var ReactFragment;
  beforeEach(function() {
    require('mock-modules').dumpCache();
    traverseAllChildren = require('traverseAllChildren');
    React = require('React');
    ReactFragment = require('ReactFragment');
  });

  function frag(obj) {
    return ReactFragment.create(obj);
  }

  it('should support identity for simple', function() {
    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(true);
      });

    var simpleKid = <span key="simple" />;

    // Jasmine doesn't provide a way to test that the fn was invoked with scope.
    var instance = <div>{simpleKid}</div>;
    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      simpleKid,
      '.$simple'
    );
    expect(traverseContext.length).toEqual(1);
  });

  it('should treat single arrayless child as being in array', function() {
    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(true);
      });

    var simpleKid = <span />;
    var instance = <div>{simpleKid}</div>;
    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      simpleKid,
      '.0'
    );
    expect(traverseContext.length).toEqual(1);
  });

  it('should treat single child in array as expected', function() {
    spyOn(console, 'error');
    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(true);
      });

    var simpleKid = <span />;
    var instance = <div>{[simpleKid]}</div>;
    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      simpleKid,
      '.0'
    );
    expect(traverseContext.length).toEqual(1);
    expect(console.error.calls.length).toBe(1);
    expect(console.error.calls[0].args[0]).toContain('Warning: Each child in an array or iterator should have a unique "key" prop.');
  });

  it('should be called for each child', function() {
    var zero = <div key="keyZero" />;
    var one = null;
    var two = <div key="keyTwo" />;
    var three = null;
    var four = <div key="keyFour" />;

    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(true);
      });

    var instance = (
      <div>
        {zero}
        {one}
        {two}
        {three}
        {four}
      </div>
    );

    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      zero,
      '.$keyZero'
    );
    expect(traverseFn).toHaveBeenCalledWith(traverseContext, one, '.1');
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      two,
      '.$keyTwo'
    );
    expect(traverseFn).toHaveBeenCalledWith(traverseContext, three, '.3');
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      four,
      '.$keyFour'
    );
  });

  it('should traverse children of different kinds', function() {
    var div = <div key="divNode" />;
    var span = <span key="spanNode" />;
    var a = <a key="aNode" />;

    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(true);
      });

    var instance = (
      <div>
        {div}
        {[frag({span})]}
        {frag({a: a})}
        {'string'}
        {1234}
        {true}
        {false}
        {null}
        {undefined}
      </div>
    );

    traverseAllChildren(instance.props.children, traverseFn, traverseContext);

    expect(traverseFn.calls.length).toBe(9);
    expect(traverseContext.length).toEqual(9);

    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, div, '.$divNode'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, <span key="span/.$spanNode" />, '.1:0:$span/=1$spanNode'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, <a key="a/.$aNode" />, '.2:$a/=1$aNode'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, 'string', '.3'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, 1234, '.4'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, null, '.5'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, null, '.6'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, null, '.7'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext, null, '.8'
    );
  });

  it('should be called for each child in nested structure', function() {
    var zero = <div key="keyZero" />;
    var one = null;
    var two = <div key="keyTwo" />;
    var three = null;
    var four = <div key="keyFour" />;
    var five = <div key="keyFiveInner" />;
    // five is placed into a JS object with a key that is joined to the
    // component key attribute.
    // Precedence is as follows:
    // 1. If grouped in an Object, the object key combined with `key` prop
    // 2. If grouped in an Array, the `key` prop, falling back to array index


    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(true);
      });

    var instance = (
      <div>{
        [
          frag({
            firstHalfKey: [zero, one, two],
            secondHalfKey: [three, four],
            keyFive: five,
          }),
        ]
      }</div>
    );

    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn.calls.length).toBe(4);
    expect(traverseContext.length).toEqual(4);
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      <div key="firstHalfKey/.$keyZero" />,
      '.0:$firstHalfKey/=1$keyZero'
    );

    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      <div key="firstHalfKey/.$keyTwo" />,
      '.0:$firstHalfKey/=1$keyTwo'
    );

    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      <div key="secondHalfKey/.$keyFour" />,
      '.0:$secondHalfKey/=1$keyFour'
    );

    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      <div key="keyFive/.$keyFiveInner" />,
      '.0:$keyFive/=1$keyFiveInner'
    );
  });

  it('should retain key across two mappings', function() {
    var zeroForceKey = <div key="keyZero" />;
    var oneForceKey = <div key="keyOne" />;
    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(true);
      });

    var forcedKeys = (
      <div>
        {zeroForceKey}
        {oneForceKey}
      </div>
    );

    traverseAllChildren(forcedKeys.props.children, traverseFn, traverseContext);
    expect(traverseContext.length).toEqual(2);
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      zeroForceKey,
      '.$keyZero'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      oneForceKey,
      '.$keyOne'
    );
  });

  it('should be called for each child in an iterable without keys', function() {
    spyOn(console, 'error');
    var threeDivIterable = {
      '@@iterator': function() {
        var i = 0;
        return {
          next: function() {
            if (i++ < 3) {
              return {value: <div />, done: false};
            } else {
              return {value: undefined, done: true};
            }
          },
        };
      },
    };

    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(kid);
      });

    var instance = (
      <div>
        {threeDivIterable}
      </div>
    );

    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn.calls.length).toBe(3);

    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[0],
      '.0'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[1],
      '.1'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[2],
      '.2'
    );

    expect(console.error.calls.length).toBe(1);
    expect(console.error.calls[0].args[0]).toContain('Warning: Each child in an array or iterator should have a unique "key" prop.');
  });

  it('should be called for each child in an iterable with keys', function() {
    var threeDivIterable = {
      '@@iterator': function() {
        var i = 0;
        return {
          next: function() {
            if (i++ < 3) {
              return {value: <div key={'#' + i} />, done: false};
            } else {
              return {value: undefined, done: true};
            }
          },
        };
      },
    };

    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(kid);
      });

    var instance = (
      <div>
        {threeDivIterable}
      </div>
    );

    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn.calls.length).toBe(3);

    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[0],
      '.$#1'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[1],
      '.$#2'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[2],
      '.$#3'
    );
  });

  it('should use keys from entry iterables', function() {
    spyOn(console, 'error');

    var threeDivEntryIterable = {
      '@@iterator': function() {
        var i = 0;
        return {
          next: function() {
            if (i++ < 3) {
              return {value: ['#' + i, <div />], done: false};
            } else {
              return {value: undefined, done: true};
            }
          },
        };
      },
    };
    threeDivEntryIterable.entries = threeDivEntryIterable['@@iterator'];

    var traverseContext = [];
    var traverseFn =
      jasmine.createSpy().andCallFake(function(context, kid, key, index) {
        context.push(kid);
      });

    var instance = (
      <div>
        {threeDivEntryIterable}
      </div>
    );

    traverseAllChildren(instance.props.children, traverseFn, traverseContext);
    expect(traverseFn.calls.length).toBe(3);

    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[0],
      '.$#1:0'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[1],
      '.$#2:0'
    );
    expect(traverseFn).toHaveBeenCalledWith(
      traverseContext,
      traverseContext[2],
      '.$#3:0'
    );

    expect(console.error.argsForCall.length).toBe(1);
    expect(console.error.argsForCall[0][0]).toContain(
      'Warning: Using Maps as children is not yet fully supported. It is an ' +
      'experimental feature that might be removed. Convert it to a sequence ' +
      '/ iterable of keyed ReactElements instead.'
    );
  });

  it('should not enumerate enumerable numbers (#4776)', function() {
    /*eslint-disable no-extend-native */
    Number.prototype['@@iterator'] = function() {
      throw new Error('number iterator called');
    };
    /*eslint-enable no-extend-native */

    try {
      var instance = (
        <div>
          {5}
          {12}
          {13}
        </div>
      );

      var traverseFn = jasmine.createSpy();

      traverseAllChildren(instance.props.children, traverseFn, null);
      expect(traverseFn.calls.length).toBe(3);

      expect(traverseFn).toHaveBeenCalledWith(
        null,
        5,
        '.0'
      );
      expect(traverseFn).toHaveBeenCalledWith(
        null,
        12,
        '.1'
      );
      expect(traverseFn).toHaveBeenCalledWith(
        null,
        13,
        '.2'
      );
    } finally {
      delete Number.prototype['@@iterator'];
    }
  });

  it('should throw on object', function() {
    expect(function() {
      traverseAllChildren({a: 1, b: 2}, function() {}, null);
    }).toThrow(
      'Objects are not valid as a React child (found: object with keys ' +
      '{a, b}). If you meant to render a collection of children, use an ' +
      'array instead or wrap the object using createFragment(object) from ' +
      'the React add-ons.'
    );
  });

  it('should throw on regex', function() {
    // Really, we care about dates (#4840) but those have nondeterministic
    // serialization (timezones) so let's test a regex instead:
    expect(function() {
      traverseAllChildren(/abc/, function() {}, null);
    }).toThrow(
      'Objects are not valid as a React child (found: /abc/). If you meant ' +
      'to render a collection of children, use an array instead or wrap the ' +
      'object using createFragment(object) from the React add-ons.'
    );
  });

});