showReportDialog not opening dialog when called inside beforeSend function

[twebber90]

Important Details

How are you running Sentry?
@sentry/react npm package v5.19.2

Description

Running locally with the latest version of react-scripts and an app generated with create-react-app. I initialize Sentry as follows:

Sentry.init({
        beforeSend(event) {
            if (event.exception) {
                Sentry.showReportDialog({ eventId: event.event_id });
            }

            return event;
        },
        dsn: 'my-dsn-info',
        release: 'my-release-version-info',
});

When I force an unhandled exception locally, the event successfully fires to sentry and I see it in the issues for my configured project.

The issue I'm having is that nothing related to the user feedback form is being opened or prompted for. I've confirmed that event.exception looks as expected and the showReportDialog function is executed (I put a breakpoint inside it as well and it look like the client information looks as expected).

Steps to Reproduce

☝️

Good items to include here include:

The only stack trace or errors that show is the reference error I'm creating to cause the event to be triggered.

What you expected to happen

The user feedback dialog should show after showReportDialog is called

Possible Solution

🤷‍♂️ I'm matching the docs exactly and I don't see any issues besides the dialog just isn't showing at all

[AbhiPrasad]

Hello! I transferred this issue to sentry-javascript as it seems more appropriate.

I've set up a quick codesandbox with your config (be sure to insert your own DSN when trying), and the dialog seems to to work. https://codesandbox.io/s/morning-sea-ix6i5

Can you check if you made a request to https://sentry.io/api/embed/error-page? That is what showReportDialog() uses.

[AbhiPrasad]

@twebber90 are you still experiencing issues with the report dialog?

[twebber90]

lol I was 25 minutes late... I'm testing locally again and going to look for the api call you were suggesting

[AbhiPrasad]

Hey sorry, I'll reopen the issue if you are still experiencing problems.

[twebber90]

@AbhiPrasad No problem at all 👍

Just tested locally and the only api call related to Sentry I see being fired off is the call to send the issue/event. I didn't see anything to https://sentry.io/api/embed/error-page

Could it be something related to the hot-reloading with react-scripts/create react app?

Everything that comes across with the issue looks as expected 👍

[AbhiPrasad]

Interesting. I'll try debugging a bit with create react app. Are you testing with a default CRA, or with your app built on top of it? Are you lazy loading anything, or using server side rendering? Is Sentry the only error monitoring service you are running?

Appreciate the help with all this, it can be hard debug these things sometimes :P

[twebber90]

We are currently on v3.4.1 of react-scripts and just running react-scripts start to run our application locally. Nothing crazy for build configurations just a babel config in the package.json:

"babel": {
        "presets": [
            "react-app"
        ]
}

No lazy loading or server side rendering either, and Sentry is the only error monitoring we have. We use google analytics and firebase for some error/exception logging but that's all manually triggered within the try/catches of our API calls.

Let me know if there is anything I can do to help dig in 👍

[AbhiPrasad]

Hey we figured it out, we will cut a release to fix this. #2770. Sorry for the trouble!

[twebber90]

@AbhiPrasad thanks so much! I'll keep a lookout for new release to get installed. Thanks for the quick response and resolution! Kudos Sentry team!!