-
-
Notifications
You must be signed in to change notification settings - Fork 1.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(feedback): Auto start buffering replays if enabled and flush on …
…form open * By default (can be disabled), if replay integration exists, start buffering * Flush replay when the feedback form is first opened instead of at submit time We are making this change because we have noticed a lot of feedback replays only consist of the user submitting the feedback and not what they did prior to submitting feedback. This may result in false positives if users open but do not submit feedback, but this should make replays from feedback more useful.
- Loading branch information
Showing
11 changed files
with
221 additions
and
100 deletions.
There are no files selected for viewing
File renamed without changes.
107 changes: 107 additions & 0 deletions
107
...es/browser-integration-tests/suites/feedback/captureFeedbackAndReplay/hasSampling/test.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,107 @@ | ||
import { expect } from '@playwright/test'; | ||
|
||
import { sentryTest } from '../../../../utils/fixtures'; | ||
import { envelopeRequestParser, getEnvelopeType } from '../../../../utils/helpers'; | ||
import { getCustomRecordingEvents, getReplayEvent, waitForReplayRequest } from '../../../../utils/replayHelpers'; | ||
|
||
sentryTest( | ||
'should capture feedback (@sentry-internal/feedback import)', | ||
async ({ forceFlushReplay, getLocalTestPath, page }) => { | ||
if (process.env.PW_BUNDLE) { | ||
sentryTest.skip(); | ||
} | ||
|
||
const reqPromise0 = waitForReplayRequest(page, 0); | ||
const reqPromise1 = waitForReplayRequest(page, 1); | ||
const reqPromise2 = waitForReplayRequest(page, 2); | ||
const feedbackRequestPromise = page.waitForResponse(res => { | ||
const req = res.request(); | ||
|
||
const postData = req.postData(); | ||
if (!postData) { | ||
return false; | ||
} | ||
|
||
try { | ||
return getEnvelopeType(req) === 'feedback'; | ||
} catch (err) { | ||
return false; | ||
} | ||
}); | ||
|
||
await page.route('https://dsn.ingest.sentry.io/**/*', route => { | ||
return route.fulfill({ | ||
status: 200, | ||
contentType: 'application/json', | ||
body: JSON.stringify({ id: 'test-id' }), | ||
}); | ||
}); | ||
|
||
const url = await getLocalTestPath({ testDir: __dirname }); | ||
|
||
const [, , replayReq0] = await Promise.all([page.goto(url), page.getByText('Report a Bug').click(), reqPromise0]); | ||
|
||
// Inputs are slow, these need to be serial | ||
await page.locator('[name="name"]').fill('Jane Doe'); | ||
await page.locator('[name="email"]').fill('janedoe@example.org'); | ||
await page.locator('[name="message"]').fill('my example feedback'); | ||
|
||
// Force flush here, as inputs are slow and can cause click event to be in unpredictable segments | ||
await Promise.all([forceFlushReplay(), reqPromise1]); | ||
|
||
const [, feedbackResp, replayReq2] = await Promise.all([ | ||
page.getByLabel('Send Bug Report').click(), | ||
feedbackRequestPromise, | ||
reqPromise2, | ||
]); | ||
|
||
const feedbackEvent = envelopeRequestParser(feedbackResp.request()); | ||
const replayEvent = getReplayEvent(replayReq0); | ||
// Feedback breadcrumb is on second segment because we flush when "Report a Bug" is clicked | ||
// And then the breadcrumb is sent when feedback form is submitted | ||
const { breadcrumbs } = getCustomRecordingEvents(replayReq2); | ||
|
||
expect(breadcrumbs).toEqual( | ||
expect.arrayContaining([ | ||
expect.objectContaining({ | ||
category: 'sentry.feedback', | ||
data: { feedbackId: expect.any(String) }, | ||
timestamp: expect.any(Number), | ||
type: 'default', | ||
}), | ||
]), | ||
); | ||
|
||
expect(feedbackEvent).toEqual({ | ||
type: 'feedback', | ||
breadcrumbs: expect.any(Array), | ||
contexts: { | ||
feedback: { | ||
contact_email: 'janedoe@example.org', | ||
message: 'my example feedback', | ||
name: 'Jane Doe', | ||
replay_id: replayEvent.event_id, | ||
source: 'widget', | ||
url: expect.stringContaining('/dist/index.html'), | ||
}, | ||
}, | ||
level: 'info', | ||
timestamp: expect.any(Number), | ||
event_id: expect.stringMatching(/\w{32}/), | ||
environment: 'production', | ||
sdk: { | ||
integrations: expect.arrayContaining(['Feedback']), | ||
version: expect.any(String), | ||
name: 'sentry.javascript.browser', | ||
packages: expect.anything(), | ||
}, | ||
request: { | ||
url: expect.stringContaining('/dist/index.html'), | ||
headers: { | ||
'User-Agent': expect.stringContaining(''), | ||
}, | ||
}, | ||
platform: 'javascript', | ||
}); | ||
}, | ||
); |
18 changes: 18 additions & 0 deletions
18
...ges/browser-integration-tests/suites/feedback/captureFeedbackAndReplay/noSampling/init.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import { Feedback } from '@sentry-internal/feedback'; | ||
import * as Sentry from '@sentry/browser'; | ||
|
||
window.Sentry = Sentry; | ||
|
||
Sentry.init({ | ||
dsn: 'https://public@dsn.ingest.sentry.io/1337', | ||
replaysOnErrorSampleRate: 0, | ||
replaysSessionSampleRate: 0, | ||
integrations: [ | ||
new Sentry.Replay({ | ||
flushMinDelay: 200, | ||
flushMaxDelay: 200, | ||
minReplayDuration: 0, | ||
}), | ||
new Feedback(), | ||
], | ||
}); |
30 changes: 30 additions & 0 deletions
30
...ges/browser-integration-tests/suites/feedback/captureFeedbackAndReplay/noSampling/test.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
import { expect } from '@playwright/test'; | ||
|
||
import { sentryTest } from '../../../../utils/fixtures'; | ||
import { getReplayEvent, waitForReplayRequest } from '../../../../utils/replayHelpers'; | ||
|
||
sentryTest( | ||
'should capture feedback with no replay sampling when Form opens (@sentry-internal/feedback import)', | ||
async ({ getLocalTestPath, page }) => { | ||
if (process.env.PW_BUNDLE) { | ||
sentryTest.skip(); | ||
} | ||
|
||
const reqPromise0 = waitForReplayRequest(page, 0); | ||
await page.route('https://dsn.ingest.sentry.io/**/*', route => { | ||
return route.fulfill({ | ||
status: 200, | ||
contentType: 'application/json', | ||
body: JSON.stringify({ id: 'test-id' }), | ||
}); | ||
}); | ||
|
||
const url = await getLocalTestPath({ testDir: __dirname }); | ||
|
||
const [, , replayReq] = await Promise.all([page.goto(url), page.getByText('Report a Bug').click(), reqPromise0]); | ||
|
||
const replayEvent = getReplayEvent(replayReq); | ||
expect(replayEvent.segment_id).toBe(0); | ||
expect(replayEvent.replay_type).toBe('buffer'); | ||
}, | ||
); |
91 changes: 0 additions & 91 deletions
91
dev-packages/browser-integration-tests/suites/feedback/captureFeedbackAndReplay/test.ts
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.