Add error handler to video element

[ayinloya]

Handle video abort error and not report to sentry

[prfectionist]

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 2 🔵🔵⚪⚪⚪

🧪 No relevant tests

🔒 No security concerns identified

⚡ Recommended focus areas for review Code Duplication The error handling pattern is duplicated across multiple components. Consider extracting the video error handling logic into a shared utility function. Resource Cleanup Verify that video and canvas elements are properly cleaned up when errors occur to prevent memory leaks and resource issues Error Handling The try-catch block may catch errors that should be handled differently than stream errors. Consider more specific error handling.

[prfectionist]

PR Code Suggestions ✨

Explore these optional code suggestions:

Category	Suggestion	Score
Best practice	Release media resources when errors occur to prevent camera from staying active Add cleanup logic to release media resources when error occurs. Call stream.getTracks().forEach(track => track.stop()) to stop camera access if an error happens. packages/web-components/components/document/src/document-capture/DocumentCapture.js [410-414] } catch (error) { if (error.name !== 'AbortError') { console.error(error); } + if (stream) { + stream.getTracks().forEach(track => track.stop()); + } } Suggestion importance[1-10]: 9 Why: This is a critical improvement that prevents memory leaks and ensures proper cleanup of camera resources when errors occur. Not releasing media tracks can lead to the camera staying active unnecessarily.	9
Enhancement	Simplify asynchronous code flow using async/await pattern Consider using async/await pattern instead of promise chaining for better error handling and code readability. packages/smart-camera-web/smart-camera-web.js [1602-1613] -navigator.mediaDevices - .getUserMedia({ audio: false, video: true }) - .then((stream) => { - try { - this.handleSuccess(stream); - } catch (error) { - this.handleError(error); - } - }) - .catch((e) => { - this.handleError(e); - }); +try { + const stream = await navigator.mediaDevices.getUserMedia({ audio: false, video: true }); + await this.handleSuccess(stream); +} catch (error) { + this.handleError(error); +} Suggestion importance[1-10]: 5 Why: While the suggestion would improve code readability, the current promise-based implementation is functionally correct and the change is primarily stylistic. The error handling is already properly implemented in both versions.	5

[solnsubuga]

looks good!