react-render-visualizer-decorator - npm Package Compare versions

Comparing version 0.3.0 to 0.4.0

index.js

@@ -7,2 +7,6 @@ 'use strict';
 function visualizeRender (component) {
+    var originalComponentDidMount = component.prototype.componentDidMount;
+    var originalComponentDidUpdate = component.prototype.componentDidUpdate;
+    var originalComponentWillUnmount = component.prototype.componentWillUnmount;
+
     component.prototype.UPDATE_RENDER_LOG_POSITION_TIMEOUT_MS = 500;
@@ -66,2 +70,6 @@ component.prototype.MAX_LOG_LENGTH = 20;
         );
+
+        if (typeof originalComponentDidMount === 'function') {
+            originalComponentDidMount.call(this);
+        }
     };
@@ -78,2 +86,6 @@
         this._highlightChange(this.STATE_CHANGES.UPDATE);
+
+        if (typeof originalComponentDidUpdate === 'function') {
+            originalComponentDidUpdate.call(this, arguments);
+        }
     };
@@ -87,2 +99,6 @@
         clearInterval(this._updateRenderLogPositionTimeout);
+
+        if (typeof originalComponentWillUnmount === 'function') {
+            originalComponentWillUnmount.call(this);
+        }
     };
@@ -307,4 +323,6 @@
     component._updateRenderLogPositionTimeout = null;
+    
+    return component;
 }
 
 module.exports = visualizeRender;

package.json

 {
   "name": "react-render-visualizer-decorator",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Render visualizer decorator for ReactJS",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -0,1 +1,8 @@
+----------------------
+
+## Deprecated!
+This repo is depreacted. The library was renamed to *react-render-debugger* and is available here: <https://github.com/marcin-mazurek/react-render-debugger>
+
+------------------------
+
 React Render Visualizer Decorator
@@ -5,4 +12,6 @@ ============
 
-ES7 decorator version ported from <https://github.com/redsunsoft/react-render-visualizer>
+Decorator (experimental ES201x syntax) version ported from <https://github.com/redsunsoft/react-render-visualizer>
 
+[Learn more about the experimental decorator syntax](https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy#why-legacy).
+
 Features
@@ -29,3 +38,11 @@ --------
 
+// Use with the decorator syntax (experimental)
 @visualizeRender
+export default class TodoItem extends Component {
+    render () {
+        // ...
+    }
+}
+
+// Or simply passing the component to the function
 class TodoItem extends Component {
@@ -36,2 +53,4 @@ render () {
 }
+
+export default visualizeRender(TodoItem);
 ```
@@ -43,2 +62,7 @@ Component will show up with a blue border box when being monitored.
 ----
-![demo](https://cloud.githubusercontent.com/assets/3999910/6566152/ba047a42-c673-11e4-9833-1e78de51abc1.gif)
+See a demo page: <http://react-render-visualizer-decorator.netlify.com/>
+
+Similar libraries
+-----------------
+
+* [mobx-react-devtools](https://github.com/mobxjs/mobx-react-devtools)

Fixed alerts

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

16370

increased by6.36%

Lines of code

267

increased by5.12%

Number of medium maintenance alerts

0

decreased by-100%

Number of lines in readme file

65

increased by62.5%

No dependency changes