Add onClose callback (or equiv) to showReportDialog

[phayes]

Problem Statement

I want to be able to take an action after a user has closed the report-dialog (opened via showReportDialog).

Specifically, after my javascript application has crashed (gotten into a unknown and likely corrupted state) I pop the report dialog via the showReportDialog. After the user either submits their report or otherwise closes the dialog I want to reload the page.

This is re-opening #758

The solution suggested in the previous issue does not work for three reasons:

1. There's a race condition on when, exactly, the DOM elements are loaded.
2. The classes attached to the specified elements are not part of the official API and therefore brittle and prone to change.
3. This does not solve the issue of the user closing the dialog by simply clicking outside of it.

Solution Brainstorm

An an 'onClose' callback.

[AbhiPrasad]

Hey @phayes. I can see you left a comment on #758 - you're right that an onClose callback is needed.

PRs are welcome if you're interested in contributing! The report dialog HTML is on the main Sentry site, and the logic to control the report dialog can be seen here:

sentry-javascript/packages/browser/src/sdk.ts

Line 134 in d8beaa0

export function showReportDialog(options: ReportDialogOptions = {}, hub: Hub = getCurrentHub()): void {

[arya-s]

Hello, original reporter of the issue here.

I took a stab at this over the weekend, please let me know if there's anything else missing.

I created three PRs for this:

• for the sdk: feat(feedback): Add onClose callback to showReportDialog (#9433) #9550
• for the backend: feat(feedback): Sends MessageEvent when error page embed is closed sentry#59885
• for the docs: feat(feedback): Add onClose description to user-feedback sentry-docs#8484

Finally, here's a demo project: https://github.com/arya-s/sentry-onclose-report-dialog

[lforst]

Hi, @arya-s thanks for taking a stab at this. I hope we will get around to reviewing this in a timely manner.

[AbhiPrasad]

Released and documented with https://github.com/getsentry/sentry-javascript/releases/tag/7.82.0. Thanks a lot @arya-s for your contribution.

[arya-s]

@AbhiPrasad thanks for the guidance and code review :)

[elamperti]

Thank you @arya-s!!! Great work 🚀