enzyme-adapter-react-16 - npm Package Compare versions

Comparing version 1.2.0 to 1.3.0

build/ReactSixteenAdapter.js

@@ -43,4 +43,10 @@ 'use strict';
 
-var _reflection = require('react-reconciler/reflection');
+var _findCurrentFiberUsingSlowPath = require('./findCurrentFiberUsingSlowPath');
 
+var _findCurrentFiberUsingSlowPath2 = _interopRequireDefault(_findCurrentFiberUsingSlowPath);
+
+var _detectFiberTags = require('./detectFiberTags');
+
+var _detectFiberTags2 = _interopRequireDefault(_detectFiberTags);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
@@ -63,12 +69,4 @@
 
-var HostRoot = 3;
-var ClassComponent = 2;
-var FragmentType = 10;
-var FunctionalComponent = 1;
-var HostPortal = 4;
-var HostComponent = 5;
-var HostText = 6;
-var Mode = 11;
-var ContextConsumerType = 12;
-var ContextProviderType = 13;
+// Lazily populated if DOM is available.
+var FiberTags = null;
 
@@ -104,2 +102,31 @@ function nodeAndSiblingsArray(nodeWithSibling) {
 
+function nodeTypeFromType(type) {
+  if (type === _reactIs.Portal) {
+    return 'portal';
+  }
+
+  return (0, _enzymeAdapterUtils.nodeTypeFromType)(type);
+}
+
+function elementToTree(el) {
+  if (!(0, _reactIs.isPortal)(el)) {
+    return (0, _enzymeAdapterUtils.elementToTree)(el, elementToTree);
+  }
+
+  var children = el.children,
+      containerInfo = el.containerInfo;
+
+  var props = { children: children, containerInfo: containerInfo };
+
+  return {
+    nodeType: 'portal',
+    type: _reactIs.Portal,
+    props: props,
+    key: (0, _enzymeAdapterUtils.ensureKeyOrUndefined)(el.key),
+    ref: el.ref || null,
+    instance: null,
+    rendered: elementToTree(el.children)
+  };
+}
+
 function toTree(vnode) {
@@ -112,13 +139,23 @@ if (vnode == null) {
   // somewhere else. Should talk to sebastian about this perhaps
-  var node = (0, _reflection.findCurrentFiberUsingSlowPath)(vnode);
+  var node = (0, _findCurrentFiberUsingSlowPath2['default'])(vnode);
   switch (node.tag) {
-    case HostRoot:
-      // 3
+    case FiberTags.HostRoot:
       return childrenToTree(node.child);
-    case HostPortal:
+    case FiberTags.HostPortal:
       {
-        // 4
-        return childrenToTree(node.child);
+        var containerInfo = node.stateNode.containerInfo,
+            children = node.memoizedProps;
+
+        var props = { containerInfo: containerInfo, children: children };
+        return {
+          nodeType: 'portal',
+          type: _reactIs.Portal,
+          props: props,
+          key: (0, _enzymeAdapterUtils.ensureKeyOrUndefined)(node.key),
+          ref: node.ref,
+          instance: null,
+          rendered: childrenToTree(node.child)
+        };
       }
-    case ClassComponent:
+    case FiberTags.ClassComponent:
       return {
@@ -133,4 +170,3 @@ nodeType: 'class',
       };
-    case FunctionalComponent:
-      // 1
+    case FiberTags.FunctionalComponent:
       return {
@@ -145,5 +181,5 @@ nodeType: 'function',
       };
-    case HostComponent:
+
+    case FiberTags.HostComponent:
       {
-        // 5
         var renderedNodes = flatten(nodeAndSiblingsArray(node.child).map(toTree));
@@ -163,11 +199,21 @@ if (renderedNodes.length === 0) {
       }
-    case HostText:
-      // 6
+    case FiberTags.HostText:
       return node.memoizedProps;
-    case FragmentType: // 10
-    case Mode: // 11
-    case ContextProviderType: // 13
-    case ContextConsumerType:
-      // 12
+    case FiberTags.Fragment:
+    case FiberTags.Mode:
+    case FiberTags.ContextProvider:
+    case FiberTags.ContextConsumer:
       return childrenToTree(node.child);
+    case FiberTags.ForwardRef:
+      {
+        return {
+          nodeType: 'function',
+          type: node.type,
+          props: (0, _object2['default'])({}, node.pendingProps),
+          key: (0, _enzymeAdapterUtils.ensureKeyOrUndefined)(node.key),
+          ref: node.ref,
+          instance: null,
+          rendered: childrenToTree(node.child)
+        };
+      }
     default:
@@ -213,2 +259,7 @@ throw new Error('Enzyme Internal Error: unknown node with tag ' + String(node.tag));
 
+var eventOptions = {
+  animation: true,
+  pointerEvents: !!_react2['default'].unstable_Profiler // proxy for 16.4+
+};
+
 var ReactSixteenAdapter = function (_EnzymeAdapter) {
@@ -230,3 +281,7 @@ _inherits(ReactSixteenAdapter, _EnzymeAdapter);
         },
-        getSnapshotBeforeUpdate: true
+        getDerivedStateFromProps: true,
+        getSnapshotBeforeUpdate: true,
+        setState: {
+          skipsComponentDidUpdateOnNullish: true
+        }
       })
@@ -242,2 +297,6 @@ });
         (0, _enzymeAdapterUtils.assertDomAvailable)('mount');
+        if (FiberTags === null) {
+          // Requires DOM.
+          FiberTags = (0, _detectFiberTags2['default'])();
+        }
         var attachTo = options.attachTo,
@@ -248,2 +307,3 @@ hydrateIn = options.hydrateIn;
         var instance = null;
+        var adapter = this;
         return {
@@ -262,3 +322,3 @@ render: function () {
                 }, ref && { ref: ref });
-                var ReactWrapperComponent = (0, _enzymeAdapterUtils.createMountWrapper)(el, options);
+                var ReactWrapperComponent = (0, _enzymeAdapterUtils.createMountWrapper)(el, (0, _object2['default'])({}, options, { adapter: adapter }));
                 var wrappedEl = _react2['default'].createElement(ReactWrapperComponent, wrapperProps);
@@ -293,3 +353,3 @@ instance = hydrateIn ? _reactDom2['default'].hydrate(wrappedEl, domNode) : _reactDom2['default'].render(wrappedEl, domNode);
             function simulateEvent(node, event, mock) {
-              var mappedEvent = (0, _enzymeAdapterUtils.mapNativeEventNames)(event, { animation: true });
+              var mappedEvent = (0, _enzymeAdapterUtils.mapNativeEventNames)(event, eventOptions);
               var eventFn = _testUtils2['default'].Simulate[mappedEvent];
@@ -299,3 +359,2 @@ if (!eventFn) {
               }
-              // eslint-disable-next-line react/no-find-dom-node
               eventFn(_nodeToHostNode(node), mock);
@@ -368,7 +427,7 @@ }
               if (isDOM) {
-                return (0, _enzymeAdapterUtils.elementToTree)(cachedNode);
+                return elementToTree(cachedNode);
               }
               var output = renderer.getRenderOutput();
               return {
-                nodeType: (0, _enzymeAdapterUtils.nodeTypeFromType)(cachedNode.type),
+                nodeType: nodeTypeFromType(cachedNode.type),
                 type: cachedNode.type,
@@ -379,3 +438,5 @@ props: cachedNode.props,
                 instance: renderer._instance,
-                rendered: Array.isArray(output) ? flatten(output).map(_enzymeAdapterUtils.elementToTree) : (0, _enzymeAdapterUtils.elementToTree)(output)
+                rendered: Array.isArray(output) ? flatten(output).map(function (el) {
+                  return elementToTree(el);
+                }) : elementToTree(output)
               };
@@ -392,3 +453,3 @@ }
 
-              var handler = node.props[(0, _enzymeAdapterUtils.propFromEvent)(event)];
+              var handler = node.props[(0, _enzymeAdapterUtils.propFromEvent)(event, eventOptions)];
               if (handler) {
@@ -445,3 +506,3 @@ (0, _enzymeAdapterUtils.withSetStateAllowed)(function () {
     // specific, like `attach` etc. for React, but not part of this interface explicitly.
-    // eslint-disable-next-line class-methods-use-this, no-unused-vars
+    // eslint-disable-next-line class-methods-use-this
 
@@ -470,3 +531,3 @@ }, {
     // be pretty straightforward for people to implement.
-    // eslint-disable-next-line class-methods-use-this, no-unused-vars
+    // eslint-disable-next-line class-methods-use-this
 
@@ -487,3 +548,3 @@ }, {
       function elementToNode(element) {
-        return (0, _enzymeAdapterUtils.elementToTree)(element);
+        return elementToTree(element);
       }
@@ -490,0 +551,0 @@

package.json

 {
   "name": "enzyme-adapter-react-16",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "JavaScript Testing utilities for React",
@@ -37,3 +37,3 @@ "homepage": "http://airbnb.io/enzyme/",
   "dependencies": {
-    "enzyme-adapter-utils": "^1.5.0",
+    "enzyme-adapter-utils": "^1.6.0",
     "function.prototype.name": "^1.1.0",
@@ -44,3 +44,2 @@ "object.assign": "^4.1.0",
     "react-is": "^16.4.2",
-    "react-reconciler": "^0.7.0",
     "react-test-renderer": "^16.0.0-0"
@@ -58,7 +57,7 @@ },
     "enzyme": "^3.0.0",
-    "eslint": "^4.19.1",
-    "eslint-config-airbnb": "^17.0.0",
-    "eslint-plugin-import": "^2.13.0",
+    "eslint": "^5.4.0",
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-plugin-import": "^2.14.0",
     "eslint-plugin-jsx-a11y": "^6.1.1",
-    "eslint-plugin-react": "^7.10.0",
+    "eslint-plugin-react": "^7.11.1",
     "in-publish": "^2.0.0",
@@ -65,0 +64,0 @@ "rimraf": "^2.6.2",

README.md

@@ -46,3 +46,3 @@ Enzyme
 | `enzyme-adapter-react-16.2` | `~16.2` |
-| `enzyme-adapter-react-16.1` | `~16.0.0-0 || ~16.1` |
+| `enzyme-adapter-react-16.1` | `~16.0.0-0 \|\| ~16.1` |
 | `enzyme-adapter-react-15` | `^15.5.0` |
@@ -101,3 +101,3 @@ | `enzyme-adapter-react-15.4` | `15.0.0-0 - 15.4.x` |
 
-[Using Enzyme with WebPack](/docs/guides/webpack.md)
+[Using Enzyme with Webpack](/docs/guides/webpack.md)
 
@@ -131,3 +131,3 @@ [Using Enzyme with JSDOM](/docs/guides/jsdom.md)
     const wrapper = shallow(<MyComponent />);
-    expect(wrapper.find(Foo)).to.have.length(3);
+    expect(wrapper.find(Foo)).to.have.lengthOf(3);
   });
@@ -137,3 +137,3 @@
     const wrapper = shallow(<MyComponent />);
-    expect(wrapper.find('.icon-star')).to.have.length(1);
+    expect(wrapper.find('.icon-star')).to.have.lengthOf(1);
   });
@@ -140,0 +140,0 @@

src/ReactSixteenAdapter.js

@@ -13,2 +13,3 @@ /* eslint no-use-before-define: 0 */
   isElement,
+  isPortal,
   isValidElementType,
@@ -28,4 +29,4 @@ AsyncMode,
   displayNameOfNode,
-  elementToTree,
-  nodeTypeFromType,
+  elementToTree as utilElementToTree,
+  nodeTypeFromType as utilNodeTypeFromType,
   mapNativeEventNames,
@@ -40,14 +41,7 @@ propFromEvent,
 } from 'enzyme-adapter-utils';
-import { findCurrentFiberUsingSlowPath } from 'react-reconciler/reflection';
+import findCurrentFiberUsingSlowPath from './findCurrentFiberUsingSlowPath';
+import detectFiberTags from './detectFiberTags';
 
-const HostRoot = 3;
-const ClassComponent = 2;
-const FragmentType = 10;
-const FunctionalComponent = 1;
-const HostPortal = 4;
-const HostComponent = 5;
-const HostText = 6;
-const Mode = 11;
-const ContextConsumerType = 12;
-const ContextProviderType = 13;
+// Lazily populated if DOM is available.
+let FiberTags = null;
 
@@ -83,2 +77,29 @@ function nodeAndSiblingsArray(nodeWithSibling) {
 
+function nodeTypeFromType(type) {
+  if (type === Portal) {
+    return 'portal';
+  }
+
+  return utilNodeTypeFromType(type);
+}
+
+function elementToTree(el) {
+  if (!isPortal(el)) {
+    return utilElementToTree(el, elementToTree);
+  }
+
+  const { children, containerInfo } = el;
+  const props = { children, containerInfo };
+
+  return {
+    nodeType: 'portal',
+    type: Portal,
+    props,
+    key: ensureKeyOrUndefined(el.key),
+    ref: el.ref || null,
+    instance: null,
+    rendered: elementToTree(el.children),
+  };
+}
+
 function toTree(vnode) {
@@ -93,8 +114,21 @@ if (vnode == null) {
   switch (node.tag) {
-    case HostRoot: // 3
+    case FiberTags.HostRoot:
       return childrenToTree(node.child);
-    case HostPortal: { // 4
-      return childrenToTree(node.child);
+    case FiberTags.HostPortal: {
+      const {
+        stateNode: { containerInfo },
+        memoizedProps: children,
+      } = node;
+      const props = { containerInfo, children };
+      return {
+        nodeType: 'portal',
+        type: Portal,
+        props,
+        key: ensureKeyOrUndefined(node.key),
+        ref: node.ref,
+        instance: null,
+        rendered: childrenToTree(node.child),
+      };
     }
-    case ClassComponent:
+    case FiberTags.ClassComponent:
       return {
@@ -109,3 +143,3 @@ nodeType: 'class',
       };
-    case FunctionalComponent: // 1
+    case FiberTags.FunctionalComponent:
       return {
@@ -120,3 +154,4 @@ nodeType: 'function',
       };
-    case HostComponent: { // 5
+
+    case FiberTags.HostComponent: {
       let renderedNodes = flatten(nodeAndSiblingsArray(node.child).map(toTree));
@@ -136,9 +171,20 @@ if (renderedNodes.length === 0) {
     }
-    case HostText: // 6
+    case FiberTags.HostText:
       return node.memoizedProps;
-    case FragmentType: // 10
-    case Mode: // 11
-    case ContextProviderType: // 13
-    case ContextConsumerType: // 12
+    case FiberTags.Fragment:
+    case FiberTags.Mode:
+    case FiberTags.ContextProvider:
+    case FiberTags.ContextConsumer:
       return childrenToTree(node.child);
+    case FiberTags.ForwardRef: {
+      return {
+        nodeType: 'function',
+        type: node.type,
+        props: { ...node.pendingProps },
+        key: ensureKeyOrUndefined(node.key),
+        ref: node.ref,
+        instance: null,
+        rendered: childrenToTree(node.child),
+      };
+    }
     default:
@@ -184,2 +230,7 @@ throw new Error(`Enzyme Internal Error: unknown node with tag ${node.tag}`);
 
+const eventOptions = {
+  animation: true,
+  pointerEvents: !!React.unstable_Profiler, // proxy for 16.4+
+};
+
 class ReactSixteenAdapter extends EnzymeAdapter {
@@ -197,3 +248,7 @@ constructor() {
         },
+        getDerivedStateFromProps: true,
         getSnapshotBeforeUpdate: true,
+        setState: {
+          skipsComponentDidUpdateOnNullish: true,
+        },
       },
@@ -205,5 +260,10 @@ };
     assertDomAvailable('mount');
+    if (FiberTags === null) {
+      // Requires DOM.
+      FiberTags = detectFiberTags();
+    }
     const { attachTo, hydrateIn } = options;
     const domNode = hydrateIn || attachTo || global.document.createElement('div');
     let instance = null;
+    const adapter = this;
     return {
@@ -219,3 +279,3 @@ render(el, context, callback) {
           };
-          const ReactWrapperComponent = createMountWrapper(el, options);
+          const ReactWrapperComponent = createMountWrapper(el, { ...options, adapter });
           const wrappedEl = React.createElement(ReactWrapperComponent, wrapperProps);
@@ -240,3 +300,3 @@ instance = hydrateIn
       simulateEvent(node, event, mock) {
-        const mappedEvent = mapNativeEventNames(event, { animation: true });
+        const mappedEvent = mapNativeEventNames(event, eventOptions);
         const eventFn = TestUtils.Simulate[mappedEvent];
@@ -246,3 +306,2 @@ if (!eventFn) {
         }
-        // eslint-disable-next-line react/no-find-dom-node
         eventFn(nodeToHostNode(node), mock);
@@ -302,3 +361,3 @@ },
           rendered: Array.isArray(output)
-            ? flatten(output).map(elementToTree)
+            ? flatten(output).map(el => elementToTree(el))
             : elementToTree(output),
@@ -308,3 +367,3 @@ };
       simulateEvent(node, event, ...args) {
-        const handler = node.props[propFromEvent(event)];
+        const handler = node.props[propFromEvent(event, eventOptions)];
         if (handler) {
@@ -345,3 +404,3 @@ withSetStateAllowed(() => {
   // specific, like `attach` etc. for React, but not part of this interface explicitly.
-  // eslint-disable-next-line class-methods-use-this, no-unused-vars
+  // eslint-disable-next-line class-methods-use-this
   createRenderer(options) {
@@ -360,3 +419,3 @@ switch (options.mode) {
   // be pretty straightforward for people to implement.
-  // eslint-disable-next-line class-methods-use-this, no-unused-vars
+  // eslint-disable-next-line class-methods-use-this
   nodeToElement(node) {
@@ -363,0 +422,0 @@ if (!node || typeof node !== 'object') return null;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

59946

increased by40.08%

Dependency count

10

decreased by-9.09%

Number of package files

12

increased by50%

Lines of code

1320

increased by52.25%

Dependency changes

• - Removedreact-reconciler@^0.7.0

• - Removedasap@2.0.6(transitive)

• - Removedcore-js@1.2.7(transitive)

• - Removedencoding@0.1.13(transitive)

• - Removedfbjs@0.8.18(transitive)

• - Removedis-stream@1.1.0(transitive)

• - Removedisomorphic-fetch@2.2.1(transitive)

• - Removednode-fetch@1.7.3(transitive)

• - Removedpromise@7.3.1(transitive)

• - Removedreact-reconciler@0.7.0(transitive)

• - Removedsetimmediate@1.0.5(transitive)

• - Removedua-parser-js@0.7.39(transitive)

• - Removedwhatwg-fetch@3.6.20(transitive)

• Updatedenzyme-adapter-utils@^1.6.0