CHANGELOG.md

@@ -1,8 +1,12 @@
 # MobX-React Changelog
+### 5.3.6
+
+* Fixed some additional issues around life-cycle patching, take 3. See [#536](https://github.com/mobxjs/mobx-react/pull/586) by [@xaviergonz](https://github.com/xaviergonz). Fixed [#579](https://github.com/mobxjs/mobx-react/issues/579)
+
 
 ### 5.3.5
 
-* Fixed some additional issues around life-cycle patching, see [#538](https://github.com/mobxjs/mobx-react/pull/583) by [@xaviergonz](https://github.com/xaviergonz). Fixed [#581](https://github.com/mobxjs/mobx-react/issues/581)
+* Fixed some additional issues around life-cycle patching, see [#583](https://github.com/mobxjs/mobx-react/pull/583) by [@xaviergonz](https://github.com/xaviergonz). Fixed [#581](https://github.com/mobxjs/mobx-react/issues/581)
 
 ### 5.3.4
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mobx-react",
-  "version": "5.3.5",
+  "version": "5.3.6",
   "description": "React bindings for MobX. Create fully reactive components.",
   "main": "index.js",
   "jsnext:main": "index.module.js",

src/utils/utils.js

@@ -16,7 +16,6 @@ export function newSymbol(name) {
 
 const mobxMixins = newSymbol("patchMixins")
 const mobxPatchedDefinition = newSymbol("patchedDefinition")
-const mobxRealMethod = newSymbol("patchRealMethod")
 
 function getMixins(target, methodName) {
     const mixins = (target[mobxMixins] = target[mobxMixins] || {})
@@ -47,9 +46,9 @@ function wrapper(realMethod, mixins, ...args) {
     }
 }
 
-function wrapFunction(mixins) {
+function wrapFunction(realMethod, mixins) {
     const fn = function(...args) {
-        wrapper.call(this, fn[mobxRealMethod], mixins, ...args)
+        wrapper.call(this, realMethod, mixins, ...args)
     }
     return fn
 }
@@ -82,8 +81,7 @@ export function patch(target, methodName, ...mixinMethods) {
 }
 
 function createDefinition(target, methodName, enumerable, mixins, originalMethod) {
-    const wrappedFunc = wrapFunction(mixins)
-    wrappedFunc[mobxRealMethod] = originalMethod
+    let wrappedFunc = wrapFunction(originalMethod, mixins)
 
     return {
         [mobxPatchedDefinition]: true,
@@ -92,7 +90,7 @@ function createDefinition(target, methodName, enumerable, mixins, originalMethod
         },
         set: function(value) {
             if (this === target) {
-                wrappedFunc[mobxRealMethod] = value
+                wrappedFunc = wrapFunction(value, mixins)
             } else {
                 // when it is an instance of the prototype/a child prototype patch that particular case again separately
                 // since we need to store separate values depending on wether it is the actual instance, the prototype, etc

test/patch.test.js

@@ -275,3 +275,88 @@ describe("inheritance with arrow functions", async () => {
         }
     }
 })
+
+test("custom decorator #579", async () => {
+    async function doTest(customFirst) {
+        const customDidMount = jest.fn()
+        const customConstruct = jest.fn()
+
+        function logMountingPerformance() {
+            return target => {
+                var original = target
+                var instance
+
+                // a utility function to generate instances of a class
+                function construct(oldConstructor, args) {
+                    var c = function() {
+                        return oldConstructor.apply(this, args)
+                    }
+                    c.prototype = oldConstructor.prototype
+                    instance = new c()
+
+                    customConstruct()
+                    return instance
+                }
+
+                // the new constructor behaviour
+                var f = function(...args) {
+                    return construct(original, args)
+                }
+
+                var originalComponentDidMount = original.prototype.componentDidMount
+                // copy prototype so intanceof operator still works
+                f.prototype = original.prototype
+
+                f.prototype.componentDidMount = function() {
+                    var returnValue
+                    if (originalComponentDidMount) {
+                        returnValue = originalComponentDidMount.apply(instance)
+                    }
+                    customDidMount()
+                    return returnValue
+                }
+
+                // return new constructor (will override original)
+                return f
+            }
+        }
+
+        const cdm = jest.fn()
+        const cwu = jest.fn()
+        let cdmCalls = 0
+        let cwuCalls = 0
+
+        class C extends React.Component {
+            componentDidMount() {
+                cdmCalls++
+            }
+            componentWillUnmount() {
+                cwuCalls++
+            }
+            render() {
+                return null
+            }
+        }
+        if (customFirst) {
+            C = logMountingPerformance()(C)
+        }
+        patch(C.prototype, "componentDidMount", cdm)
+        patch(C.prototype, "componentWillUnmount", cwu)
+        if (!customFirst) {
+            C = logMountingPerformance()(C)
+        }
+
+        expect(customConstruct).toHaveBeenCalledTimes(0)
+        expect(customDidMount).toHaveBeenCalledTimes(0)
+
+        await testComponent(C, cdm, cwu)
+        expect(cdmCalls).toBe(1)
+        expect(cwuCalls).toBe(1)
+
+        expect(customConstruct).toHaveBeenCalledTimes(1)
+        expect(customDidMount).toHaveBeenCalledTimes(1)
+    }
+
+    await doTest(true)
+    await doTest(false)
+})