feat(feedback): Support web environments #4558

antonis · 2025-02-17T16:21:49Z

📢 Type of change

Bugfix
New feature
Enhancement
Refactoring

Based on #4546 to avoid conflicts

📜 Description

This PR handles the following issues on the web:

Adds support for attachments
Fixes web alerts using window.alert
Fixes input field focus issue

💡 Motivation and Context

See #4302 (comment)

💚 How did you test it?

Manual

📝 Checklist

I added tests to verify changes
No new PII added or SDK only sends newly added PII if sendDefaultPII is enabled
I updated the docs if needed.
I updated the wizard if needed.
All tests passing
No breaking changes

🔮 Next steps

#skip-changelog

# Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

…-screenshot # Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

…-simplify-onaddscreenshot # Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

…-screenshot

…-simplify-onaddscreenshot

github-actions · 2025-02-17T16:22:14Z

	Messages
📖	Do not forget to update Sentry-docs with your feature once the pull request gets approved.

Generated by 🚫 dangerJS against 01cb31d

github-actions · 2025-02-17T16:38:00Z

Android (legacy) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	416.88 ms	422.87 ms	5.99 ms
Size	17.75 MiB	20.12 MiB	2.38 MiB

Baseline results on branch: feedback-ui

Startup times

Revision	Plain	With Sentry	Diff
`9402883`	448.53 ms	468.73 ms	20.20 ms
`e42816c`	401.30 ms	410.04 ms	8.74 ms
`3e4cdf5`	462.35 ms	474.96 ms	12.61 ms
`77e88fc`	478.48 ms	487.21 ms	8.73 ms
`8cb898b`	438.83 ms	420.58 ms	-18.25 ms
`2646c98`	429.98 ms	421.63 ms	-8.35 ms
`6b1624f`	462.78 ms	465.13 ms	2.35 ms
`df05370`	477.62 ms	491.63 ms	14.00 ms
`e5d5735`	452.70 ms	453.04 ms	0.34 ms
`894ebb0`	497.45 ms	545.04 ms	47.60 ms

App size

Revision	Plain	With Sentry	Diff
`9402883`	17.75 MiB	20.12 MiB	2.37 MiB
`e42816c`	17.75 MiB	20.12 MiB	2.38 MiB
`3e4cdf5`	17.75 MiB	20.12 MiB	2.37 MiB
`77e88fc`	17.75 MiB	20.12 MiB	2.37 MiB
`8cb898b`	17.75 MiB	20.12 MiB	2.37 MiB
`2646c98`	17.75 MiB	20.12 MiB	2.37 MiB
`6b1624f`	17.75 MiB	20.12 MiB	2.37 MiB
`df05370`	17.75 MiB	20.12 MiB	2.37 MiB
`e5d5735`	17.75 MiB	20.12 MiB	2.37 MiB
`894ebb0`	17.75 MiB	20.12 MiB	2.37 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

Revision	Plain	With Sentry	Diff
`d7f56e5`	407.20 ms	458.96 ms	51.76 ms
`e9a7e86`	454.61 ms	468.71 ms	14.10 ms

App size

Revision	Plain	With Sentry	Diff
`d7f56e5`	17.75 MiB	20.12 MiB	2.38 MiB
`e9a7e86`	17.75 MiB	20.12 MiB	2.38 MiB

github-actions · 2025-02-17T16:51:13Z

iOS (legacy) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	1232.78 ms	1231.57 ms	-1.20 ms
Size	2.63 MiB	3.76 MiB	1.12 MiB

Baseline results on branch: feedback-ui

Startup times

Revision	Plain	With Sentry	Diff
`e5d5735`+dirty	1222.02 ms	1222.22 ms	0.20 ms
`8cb898b`+dirty	1221.40 ms	1231.78 ms	10.37 ms
`77e88fc`+dirty	1224.55 ms	1232.41 ms	7.86 ms
`9402883`+dirty	1219.65 ms	1217.94 ms	-1.72 ms
`894ebb0`+dirty	1224.33 ms	1214.45 ms	-9.89 ms
`e42816c`+dirty	1211.29 ms	1219.65 ms	8.37 ms
`0325426`+dirty	1228.88 ms	1229.92 ms	1.04 ms
`0459aee`+dirty	1232.82 ms	1231.19 ms	-1.63 ms
`6b1624f`+dirty	1224.65 ms	1225.65 ms	1.00 ms
`269c976`+dirty	1210.02 ms	1204.46 ms	-5.56 ms

App size

Revision	Plain	With Sentry	Diff
`e5d5735`+dirty	2.63 MiB	3.69 MiB	1.06 MiB
`8cb898b`+dirty	2.63 MiB	3.71 MiB	1.08 MiB
`77e88fc`+dirty	2.63 MiB	3.75 MiB	1.12 MiB
`9402883`+dirty	2.63 MiB	3.71 MiB	1.07 MiB
`894ebb0`+dirty	2.63 MiB	3.71 MiB	1.07 MiB
`e42816c`+dirty	2.63 MiB	3.75 MiB	1.12 MiB
`0325426`+dirty	2.63 MiB	3.69 MiB	1.06 MiB
`0459aee`+dirty	2.63 MiB	3.69 MiB	1.06 MiB
`6b1624f`+dirty	2.63 MiB	3.71 MiB	1.07 MiB
`269c976`+dirty	2.63 MiB	3.69 MiB	1.06 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

Revision	Plain	With Sentry	Diff
`d7f56e5`+dirty	1215.96 ms	1222.83 ms	6.87 ms
`e9a7e86`+dirty	1219.31 ms	1223.33 ms	4.01 ms

App size

Revision	Plain	With Sentry	Diff
`d7f56e5`+dirty	2.63 MiB	3.76 MiB	1.12 MiB
`e9a7e86`+dirty	2.63 MiB	3.76 MiB	1.12 MiB

github-actions · 2025-02-17T17:05:01Z

iOS (new) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	1219.31 ms	1230.70 ms	11.39 ms
Size	3.19 MiB	4.32 MiB	1.14 MiB

Baseline results on branch: feedback-ui

Startup times

Revision	Plain	With Sentry	Diff
`e5d5735`+dirty	1217.78 ms	1221.80 ms	4.02 ms
`8cb898b`+dirty	1209.39 ms	1207.57 ms	-1.82 ms
`77e88fc`+dirty	1218.79 ms	1220.00 ms	1.21 ms
`9402883`+dirty	1217.71 ms	1213.02 ms	-4.69 ms
`894ebb0`+dirty	1210.94 ms	1202.08 ms	-8.85 ms
`e42816c`+dirty	1220.08 ms	1222.46 ms	2.38 ms
`0325426`+dirty	1210.17 ms	1216.37 ms	6.20 ms
`0459aee`+dirty	1233.67 ms	1239.80 ms	6.12 ms
`6b1624f`+dirty	1224.12 ms	1220.73 ms	-3.39 ms
`269c976`+dirty	1223.29 ms	1222.90 ms	-0.39 ms

App size

Revision	Plain	With Sentry	Diff
`e5d5735`+dirty	3.19 MiB	4.26 MiB	1.07 MiB
`8cb898b`+dirty	3.19 MiB	4.28 MiB	1.09 MiB
`77e88fc`+dirty	3.19 MiB	4.32 MiB	1.13 MiB
`9402883`+dirty	3.19 MiB	4.27 MiB	1.09 MiB
`894ebb0`+dirty	3.19 MiB	4.27 MiB	1.09 MiB
`e42816c`+dirty	3.19 MiB	4.32 MiB	1.13 MiB
`0325426`+dirty	3.19 MiB	4.26 MiB	1.07 MiB
`0459aee`+dirty	3.19 MiB	4.26 MiB	1.07 MiB
`6b1624f`+dirty	3.19 MiB	4.27 MiB	1.09 MiB
`269c976`+dirty	3.19 MiB	4.26 MiB	1.07 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

Revision	Plain	With Sentry	Diff
`d7f56e5`+dirty	1236.69 ms	1236.24 ms	-0.45 ms
`e9a7e86`+dirty	1225.75 ms	1219.46 ms	-6.29 ms

App size

Revision	Plain	With Sentry	Diff
`d7f56e5`+dirty	3.19 MiB	4.32 MiB	1.14 MiB
`e9a7e86`+dirty	3.19 MiB	4.32 MiB	1.14 MiB

antonis · 2025-02-17T17:25:16Z

packages/core/src/js/feedback/utils.ts

+
+export const feedbackAlertDialog = (title: string, message: string): void => {
+  /* eslint-disable @typescript-eslint/ban-ts-comment, no-restricted-globals, no-alert, @typescript-eslint/no-unsafe-member-access */
+  // @ts-ignore


I used ts-ignore to avoid touching the global state and compilerOptions to use window. I'll be happy to iterate if there is better suggestion for this 🙇

One thing you could try is altering the worldwide.ts file at packages/core/src/js/utils/worldwride.ts

Change the ReactNativeInternalGlobal and add the following parameter:
alert?: (message: string) => void;

So with that you could use the following code

if (isWeb() && typeof RN_GLOBAL_OBJ.alert !== 'undefined') { RN_GLOBAL_OBJ.alert(`${title}\n${message}`); } else {

EDIT: I think there may be an issue with my approach, RN_GLOBAL_OBJ points to globalThis and the alert is inside globalThis.window

Thank you for the suggestion @lucas-zimerman 🙇
This actually seems to work pretty well and there is no need to suppress any typescript checks.
Updated with 28738bf

github-actions · 2025-02-17T18:34:55Z

Android (new) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	407.90 ms	390.52 ms	-17.37 ms
Size	7.15 MiB	8.39 MiB	1.24 MiB

Baseline results on branch: feedback-ui

Startup times

Revision	Plain	With Sentry	Diff
`9402883`+dirty	436.49 ms	518.94 ms	82.45 ms
`8cb898b`+dirty	393.33 ms	416.20 ms	22.87 ms
`6b1624f`+dirty	382.17 ms	441.00 ms	58.83 ms
`2646c98`+dirty	415.13 ms	438.41 ms	23.28 ms
`3e4cdf5`+dirty	642.13 ms	702.23 ms	60.10 ms
`0459aee`+dirty	424.10 ms	466.63 ms	42.53 ms
`b74349e`+dirty	349.96 ms	375.00 ms	25.04 ms
`e42816c`+dirty	347.06 ms	348.18 ms	1.12 ms
`df05370`+dirty	395.08 ms	430.38 ms	35.30 ms
`d1a10a1`+dirty	364.43 ms	362.98 ms	-1.45 ms

App size

Revision	Plain	With Sentry	Diff
`9402883`+dirty	7.15 MiB	8.39 MiB	1.23 MiB
`8cb898b`+dirty	7.15 MiB	8.39 MiB	1.24 MiB
`6b1624f`+dirty	7.15 MiB	8.39 MiB	1.23 MiB
`2646c98`+dirty	7.15 MiB	8.38 MiB	1.23 MiB
`3e4cdf5`+dirty	7.15 MiB	8.39 MiB	1.23 MiB
`0459aee`+dirty	7.15 MiB	8.38 MiB	1.23 MiB
`b74349e`+dirty	7.15 MiB	8.39 MiB	1.24 MiB
`e42816c`+dirty	7.15 MiB	8.39 MiB	1.24 MiB
`df05370`+dirty	7.15 MiB	8.39 MiB	1.23 MiB
`d1a10a1`+dirty	7.15 MiB	8.39 MiB	1.24 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

Revision	Plain	With Sentry	Diff
`d7f56e5`+dirty	391.04 ms	397.85 ms	6.81 ms
`e9a7e86`+dirty	407.96 ms	420.29 ms	12.33 ms

App size

Revision	Plain	With Sentry	Diff
`d7f56e5`+dirty	7.15 MiB	8.39 MiB	1.24 MiB
`e9a7e86`+dirty	7.15 MiB	8.39 MiB	1.24 MiB

Co-authored-by: Krystof Woldrich <[email protected]>

…-screenshot

…-simplify-onaddscreenshot

…/feedback-webfixes

# Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

krystofwoldrich

Thank you! Works as expected with Expo Web.

antonis added 14 commits February 14, 2025 13:47

Save form state for unsubmitted data

38a6085

Show selected screenshot

56a113e

Use image uri instead of UInt8Array in onAddScreenshot callback

d2dd1f3

Merge branch 'feedback-ui' into antonis/feedback-save-state

9212cb8

# Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

Omit isVisible from state

1efb23e

Save/clear form state on unmount

59f2f57

Pass the missing attachment parameter in the onSubmitSuccess

797611f

Merge branch 'antonis/feedback-save-state' into antonis/feedback-show…

dbf8c90

…-screenshot # Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

Merge branch 'antonis/feedback-show-screenshot' into antonis/feedback…

91117e3

…-simplify-onaddscreenshot # Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

Use only the uri parameter for the onAddScreenshot callback

f14197d

Merge branch 'feedback-ui' into antonis/feedback-save-state

e63ee11

Merge branch 'antonis/feedback-save-state' into antonis/feedback-show…

f220540

…-screenshot

Merge branch 'antonis/feedback-show-screenshot' into antonis/feedback…

aae3a98

…-simplify-onaddscreenshot

Handle attachments on the web

41cb1ca

antonis mentioned this pull request Feb 17, 2025

feat: Feedback Widget Beta for React Native #4435

Merged

10 tasks

antonis added 2 commits February 17, 2025 19:15

Use window for showing alerts on the web

f5c306f

Disable keyboard handling on the web

42ab16c

antonis commented Feb 17, 2025

View reviewed changes

antonis marked this pull request as ready for review February 17, 2025 17:29

antonis requested review from krystofwoldrich and lucas-zimerman as code owners February 17, 2025 17:29

antonis and others added 4 commits February 18, 2025 11:38

Use instance variable for _didSubmitForm

f17106e

Fixed callback function parameter name for clarity

f95ed97

Co-authored-by: Krystof Woldrich <[email protected]>

Merge branch 'antonis/feedback-save-state' into antonis/feedback-show…

869f22b

…-screenshot

Fixes lint issue

6e2d6ec

antonis added 4 commits February 18, 2025 11:45

Merge branch 'antonis/feedback-save-state' into antonis/feedback-show…

082ef57

…-screenshot

Merge branch 'antonis/feedback-show-screenshot' into antonis/feedback…

e5a9bcc

…-simplify-onaddscreenshot

Merge branch 'antonis/feedback-simplify-onaddscreenshot' into antonis…

4336622

…/feedback-webfixes

Use RN_GLOBAL_OBJ for web alert

28738bf

Base automatically changed from antonis/feedback-simplify-onaddscreenshot to feedback-ui February 18, 2025 14:48

Merge branch 'feedback-ui' into antonis/feedback-webfixes

01cb31d

# Conflicts: # packages/core/src/js/feedback/FeedbackWidget.tsx

antonis mentioned this pull request Feb 18, 2025

[EPIC] Feedback Widget for React Native #4302

Open

krystofwoldrich approved these changes Feb 20, 2025

View reviewed changes

antonis merged commit ef4be9e into feedback-ui Feb 20, 2025
66 checks passed

antonis deleted the antonis/feedback-webfixes branch February 20, 2025 07:59

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(feedback): Support web environments #4558

feat(feedback): Support web environments #4558

antonis commented Feb 17, 2025 •

edited

Loading

github-actions bot commented Feb 17, 2025 •

edited

Loading

github-actions bot commented Feb 17, 2025 •

edited

Loading

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

github-actions bot commented Feb 17, 2025 •

edited

Loading

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

github-actions bot commented Feb 17, 2025 •

edited

Loading

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

antonis Feb 17, 2025

lucas-zimerman Feb 18, 2025 •

edited

Loading

antonis Feb 18, 2025

github-actions bot commented Feb 17, 2025 •

edited

Loading

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

krystofwoldrich left a comment

feat(feedback): Support web environments #4558

feat(feedback): Support web environments #4558

Conversation

antonis commented Feb 17, 2025 • edited Loading

📢 Type of change

📜 Description

💡 Motivation and Context

💚 How did you test it?

📝 Checklist

🔮 Next steps

github-actions bot commented Feb 17, 2025 • edited Loading

github-actions bot commented Feb 17, 2025 • edited Loading

Android (legacy) Performance metrics 🚀

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

github-actions bot commented Feb 17, 2025 • edited Loading

iOS (legacy) Performance metrics 🚀

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

github-actions bot commented Feb 17, 2025 • edited Loading

iOS (new) Performance metrics 🚀

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

antonis Feb 17, 2025

Choose a reason for hiding this comment

lucas-zimerman Feb 18, 2025 • edited Loading

Choose a reason for hiding this comment

antonis Feb 18, 2025

Choose a reason for hiding this comment

github-actions bot commented Feb 17, 2025 • edited Loading

Android (new) Performance metrics 🚀

Baseline results on branch: feedback-ui

Startup times

App size

Previous results on branch: antonis/feedback-webfixes

Startup times

App size

krystofwoldrich left a comment

Choose a reason for hiding this comment

antonis commented Feb 17, 2025 •

edited

Loading

github-actions bot commented Feb 17, 2025 •

edited

Loading

github-actions bot commented Feb 17, 2025 •

edited

Loading

github-actions bot commented Feb 17, 2025 •

edited

Loading

github-actions bot commented Feb 17, 2025 •

edited

Loading

lucas-zimerman Feb 18, 2025 •

edited

Loading

github-actions bot commented Feb 17, 2025 •

edited

Loading