react-inspector - npm Package Compare versions

Comparing version 2.1.6 to 2.2.0-alpha.0

lib/object-inspector/ObjectInspector.spec.js

@@ -7,10 +7,6 @@ 'use strict';
 
-var _reactAddonsTestUtils = require('react-addons-test-utils');
+var _shallow = require('react-test-renderer/shallow');
 
-var _reactAddonsTestUtils2 = _interopRequireDefault(_reactAddonsTestUtils);
+var _shallow2 = _interopRequireDefault(_shallow);
 
-var _expect = require('expect');
-
-var _expect2 = _interopRequireDefault(_expect);
-
 var _ObjectInspector = require('./ObjectInspector');
@@ -22,14 +18,12 @@
 
-var renderer = _reactAddonsTestUtils2.default.createRenderer();
+var TestRenderer = new _shallow2.default();
 
 describe('ObjectInspector', function () {
-  beforeEach(function () {});
-
   it('should render', function () {
-    renderer.render(_react2.default.createElement(_ObjectInspector2.default, { theme: 'testvalue' }));
-    var tree = renderer.getRenderOutput();
+    var tree = TestRenderer.render(_react2.default.createElement(_ObjectInspector2.default, { theme: 'testvalue' }));
 
-    (0, _expect2.default)(tree.type).toBeA('function');
+    expect(tree).toMatchSnapshot();
 
-    (0, _expect2.default)(tree.props.theme).toEqual('testvalue');
+    expect(tree.type).toBeInstanceOf(Function);
+    expect(tree.props.theme).toEqual('testvalue');
   });
@@ -40,11 +34,15 @@
     var nodeRenderer = function nodeRenderer() {
-      return null;
+      return _react2.default.createElement(
+        'span',
+        null,
+        'unit test'
+      );
     };
-    renderer.render(_react2.default.createElement(_ObjectInspector2.default, { nodeRenderer: nodeRenderer }));
-    var tree = renderer.getRenderOutput();
+    var tree = TestRenderer.render(_react2.default.createElement(_ObjectInspector2.default, { nodeRenderer: nodeRenderer }));
 
-    (0, _expect2.default)(tree.props.children.type).toBeA('function');
+    expect(tree).toMatchSnapshot();
 
-    (0, _expect2.default)(tree.props.children.props.nodeRenderer).toEqual(nodeRenderer);
+    expect(tree.props.children.type).toBeInstanceOf(Function);
+    expect(tree.props.children.props.nodeRenderer).toEqual(nodeRenderer);
   });
 });

lib/object/ObjectName.spec.js

@@ -7,10 +7,6 @@ 'use strict';
 
-var _reactAddonsTestUtils = require('react-addons-test-utils');
+var _reactTestRenderer = require('react-test-renderer');
 
-var _reactAddonsTestUtils2 = _interopRequireDefault(_reactAddonsTestUtils);
+var _reactTestRenderer2 = _interopRequireDefault(_reactTestRenderer);
 
-var _expect = require('expect');
-
-var _expect2 = _interopRequireDefault(_expect);
-
 var _ObjectName = require('./ObjectName');
@@ -20,45 +16,21 @@
 
-var _chromeLight = require('../styles/themes/chromeLight');
-
-var _chromeLight2 = _interopRequireDefault(_chromeLight);
-
-var _base = require('../styles/base');
-
-var _base2 = _interopRequireDefault(_base);
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var defaultTheme = (0, _base2.default)(_chromeLight2.default);
-
-var renderer = _reactAddonsTestUtils2.default.createRenderer();
-
 describe('ObjectName', function () {
-  beforeEach(function () {});
-
   it('should render', function () {
-    renderer.render(_react2.default.createElement(_ObjectName2.default, { name: 'testvalue' }));
-    var tree = renderer.getRenderOutput();
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectName2.default, { name: 'testvalue' }));
 
-    (0, _expect2.default)(tree.type).toEqual('span');
+    expect(tree).toMatchSnapshot();
   });
 
-  it('should apply default theme', function () {
-    renderer.render(_react2.default.createElement(_ObjectName2.default, { name: 'testvalue' }));
-    var tree = renderer.getRenderOutput();
-
-    (0, _expect2.default)(tree.props.style).toInclude(defaultTheme.ObjectName.base);
-  });
-
   it('should apply dimming if `dimmed` prop is true', function () {
-    renderer.render(_react2.default.createElement(_ObjectName2.default, { name: 'testvalue', dimmed: true }));
-    var tree = renderer.getRenderOutput();
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectName2.default, { name: 'testvalue', dimmed: true }));
 
-    (0, _expect2.default)(tree.props.style).toInclude(defaultTheme.ObjectName.dimmed);
+    expect(tree).toMatchSnapshot();
   });
 
   it('should not apply dimming if `dimmed` prop is false', function () {
-    renderer.render(_react2.default.createElement(_ObjectName2.default, { name: 'testvalue', dimmed: false }));
-    var tree = renderer.getRenderOutput();
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectName2.default, { name: 'testvalue', dimmed: false }));
 
-    (0, _expect2.default)(tree.props.style).toExclude(defaultTheme.ObjectName.dimmed);
+    expect(tree).toMatchSnapshot();
   });
@@ -68,8 +40,7 @@
     // Test that a custom `style` props is passed and applied to <span/>
-    var style = { color: 'blue' };
-    renderer.render(_react2.default.createElement(_ObjectName2.default, { styles: style }));
-    var tree = renderer.getRenderOutput();
+    var style = { color: 'hotpink' };
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectName2.default, { styles: style }));
 
-    (0, _expect2.default)(tree.props.style.color).toEqual('blue');
+    expect(tree).toMatchSnapshot();
   });
 });

lib/object/ObjectValue.spec.js

@@ -7,10 +7,6 @@ 'use strict';
 
-var _reactAddonsTestUtils = require('react-addons-test-utils');
+var _reactTestRenderer = require('react-test-renderer');
 
-var _reactAddonsTestUtils2 = _interopRequireDefault(_reactAddonsTestUtils);
+var _reactTestRenderer2 = _interopRequireDefault(_reactTestRenderer);
 
-var _expect = require('expect');
-
-var _expect2 = _interopRequireDefault(_expect);
-
 var _ObjectValue = require('./ObjectValue');
@@ -22,47 +18,36 @@
 
-var renderer = _reactAddonsTestUtils2.default.createRenderer();
-
 describe('ObjectValue', function () {
-  beforeEach(function () {});
-
   it('should render', function () {
-    // console.log(ObjectValue)
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: 0 }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: 0 }));
+    expect(tree).toMatchSnapshot();
   });
 
   it('should render number', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: 0 }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual(0);
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: 0 })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['0']);
   });
 
   it('should render string with quotes', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: 'octocat' }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual(['"', 'octocat', '"']);
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: 'octocat' })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['"', 'octocat', '"']);
   });
 
   it('should render boolean', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: true }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('true');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: true })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['true']);
   });
 
   it('should render undefined', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: undefined }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('undefined');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: undefined })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['undefined']);
   });
 
   it('should render null', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: null }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('null');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: null })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['null']);
   });
@@ -73,27 +58,23 @@
     var date = new Date(dateString);
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: date }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual(date.toString());
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: date })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual([date.toString()]);
   });
 
   it('should render array with length information', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: [1, 2, 3, 4, 5] }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('Array[5]');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: [1, 2, 3, 4, 5] })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['Array[5]']);
   });
 
   it('should render an empty object', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: {} }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('Object');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: {} })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['Object']);
   });
 
   it('should render a simple object', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: { k: 'v' } }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('Object');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: { k: 'v' } })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['Object']);
   });
@@ -106,8 +87,8 @@
     expect(tree.type).toBe('span')
-    // const n = tree.props.children[1].props.children[1]
+    // const n = tree.children[1].props.children[1]
     // console.log(JSON.stringify(n, null, 2))
     // console.log(typeof n)
-    // console.log(tree.props.children[1].props.children)
-    expect(tree.props.children[0]).toEqual(<span style={objectStyles.value.function.keyword}>function</span>)
-    expect(tree.props.children[1]).toEqual(<span style={objectStyles.value.function.name}>{[ '\xa0', 'object', '()' ]}</span>)
+    // console.log(tree.children[1].props.children)
+    expect(tree.children[0]).toEqual(<span style={objectStyles.value.function.keyword}>function</span>)
+    expect(tree.children[1]).toEqual(<span style={objectStyles.value.function.name}>{[ '\xa0', 'object', '()' ]}</span>)
   });
@@ -121,3 +102,3 @@ */
     expect(tree.type).toBe('span')
-    expect(tree.props.children).toEqual([
+    expect(tree.children).toEqual([
                                           <span style={objectStyles.value.function.keyword}>function</span>,
@@ -130,13 +111,11 @@ <span style={objectStyles.value.function.name}>{[ '\xa0', 'id', '()' ]}</span>
   it('should render a symbol', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: Symbol() }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('Symbol()');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: Symbol() })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['Symbol()']);
   });
 
   it('should render a symbol foo', function () {
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { object: Symbol('foo') }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.type).toBe('span');
-    (0, _expect2.default)(tree.props.children).toEqual('Symbol(foo)');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { object: Symbol('foo') })).toJSON();
+    expect(tree.type).toBe('span');
+    expect(tree.children).toEqual(['Symbol(foo)']);
   });
@@ -147,6 +126,5 @@
     var style = { color: 'blue' };
-    renderer.render(_react2.default.createElement(_ObjectValue2.default, { styles: style, object: '' }));
-    var tree = renderer.getRenderOutput();
-    (0, _expect2.default)(tree.props.style.color).toEqual('blue');
+    var tree = _reactTestRenderer2.default.create(_react2.default.createElement(_ObjectValue2.default, { styles: style, object: '' })).toJSON();
+    expect(tree.props.style.color).toEqual('blue');
   });
 });

package.json

 {
   "name": "react-inspector",
-  "version": "2.1.6",
+  "version": "2.2.0-alpha.0",
   "description": "Power of Browser DevTools inspectors right inside your React app",
-  "main": "lib/index.js",
-  "scripts": {
-    "storybook": "start-storybook -p 9001",
-    "build:storybook": "build-storybook -o storybook-static",
-    "build": "babel src --out-dir lib && webpack --config webpack.prod.config.js",
-    "lint": "eslint src --fix",
-    "test": "mocha src --compilers js:babel-register --recursive",
-    "test:watch": "npm run test -- --watch",
-    "clean": "rimraf lib",
-    "prerelease": "npm run lint && npm run test && npm run clean && npm run build",
-    "release": "npm publish . --access public"
-  },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/xyc/react-inspector.git"
-  },
   "keywords": [
+    "devtools",
+    "inspector",
+    "object",
+    "object-inspector",
     "react",
+    "react-component",
     "reactjs",
-    "object",
-    "object-inspector",
+    "table",
     "table-inspector",
-    "treeview",
+    "table-view",
     "tableview",
+    "tree",
     "tree-view",
-    "table-view",
-    "tree",
-    "table",
-    "view",
-    "inspector",
-    "react-component",
+    "treeview",
     "ui",
-    "devtools"
+    "view"
   ],
-  "author": "Xiaoyi Chen <[e-mail]> (http://github.com/xyc)",
-  "license": "MIT",
+  "homepage": "https://github.com/xyc/react-inspector",
   "bugs": {
     "url": "https://github.com/xyc/react-inspector/issues"
   },
-  "homepage": "https://github.com/xyc/react-inspector",
+  "license": "MIT",
+  "author": "Xiaoyi Chen <[e-mail]> (http://github.com/xyc)",
+  "main": "lib/index.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/xyc/react-inspector.git"
+  },
+  "scripts": {
+    "build": "babel src --out-dir lib && webpack --config webpack.prod.config.js",
+    "build:storybook": "build-storybook -o storybook-static",
+    "clean": "rimraf lib",
+    "lint": "eslint src --fix",
+    "prerelease": "npm run lint && npm run test && npm run clean && npm run build",
+    "release": "npm publish . --access public",
+    "storybook": "start-storybook -p 9001",
+    "test": "jest src",
+    "test:watch": "npm run test -- --watch"
+  },
+  "dependencies": {
+    "babel-runtime": "^6.26.0",
+    "is-dom": "^1.0.9"
+  },
   "devDependencies": {
-    "@kadira/storybook": "^2.35.3",
-    "babel-cli": "^6.24.1",
-    "babel-core": "^6.24.1",
-    "babel-eslint": "^7.2.3",
-    "babel-loader": "^7.0.0",
+    "@storybook/react": "^3.2.11",
+    "babel-cli": "^6.26.0",
+    "babel-core": "^6.26.0",
+    "babel-eslint": "^8.0.1",
+    "babel-loader": "^7.1.2",
     "babel-plugin-transform-runtime": "^6.23.0",
@@ -55,31 +59,25 @@ "babel-preset-es2015": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
-    "babel-register": "^6.24.1",
-    "core-js": "^2.4.1",
-    "css-loader": "^0.28.1",
-    "enzyme": "^2.8.2",
-    "eslint": "^4.1.1",
-    "eslint-plugin-jasmine": "^2.6.2",
-    "eslint-plugin-react": "^7.1.0",
-    "expect": "^1.20.2",
-    "jasmine-core": "^2.6.1",
-    "mocha": "^3.3.0",
-    "prettier": "^1.3.0",
-    "prop-types": "^15.5.9",
-    "react": "^15.5.4",
-    "react-addons-test-utils": "^15.5.1",
-    "react-dom": "^15.5.4",
+    "babel-register": "^6.26.0",
+    "core-js": "^2.5.1",
+    "css-loader": "^0.28.7",
+    "eslint": "^4.7.2",
+    "eslint-plugin-jasmine": "^2.8.4",
+    "eslint-plugin-react": "^7.4.0",
+    "expect": "^21.2.1",
+    "jest": "^21.2.1",
+    "prettier": "^1.7.2",
+    "prop-types": "^15.6.0",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0",
     "react-hot-loader": "^1.3.1",
-    "rebug": "0.0.3",
-    "rimraf": "^2.6.1",
+    "react-test-renderer": "^16.0.0",
+    "rebug": "^0.0.3",
+    "rimraf": "^2.6.2",
     "style-loader": "^0.18.2",
-    "webpack": "^3.1.0",
-    "webpack-dev-server": "^2.4.5"
+    "webpack": "^3.6.0",
+    "webpack-dev-server": "^2.9.1"
   },
   "peerDependencies": {
-    "react": "^0.14.0 || ^15.0.0-0"
-  },
-  "dependencies": {
-    "babel-runtime": "^6.23.0",
-    "is-dom": "^1.0.9"
+    "react": "react@^0.14.0 || ^15.0.0 || ^16.0.0"
   }
 }

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

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

369155

increased by12.29%

Dev dependency count

28

decreased by-6.67%

Number of package files

36

increased by2.86%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Lines of code

2579

decreased by-1.26%

Number of low quality alerts

1

increased byInfinity%

Dependency changes

• + Addedreact@16.14.0(transitive)

• - Removedasap@2.0.6(transitive)

• - Removedcore-js@1.2.7(transitive)

• - Removedcreate-react-class@15.7.0(transitive)

• - Removedencoding@0.1.13(transitive)

• - Removedfbjs@0.8.18(transitive)

• - Removediconv-lite@0.6.3(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@15.7.0(transitive)

• - Removedsafer-buffer@2.1.2(transitive)

• - Removedsetimmediate@1.0.5(transitive)

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

• - Removedwhatwg-fetch@3.6.20(transitive)

• Updatedbabel-runtime@^6.26.0