Skip to content

Commit

Permalink
Add a failing test for portal child reconciliation
Browse files Browse the repository at this point in the history
It is failing because portal bails out of update, seeing null in pendingProps.
It is null because we set pendingProps to nextPortal.children, which is null in this test.
  • Loading branch information
gaearon committed Dec 9, 2016
1 parent cb8184f commit 3f2129a
Show file tree
Hide file tree
Showing 2 changed files with 79 additions and 0 deletions.
3 changes: 3 additions & 0 deletions scripts/fiber/tests-failing.txt
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,9 @@ src/isomorphic/modern/element/__tests__/ReactJSXElementValidator-test.js
src/renderers/dom/__tests__/ReactDOMProduction-test.js
* should throw with an error code in production

src/renderers/dom/fiber/__tests__/ReactDOMFiber-test.js
* should reconcile portal children

src/renderers/dom/shared/__tests__/ReactDOM-test.js
* throws in render() if the mount callback is not a function
* throws in render() if the update callback is not a function
Expand Down
76 changes: 76 additions & 0 deletions src/renderers/dom/fiber/__tests__/ReactDOMFiber-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -367,6 +367,82 @@ describe('ReactDOMFiber', () => {
expect(container.innerHTML).toBe('');
});

it('should reconcile portal children', () => {
var portalContainer = document.createElement('div');

ReactDOM.render(
<div>
{ReactDOM.unstable_createPortal(
<div>portal:1</div>,
portalContainer
)}
</div>,
container
);
expect(portalContainer.innerHTML).toBe('<div>portal:1</div>');
expect(container.innerHTML).toBe('<div></div>');

ReactDOM.render(
<div>
{ReactDOM.unstable_createPortal(
<div>portal:2</div>,
portalContainer
)}
</div>,
container
);
expect(portalContainer.innerHTML).toBe('<div>portal:2</div>');
expect(container.innerHTML).toBe('<div></div>');

ReactDOM.render(
<div>
{ReactDOM.unstable_createPortal(
<p>portal:3</p>,
portalContainer
)}
</div>,
container
);
expect(portalContainer.innerHTML).toBe('<p>portal:3</p>');
expect(container.innerHTML).toBe('<div></div>');

ReactDOM.render(
<div>
{ReactDOM.unstable_createPortal(
['Hi', 'Bye'],
portalContainer
)}
</div>,
container
);
expect(portalContainer.innerHTML).toBe('HiBye');
expect(container.innerHTML).toBe('<div></div>');

ReactDOM.render(
<div>
{ReactDOM.unstable_createPortal(
['Bye', 'Hi'],
portalContainer
)}
</div>,
container
);
expect(portalContainer.innerHTML).toBe('ByeHi');
expect(container.innerHTML).toBe('<div></div>');

ReactDOM.render(
<div>
{ReactDOM.unstable_createPortal(
null,
portalContainer
)}
</div>,
container
);
expect(portalContainer.innerHTML).toBe('');
expect(container.innerHTML).toBe('<div></div>');
});

it('should keep track of namespace across portals (simple)', () => {
assertNamespacesMatch(
<svg {...expectSVG}>
Expand Down

0 comments on commit 3f2129a

Please sign in to comment.