HoC props fix

jozsi · Jun 9, 2018 · fc03475 · fc03475
1 parent b1f12b0
commit fc03475
Show file tree

Hide file tree

Showing 4 changed files with 80 additions and 26 deletions.
diff --git a/lib/index.js b/lib/index.js
@@ -14,23 +14,50 @@ function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr
 
 function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
 
+var HOCPropsProxy = function HOCPropsProxy(props) {
+  var nextProxy = props.nextProxy,
+      fixture = props.fixture,
+      onComponentRef = props.onComponentRef,
+      onFixtureUpdate = props.onFixtureUpdate,
+      rest = _objectWithoutProperties(props, ["nextProxy", "fixture", "onComponentRef", "onFixtureUpdate"]);
+
+  var NextProxy = nextProxy.value,
+      next = nextProxy.next;
+
+  fixture.props = Object.assign({}, fixture.props, rest);
+
+  return _react2.default.createElement(NextProxy, {
+    fixture: fixture,
+    onComponentRef: onComponentRef,
+    onFixtureUpdate: onFixtureUpdate,
+    nextProxy: next()
+  });
+};
+
 exports.default = function (_ref) {
   var Component = _ref.component,
       props = _ref.props,
       fixtureKey = _ref.fixtureKey,
       hoc = _ref.hoc;
   return function WrapperProxy(_ref2) {
-    var _ref2$nextProxy = _ref2.nextProxy,
-        NextProxy = _ref2$nextProxy.value,
-        next = _ref2$nextProxy.next,
+    var nextProxy = _ref2.nextProxy,
         nextProps = _objectWithoutProperties(_ref2, ["nextProxy"]);
 
     var fixtureProps = nextProps.fixture[fixtureKey];
     var fixtureEnabled = !!fixtureProps;
-    var NextComponent = fixtureEnabled && hoc ? fixtureProps[Symbol.iterator] ? Component.apply(undefined, _toConsumableArray(fixtureProps))(NextProxy) : Component(NextProxy) : NextProxy;
-    var nextProxyEl = _react2.default.createElement(NextComponent, Object.assign({}, nextProps, { nextProxy: next() }));
 
-    return fixtureEnabled && !hoc ? _react2.default.createElement(
+    if (fixtureEnabled && hoc) {
+      var HOComponent = fixtureProps[Symbol.iterator] ? Component.apply(undefined, _toConsumableArray(fixtureProps))(HOCPropsProxy) : Component(HOCPropsProxy);
+
+      return _react2.default.createElement(HOComponent, Object.assign({}, nextProps, { nextProxy: nextProxy }));
+    }
+
+    var NextProxy = nextProxy.value,
+        next = nextProxy.next;
+
+    var nextProxyEl = _react2.default.createElement(NextProxy, Object.assign({}, nextProps, { nextProxy: next() }));
+
+    return fixtureEnabled ? _react2.default.createElement(
       Component,
       Object.assign({}, props, fixtureProps),
       nextProxyEl

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-cosmos-wrapper-proxy",
-  "version": "1.2.1",
+  "version": "1.3.0",
   "description": "Easily wrap components using react-cosmos",
   "main": "lib/index.js",
   "author": "Józsi <[email protected]>",

diff --git a/src/__tests__/hoc.js b/src/__tests__/hoc.js
@@ -11,13 +11,7 @@ const NextProxy = props => {
   return <P {...props} nextProxy={next()} />;
 };
 
-const LastProxy = ({
-  fixture: { component: C, props },
-  onComponentRef,
-  onFixtureUpdate,
-  nextProxy,
-  ...rest
-}) => <C {...rest} {...props} />;
+const LastProxy = ({ fixture: { component: C, props } }) => <C {...props} />;
 
 const HOComponent = WrappedComponent =>
   function WrapperComponent(props) {
@@ -112,6 +106,9 @@ describe("wrapped", () => {
     renderProxy(fixture);
   });
 
+  fixture.props = {
+    fromHoc: true
+  };
   commonTests(fixture);
 
   it("should wrap", () => {
@@ -134,6 +131,11 @@ describe("wrapped with parameters", () => {
     });
   });
 
+  fixture.props = {
+    fromHocTwo: true,
+    firstPassedProp: "hello",
+    secondPassedProp: "world"
+  };
   commonTests(fixture);
 
   it("should wrap", () => {

diff --git a/src/index.js b/src/index.js
@@ -1,21 +1,46 @@
 import React from "react";
 
+const HOCPropsProxy = props => {
+  const {
+    nextProxy,
+    fixture,
+    onComponentRef,
+    onFixtureUpdate,
+    ...rest
+  } = props;
+  const { value: NextProxy, next } = nextProxy;
+  fixture.props = {
+    ...fixture.props,
+    ...rest
+  };
+
+  return (
+    <NextProxy
+      fixture={fixture}
+      onComponentRef={onComponentRef}
+      onFixtureUpdate={onFixtureUpdate}
+      nextProxy={next()}
+    />
+  );
+};
+
 export default ({ component: Component, props, fixtureKey, hoc }) =>
-  function WrapperProxy({
-    nextProxy: { value: NextProxy, next },
-    ...nextProps
-  }) {
+  function WrapperProxy({ nextProxy, ...nextProps }) {
     const fixtureProps = nextProps.fixture[fixtureKey];
     const fixtureEnabled = !!fixtureProps;
-    const NextComponent =
-      fixtureEnabled && hoc
-        ? fixtureProps[Symbol.iterator]
-          ? Component(...fixtureProps)(NextProxy)
-          : Component(NextProxy)
-        : NextProxy;
-    const nextProxyEl = <NextComponent {...nextProps} nextProxy={next()} />;
 
-    return fixtureEnabled && !hoc ? (
+    if (fixtureEnabled && hoc) {
+      const HOComponent = fixtureProps[Symbol.iterator]
+        ? Component(...fixtureProps)(HOCPropsProxy)
+        : Component(HOCPropsProxy);
+
+      return <HOComponent {...nextProps} nextProxy={nextProxy} />;
+    }
+
+    const { value: NextProxy, next } = nextProxy;
+    const nextProxyEl = <NextProxy {...nextProps} nextProxy={next()} />;
+
+    return fixtureEnabled ? (
       <Component {...props} {...fixtureProps}>
         {nextProxyEl}
       </Component>