react-error-boundary - npm Package Compare versions

Comparing version 1.2.3 to 1.2.4

package.json

 {
   "name": "react-error-boundary",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "Sample reusable React error boundary component for React 16+",
@@ -24,3 +24,3 @@ "homepage": "https://github.com/bvaughn/react-error-boundary",
     "prettier": "prettier --config .prettierrc --write \"src/**/*.js\"",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "jest"
   },
@@ -33,2 +33,3 @@ "author": "Brian Vaughn <[e-mail]>",
     "babel-eslint": "^8.0.1",
+    "babel-jest": "^23.4.2",
     "babel-loader": "^7.1.1",
@@ -45,2 +46,4 @@ "babel-plugin-flow-react-proptypes": "^3.4.2",
     "cross-env": "^5.0.1",
+    "enzyme": "^3.5.0",
+    "enzyme-adapter-react-16": "^1.3.0",
     "eslint": "^4.2.0",
@@ -55,4 +58,8 @@ "eslint-config-fbjs": "^2.0.0",
     "flow-bin": "^0.57.3",
+    "jest": "^23.5.0",
     "prettier": "^1.7.4",
     "prop-types": "^15.5.10",
+    "react": "^16.4.2",
+    "react-dom": "^16.4.2",
+    "react-test-renderer": "^16.4.2",
     "rimraf": "^2.6.1",
@@ -59,0 +66,0 @@ "webpack": "^3.3.0"

README.md

@@ -1,8 +0,18 @@
-# react-error-boundary
+react-error-boundary
+====================
 
-Sample reusable React error boundary component for React 16+
+**A simple, reusable React error boundary component for React 16+.**
 
-The simplest way to use a boundary is to wrap it around any component that may throw an error.
-This will handle errors thrown by that component's descendants also.
+[![NPM registry](https://img.shields.io/npm/v/react-error-boundary.svg?style=for-the-badge)](https://yarnpkg.com/en/package/react-error-boundary)
+[![NPM license](https://img.shields.io/npm/l/react-error-boundary.svg?style=for-the-badge)](LICENSE)
 
+React [v16](https://reactjs.org/blog/2017/09/26/react-v16.0.html) introduced the concept of [“error boundaries”](https://reactjs.org/docs/error-boundaries.html).
+
+This component provides a simple and reusable wrapper that you can use to wrap around your components. Any rendering errors in your components hierarchy can then be gracefully handled.
+
+# Usage
+
+The simplest way to use `<ErrorBoundary>` is to wrap it around any component that may throw an error.
+This will handle errors thrown by that component and its descendants too.
+
 ```jsx
@@ -16,3 +26,3 @@ import ErrorBoundary from 'react-error-boundary';
 
-You can react to errors (eg for logging) by providing an `onError` callback:
+You can react to errors (e.g. for logging) by providing an `onError` callback:
 
@@ -23,3 +33,4 @@ ```jsx
 const myErrorHandler = (error: Error, componentStack: string) => {
-  // ...
+  // Do something with the error
+  // E.g. log to an error logging client here
 };
@@ -32,8 +43,15 @@
 
-You can also customize the fallback appearance:
+You can also customize the fallback component’s appearance:
 
 ```jsx
+import { ErrorBoundary } from 'react-error-boundary';
+
 const MyFallbackComponent = ({ componentStack, error }) => (
-  <div/>
-)
+  <div>
+    <p><strong>Oops! An error occured!</strong></p>
+    <p>Here’s what we know…</p>
+    <p><strong>Error:</strong> {error.toString()}</p>
+    <p><strong>Stacktrace:</strong> {componentStack}</p>
+  </div>
+);
 
@@ -45,12 +63,17 @@ <ErrorBoundary FallbackComponent={MyFallbackComponent}>
 
-You can also use it as a HOC:
+You can also use it as a [higher-order component](https://reactjs.org/docs/higher-order-components.html):
 
 ```jsx
-import {withErrorBoundary} from 'react-error-boundary';
+import { ErrorBoundaryFallbackComponent, withErrorBoundary } from 'react-error-boundary';
 
 const ComponentWithErrorBoundary = withErrorBoundary(
-  ComponentToDecorate: Element<any>,
-  CustomFallbackComponent: ?Element<any>,
-  onErrorHandler: ?(error: Error, componentStack: string) => void,
+  ComponentThatMayError,
+  ErrorBoundaryFallbackComponent, // Or pass in your own fallback component
+  onErrorHandler: (error, componentStack) => {
+    // Do something with the error
+    // E.g. log to an error logging client here
+  },
 );
-```
+
+<ComponentWithErrorBoundary />
+```

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

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

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

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

76

increased by46.15%

Worsened metrics

Total package byte prevSize

6636

decreased by-92.01%

Dev dependency count

34

increased by25.93%

Number of package files

4

decreased by-63.64%

Lines of code

15

decreased by-99.01%

No dependency changes