Mi problema brevemente: de alguna manera quiero recopilar estados de componentes defectuosos usando ErrorBoundary.

Uso el componente ErrorBoundary típico en el proyecto. Algo como esto:

 class ErrorBoundary extends React.Component { constructor(props) { super(props); this.state = { hasError: false, }; } static getDerivedStateFromError(error) { return { hasError: true }; } componentDidCatch(error, errorInfo) { let errorLogger = new ErrorLoger(); errorLogger.sendError(error.message, errorInfo, this.props.children.props); } render() { if (this.state.hasError) { return (<p>Something went wrong. Please try again later</p>); } return this.props.children; } export default ErrorBoundary;

ErrorLoger es una clase que uso para enviar errores a un servicio externo.

Envuelvo mis componentes funcionales y de clase alrededor del proyecto de esta manera:

 <ErrorBoundary> <Footer/> </ErrorBoundary>

Cuando se detecta un error, obtengo información sobre el componente defectuoso y puedo encontrar la línea exacta que rompió el renderizado.

Pero para los errores que no puedo reproducir localmente, sería crucial registrar el estado o incluso algunas propiedades clave, pero no puedo encontrar la manera de implementar esto.