mount: add containerInfo to Portal representations

enzymejs · Aug 18, 2018 · 605021d · 605021d
1 parent e45b365
commit 605021d
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 16 deletions.
diff --git a/packages/enzyme-adapter-react-16.1/src/ReactSixteenOneAdapter.js b/packages/enzyme-adapter-react-16.1/src/ReactSixteenOneAdapter.js
@@ -111,16 +111,19 @@ function toTree(vnode) {
   switch (node.tag) {
     case HostRoot: // 3
       return childrenToTree(node.child);
-    case HostPortal: // 4
+    case HostPortal: { // 4
+      const { stateNode: { containerInfo } } = node;
+      const props = { containerInfo };
       return {
         nodeType: 'portal',
         type: Portal,
-        props: {},
+        props,
         key: ensureKeyOrUndefined(node.key),
         ref: node.ref,
         instance: null,
         rendered: childrenToTree(node.child),
       };
+    }
     case ClassComponent:
       return {
         nodeType: 'class',

diff --git a/packages/enzyme-adapter-react-16.2/src/ReactSixteenTwoAdapter.js b/packages/enzyme-adapter-react-16.2/src/ReactSixteenTwoAdapter.js
@@ -112,16 +112,19 @@ function toTree(vnode) {
   switch (node.tag) {
     case HostRoot: // 3
       return childrenToTree(node.child);
-    case HostPortal: // 4
+    case HostPortal: { // 4
+      const { stateNode: { containerInfo } } = node;
+      const props = { containerInfo };
       return {
         nodeType: 'portal',
         type: Portal,
-        props: {},
+        props,
         key: ensureKeyOrUndefined(node.key),
         ref: node.ref,
         instance: null,
         rendered: childrenToTree(node.child),
       };
+    }
     case ClassComponent:
       return {
         nodeType: 'class',

diff --git a/packages/enzyme-adapter-react-16.3/src/ReactSixteenThreeAdapter.js b/packages/enzyme-adapter-react-16.3/src/ReactSixteenThreeAdapter.js
@@ -117,16 +117,19 @@ function toTree(vnode) {
   switch (node.tag) {
     case HostRoot: // 3
       return childrenToTree(node.child);
-    case HostPortal: // 4
+    case HostPortal: { // 4
+      const { stateNode: { containerInfo } } = node;
+      const props = { containerInfo };
       return {
         nodeType: 'portal',
         type: Portal,
-        props: {},
+        props,
         key: ensureKeyOrUndefined(node.key),
         ref: node.ref,
         instance: null,
         rendered: childrenToTree(node.child),
       };
+    }
     case ClassComponent:
       return {
         nodeType: 'class',

diff --git a/packages/enzyme-adapter-react-16/src/ReactSixteenAdapter.js b/packages/enzyme-adapter-react-16/src/ReactSixteenAdapter.js
@@ -117,16 +117,19 @@ function toTree(vnode) {
   switch (node.tag) {
     case HostRoot: // 3
       return childrenToTree(node.child);
-    case HostPortal: // 4
+    case HostPortal: { // 4
+      const { stateNode: { containerInfo } } = node;
+      const props = { containerInfo };
       return {
         nodeType: 'portal',
         type: Portal,
-        props: {},
+        props,
         key: ensureKeyOrUndefined(node.key),
         ref: node.ref,
         instance: null,
         rendered: childrenToTree(node.child),
       };
+    }
     case ClassComponent:
       return {
         nodeType: 'class',

diff --git a/packages/enzyme-test-suite/test/Adapter-spec.jsx b/packages/enzyme-test-suite/test/Adapter-spec.jsx
@@ -231,7 +231,9 @@ describe('Adapter', () => {
         rendered: {
           nodeType: 'portal',
           type: Portal,
-          props: {},
+          props: {
+            containerInfo: document.body,
+          },
           key: undefined,
           ref: null,
           instance: null,

diff --git a/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx b/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx
@@ -444,7 +444,7 @@ describeWithDOM('mount', () => {
       const wrapper = mount(<Foo />);
       expect(wrapper.debug()).to.equal(`<Foo>
   <div>
-    <Portal>
+    <Portal containerInfo={{...}}>
       <div className="in-portal">
         InPortal
       </div>
@@ -453,8 +453,9 @@ describeWithDOM('mount', () => {
 </Foo>`);
     });
 
-    it('should show portal container in shallow debug tree', () => {
+    it('should show portal container in debug tree', () => {
       const containerDiv = global.document.createElement('div');
+      containerDiv.setAttribute('data-foo', 'bar');
       const Foo = () => (
         <div className="foo">
           {createPortal(
@@ -467,7 +468,7 @@ describeWithDOM('mount', () => {
       const wrapper = mount(<Foo />);
       expect(wrapper.debug({ verbose: true })).to.equal(`<Foo>
   <div className="foo">
-    <Portal>
+    <Portal containerInfo={<div data-foo="bar">...</div>}>
       <div className="in-portal">
         InPortal
       </div>
@@ -496,7 +497,7 @@ describeWithDOM('mount', () => {
       const wrapper = mount(<Foo />);
       expect(wrapper.debug()).to.equal(`<Foo>
   <div className="foo">
-    <Portal>
+    <Portal containerInfo={{...}}>
       <div className="in-portal">
         <div className="nested-in-portal">
           <Bar />
@@ -516,7 +517,7 @@ describeWithDOM('mount', () => {
 
       const wrapper = mount(<Foo />);
       expect(wrapper.debug()).to.equal(`<Foo>
-  <Portal>
+  <Portal containerInfo={{...}}>
     <div className="in-portal">
       InPortal
     </div>
@@ -1372,7 +1373,7 @@ describeWithDOM('mount', () => {
         );
 
         const wrapper = mount(<Foo />);
-        expect(wrapper.find('Portal').debug()).to.equal(`<Portal>
+        expect(wrapper.find('Portal').debug()).to.equal(`<Portal containerInfo={{...}}>
   <div className="in-portal">
     InPortal
   </div>
@@ -1714,7 +1715,7 @@ describeWithDOM('mount', () => {
 
       const wrapper = mount(<Foo />);
       expect(wrapper.findWhere(node => node.type() === Portal).debug())
-        .to.equal(`<Portal>
+        .to.equal(`<Portal containerInfo={{...}}>
   <div className="in-portal">
     InPortal
   </div>