add the errorContext prop to the ErrorBoundary component

[eloytoro]

Motivation

This is a simple, yet useful, change. Giving customers the ability to pass an errorContext prop to the ErrorBoundary component could improve the triaging experiencing of the error. Take this for example:

function List() {
  return (
    <div>
      <ErrorBoundary errorContext={{ item: 0 }}>
        <ListItem id={0} />
      </ErrorBoundary>
      <ErrorBoundary errorContext={{ item: 1 }}>
        <ListItem id={1} />
      </ErrorBoundary>
    </div>
  );
}

In the component above both ListItem elements are capable of producing an error, and when doing so they would both have the same componentStack reported by react, but since the item prop was added to the error’s context then in Datadog it would be possible to determine which component threw the error.

Changes

• Take errorContext as a prop by the ErrorBoundary
• Add the context to the payload sent by the SDK

Testing

• Local
• Staging
• Unit
• End to end

---

I have gone over the contributing documentation.

[BenoitZugmeyer]

💬 suggestion: ‏add the context parameter at the end, so we can make it optional + avoid a breaking change

Suggested change

	export function addReactError(error: Error, context: object | undefined, info: ErrorInfo) {
	export function addReactError(error: Error, info: ErrorInfo, context?: object) {