composability & referential stability in useErrorBoundary

hooks/src/index.js

@@ -268,18 +268,17 @@ export function useErrorBoundary(cb) {
 	const state = getHookState(currentIndex++, 10);
 	const errState = useState();
 	state._value = cb;
-	if (!currentComponent.componentDidCatch) {
+	if (!state._reset) {
+		const previousDidCatch = currentComponent.componentDidCatch;
 		currentComponent.componentDidCatch = err => {
 			if (state._value) state._value(err);
+			if (previousDidCatch) previousDidCatch.call(currentComponent, err);
 			errState[1](err);
 		};
+		state._reset = () => errState[1]();
 	}
-	return [
-		errState[0],
-		() => {
-			errState[1](undefined);
-		}
-	];
+
+	return [errState[0], state._reset];
 }
 
 /**

hooks/test/browser/errorBoundary.test.js

@@ -89,4 +89,62 @@ describe('errorBoundary', () => {
 		expect(spy2).to.be.calledOnce;
 		expect(spy2).to.be.calledWith(error);
 	});
+
+	it('ensures referential stability of `reset`', () => {
+		const resets = [];
+
+		const Test = () => {
+			const [, reset] = useErrorBoundary();
+
+			resets.push(reset);
+			return null;
+		};
+
+		render(<Test />, scratch);
+		rerender();
+		render(<Test />, scratch);
+		rerender();
+
+		expect(resets[0]).to.equal(resets[1]);
+	});
+
+	it('can be called multiple times in a single component, idependently', () => {
+		const spy = sinon.spy(),
+			spy2 = sinon.spy();
+		let resetErr;
+		const error = new Error('test');
+		const Throws = () => {
+			throw error;
+		};
+
+		const App = props => {
+			const [err, reset] = useErrorBoundary(props.onError);
+			const [err2] = useErrorBoundary(props.onError2);
+			resetErr = reset;
+
+			return (
+				<div>
+					{err && <p>Error</p>}
+					{err2 && <p>Error2</p>}
+					{err || err2 ? null : <Throws />}
+				</div>
+			);
+		};
+
+		render(<App onError={spy} onError2={spy2} />, scratch);
+		rerender();
+		expect(scratch.innerHTML).to.equal('<div><p>Error</p><p>Error2</p></div>');
+		expect(spy).to.be.calledOnce;
+		expect(spy).to.be.calledWith(error);
+		expect(spy2).to.be.calledOnce;
+		expect(spy2).to.be.calledWith(error);
+
+		resetErr();
+		rerender();
+		expect(scratch.innerHTML).to.equal('<div><p>Error2</p></div>');
+		expect(spy).to.be.calledOnce;
+		expect(spy).to.be.calledWith(error);
+		expect(spy2).to.be.calledOnce;
+		expect(spy2).to.be.calledWith(error);
+	});
 });