diff --git a/src/__tests__/legacy/storeLegacy-v15-test.js b/src/__tests__/legacy/storeLegacy-v15-test.js index 1b8d38753d..baa882e538 100644 --- a/src/__tests__/legacy/storeLegacy-v15-test.js +++ b/src/__tests__/legacy/storeLegacy-v15-test.js @@ -176,6 +176,45 @@ describe('Store (legacy)', () => { expect(store).toMatchSnapshot('6: expand Grandparent'); }); + // TODO Re-enable this test once the renderer supports it. + xit('should support adding and removing children', () => { + const Root = ({ children }) =>
{children}
; + const Component = () => null; + + const container = document.createElement('div'); + + act(() => + ReactDOM.render( + + + , + container + ) + ); + expect(store).toMatchSnapshot('1: mount'); + + act(() => + ReactDOM.render( + + + + , + container + ) + ); + expect(store).toMatchSnapshot('2: add child'); + + act(() => + ReactDOM.render( + + + , + container + ) + ); + expect(store).toMatchSnapshot('3: remove child'); + }); + // TODO Re-enable this test once the renderer supports it. xit('should support reordering of children', () => { const Root = ({ children }) =>
{children}
; @@ -194,13 +233,13 @@ describe('Store (legacy)', () => { expect(store).toMatchSnapshot('1: mount'); act(() => ReactDOM.render({[bar, foo]}, container)); - expect(store).toMatchSnapshot('3: reorder children'); + expect(store).toMatchSnapshot('2: reorder children'); act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), true)); - expect(store).toMatchSnapshot('4: collapse root'); + expect(store).toMatchSnapshot('3: collapse root'); act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false)); - expect(store).toMatchSnapshot('5: expand root'); + expect(store).toMatchSnapshot('4: expand root'); }); }); @@ -422,19 +461,19 @@ describe('Store (legacy)', () => { expect(store).toMatchSnapshot('1: mount'); act(() => ReactDOM.render({[bar, foo]}, container)); - expect(store).toMatchSnapshot('3: reorder children'); + expect(store).toMatchSnapshot('2: reorder children'); act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), false)); - expect(store).toMatchSnapshot('4: expand root'); + expect(store).toMatchSnapshot('3: expand root'); act(() => { store.toggleIsCollapsed(store.getElementIDAtIndex(2), false); store.toggleIsCollapsed(store.getElementIDAtIndex(1), false); }); - expect(store).toMatchSnapshot('5: expand leaves'); + expect(store).toMatchSnapshot('4: expand leaves'); act(() => store.toggleIsCollapsed(store.getElementIDAtIndex(0), true)); - expect(store).toMatchSnapshot('6: collapse root'); + expect(store).toMatchSnapshot('5: collapse root'); }); }); }); diff --git a/src/backend/legacy/getChildren.js b/src/backend/legacy/getChildren.js index 1ed8b52e08..0ce3a39603 100644 --- a/src/backend/legacy/getChildren.js +++ b/src/backend/legacy/getChildren.js @@ -1,22 +1,30 @@ // @flow +import traverseAllChildrenImpl from './traverseAllChildrenImpl'; + +// TODO (legacy) Respect component filters + export default function getChildren(internalInstance: Object): Array { + let children = []; + // If the parent is a native node without rendered children, but with // multiple string children, then the `element` that gets passed in here is // a plain value -- a string or number. - if (internalInstance._renderedComponent) { - return [internalInstance._renderedComponent]; + if (typeof internalInstance !== 'object') { + // No children + } else if ( + internalInstance._currentElement === null || + internalInstance._currentElement === false + ) { + // No children + } else if (internalInstance._renderedComponent) { + children = [internalInstance._renderedComponent]; } else if (internalInstance._renderedChildren) { - return childrenToArray(internalInstance._renderedChildren); + children = renderedChildrenToArray(internalInstance._renderedChildren); } else if ( internalInstance._currentElement && internalInstance._currentElement.props ) { - // DevTools doesn't need to display primative child types, - // So we can filter them out early. - /* - const children = []; - // This is a native node without rendered children -- meaning the children // prop is the unfiltered list of children. // This may include 'null' or even other invalid values, so we need to @@ -34,30 +42,26 @@ export default function getChildren(internalInstance: Object): Array { children.push(child); } } - // traverseContext ); - - return children; - */ } - if (internalInstance._instance) { - var inst = internalInstance._instance; + const instance = internalInstance._instance; + if (instance) { // TODO: React ART currently falls in this bucket, but this doesn't // actually make sense and we should clean this up after stabilizing our // API for backends - if (inst._renderedChildren) { - return childrenToArray(inst._renderedChildren); + if (instance._renderedChildren) { + children = renderedChildrenToArray(instance._renderedChildren); } } - return []; + return children; } -function childrenToArray(children) { - const array = []; - for (var name in children) { - array.push(children[name]); +function renderedChildrenToArray(renderedChildren): Array { + const childrenArray = []; + for (let name in renderedChildren) { + childrenArray.push(renderedChildren[name]); } - return array; + return childrenArray; }