Skip to content

feat(feedback): Support web environments - #4558

Merged
antonis merged 25 commits into
feedback-uifrom
antonis/feedback-webfixes
Feb 20, 2025
Merged

feat(feedback): Support web environments#4558
antonis merged 25 commits into
feedback-uifrom
antonis/feedback-webfixes

Conversation

@antonis

@antonisantonis commented Feb 17, 2025•
edited
Loading

Copy link
Copy Markdown
Contributor

📢 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

@antonis
Save form state for unsubmitted data
38a6085
@antonis
Show selected screenshot
56a113e
@antonis
Use image uri instead of UInt8Array in onAddScreenshot callback
d2dd1f3
@antonis
Merge branch 'feedback-ui' into antonis/feedback-save-state
9212cb8
# Conflicts:
#	packages/core/src/js/feedback/FeedbackWidget.tsx
@antonis
Omit isVisible from state
1efb23e
@antonis
Save/clear form state on unmount
59f2f57
@antonis
Pass the missing attachment parameter in the onSubmitSuccess
797611f
@antonis
Merge branch 'antonis/feedback-save-state' into antonis/feedback-show…
dbf8c90
…-screenshot
# Conflicts:
#	packages/core/src/js/feedback/FeedbackWidget.tsx
@antonis
Merge branch 'antonis/feedback-show-screenshot' into antonis/feedback…
91117e3
…-simplify-onaddscreenshot
# Conflicts:
#	packages/core/src/js/feedback/FeedbackWidget.tsx
@antonis
Use only the uri parameter for the onAddScreenshot callback
f14197d
@antonis
Merge branch 'feedback-ui' into antonis/feedback-save-state
e63ee11
@antonis
Merge branch 'antonis/feedback-save-state' into antonis/feedback-show…
f220540
…-screenshot
@antonis
Merge branch 'antonis/feedback-show-screenshot' into antonis/feedback…
aae3a98
…-simplify-onaddscreenshot
@antonis
Handle attachments on the web
41cb1ca
@antonisantonis mentioned this pull request Feb 17, 2025
Merged
10 tasks
@github-actions

github-actionsBot commented Feb 17, 2025•
edited
Loading

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

Generated by 🚫 dangerJS against 01cb31d

@github-actions

github-actionsBot commented Feb 17, 2025•
edited
Loading

Copy link
Copy Markdown
Contributor

Android (legacy) Performance metrics 🚀

PlainWith SentryDiff
Startup time416.88 ms422.87 ms5.99 ms
Size17.75 MiB20.12 MiB2.38 MiB

Baseline results on branch: feedback-ui

Startup times

RevisionPlainWith SentryDiff
9402883448.53 ms468.73 ms20.20 ms
e42816c401.30 ms410.04 ms8.74 ms
3e4cdf5462.35 ms474.96 ms12.61 ms
77e88fc478.48 ms487.21 ms8.73 ms
8cb898b438.83 ms420.58 ms-18.25 ms
2646c98429.98 ms421.63 ms-8.35 ms
6b1624f462.78 ms465.13 ms2.35 ms
df05370477.62 ms491.63 ms14.00 ms
e5d5735452.70 ms453.04 ms0.34 ms
894ebb0497.45 ms545.04 ms47.60 ms

App size

RevisionPlainWith SentryDiff
940288317.75 MiB20.12 MiB2.37 MiB
e42816c17.75 MiB20.12 MiB2.38 MiB
3e4cdf517.75 MiB20.12 MiB2.37 MiB
77e88fc17.75 MiB20.12 MiB2.37 MiB
8cb898b17.75 MiB20.12 MiB2.37 MiB
2646c9817.75 MiB20.12 MiB2.37 MiB
6b1624f17.75 MiB20.12 MiB2.37 MiB
df0537017.75 MiB20.12 MiB2.37 MiB
e5d573517.75 MiB20.12 MiB2.37 MiB
894ebb017.75 MiB20.12 MiB2.37 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

RevisionPlainWith SentryDiff
d7f56e5407.20 ms458.96 ms51.76 ms
e9a7e86454.61 ms468.71 ms14.10 ms

App size

RevisionPlainWith SentryDiff
d7f56e517.75 MiB20.12 MiB2.38 MiB
e9a7e8617.75 MiB20.12 MiB2.38 MiB

@github-actions

github-actionsBot commented Feb 17, 2025•
edited
Loading

Copy link
Copy Markdown
Contributor

iOS (legacy) Performance metrics 🚀

PlainWith SentryDiff
Startup time1232.78 ms1231.57 ms-1.20 ms
Size2.63 MiB3.76 MiB1.12 MiB

Baseline results on branch: feedback-ui

Startup times

RevisionPlainWith SentryDiff
e5d5735+dirty1222.02 ms1222.22 ms0.20 ms
8cb898b+dirty1221.40 ms1231.78 ms10.37 ms
77e88fc+dirty1224.55 ms1232.41 ms7.86 ms
9402883+dirty1219.65 ms1217.94 ms-1.72 ms
894ebb0+dirty1224.33 ms1214.45 ms-9.89 ms
e42816c+dirty1211.29 ms1219.65 ms8.37 ms
0325426+dirty1228.88 ms1229.92 ms1.04 ms
0459aee+dirty1232.82 ms1231.19 ms-1.63 ms
6b1624f+dirty1224.65 ms1225.65 ms1.00 ms
269c976+dirty1210.02 ms1204.46 ms-5.56 ms

App size

RevisionPlainWith SentryDiff
e5d5735+dirty2.63 MiB3.69 MiB1.06 MiB
8cb898b+dirty2.63 MiB3.71 MiB1.08 MiB
77e88fc+dirty2.63 MiB3.75 MiB1.12 MiB
9402883+dirty2.63 MiB3.71 MiB1.07 MiB
894ebb0+dirty2.63 MiB3.71 MiB1.07 MiB
e42816c+dirty2.63 MiB3.75 MiB1.12 MiB
0325426+dirty2.63 MiB3.69 MiB1.06 MiB
0459aee+dirty2.63 MiB3.69 MiB1.06 MiB
6b1624f+dirty2.63 MiB3.71 MiB1.07 MiB
269c976+dirty2.63 MiB3.69 MiB1.06 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

RevisionPlainWith SentryDiff
d7f56e5+dirty1215.96 ms1222.83 ms6.87 ms
e9a7e86+dirty1219.31 ms1223.33 ms4.01 ms

App size

RevisionPlainWith SentryDiff
d7f56e5+dirty2.63 MiB3.76 MiB1.12 MiB
e9a7e86+dirty2.63 MiB3.76 MiB1.12 MiB

@github-actions

github-actionsBot commented Feb 17, 2025•
edited
Loading

Copy link
Copy Markdown
Contributor

iOS (new) Performance metrics 🚀

PlainWith SentryDiff
Startup time1219.31 ms1230.70 ms11.39 ms
Size3.19 MiB4.32 MiB1.14 MiB

Baseline results on branch: feedback-ui

Startup times

RevisionPlainWith SentryDiff
e5d5735+dirty1217.78 ms1221.80 ms4.02 ms
8cb898b+dirty1209.39 ms1207.57 ms-1.82 ms
77e88fc+dirty1218.79 ms1220.00 ms1.21 ms
9402883+dirty1217.71 ms1213.02 ms-4.69 ms
894ebb0+dirty1210.94 ms1202.08 ms-8.85 ms
e42816c+dirty1220.08 ms1222.46 ms2.38 ms
0325426+dirty1210.17 ms1216.37 ms6.20 ms
0459aee+dirty1233.67 ms1239.80 ms6.12 ms
6b1624f+dirty1224.12 ms1220.73 ms-3.39 ms
269c976+dirty1223.29 ms1222.90 ms-0.39 ms

App size

RevisionPlainWith SentryDiff
e5d5735+dirty3.19 MiB4.26 MiB1.07 MiB
8cb898b+dirty3.19 MiB4.28 MiB1.09 MiB
77e88fc+dirty3.19 MiB4.32 MiB1.13 MiB
9402883+dirty3.19 MiB4.27 MiB1.09 MiB
894ebb0+dirty3.19 MiB4.27 MiB1.09 MiB
e42816c+dirty3.19 MiB4.32 MiB1.13 MiB
0325426+dirty3.19 MiB4.26 MiB1.07 MiB
0459aee+dirty3.19 MiB4.26 MiB1.07 MiB
6b1624f+dirty3.19 MiB4.27 MiB1.09 MiB
269c976+dirty3.19 MiB4.26 MiB1.07 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

RevisionPlainWith SentryDiff
d7f56e5+dirty1236.69 ms1236.24 ms-0.45 ms
e9a7e86+dirty1225.75 ms1219.46 ms-6.29 ms

App size

RevisionPlainWith SentryDiff
d7f56e5+dirty3.19 MiB4.32 MiB1.14 MiB
e9a7e86+dirty3.19 MiB4.32 MiB1.14 MiB

antonis
antonis commented Feb 17, 2025
View reviewed changes
Comment threadpackages/core/src/js/feedback/utils.ts Outdated

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

@antonisantonisFeb 17, 2025

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 🙇

@lucas-zimermanlucas-zimermanFeb 18, 2025•
edited
Loading

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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()&&typeofRN_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

@antonisantonisFeb 18, 2025

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

@antonis
antonis marked this pull request as ready for review February 17, 2025 17:29
@github-actions

github-actionsBot commented Feb 17, 2025•
edited
Loading

Copy link
Copy Markdown
Contributor

Android (new) Performance metrics 🚀

PlainWith SentryDiff
Startup time407.90 ms390.52 ms-17.37 ms
Size7.15 MiB8.39 MiB1.24 MiB

Baseline results on branch: feedback-ui

Startup times

RevisionPlainWith SentryDiff
9402883+dirty436.49 ms518.94 ms82.45 ms
8cb898b+dirty393.33 ms416.20 ms22.87 ms
6b1624f+dirty382.17 ms441.00 ms58.83 ms
2646c98+dirty415.13 ms438.41 ms23.28 ms
3e4cdf5+dirty642.13 ms702.23 ms60.10 ms
0459aee+dirty424.10 ms466.63 ms42.53 ms
b74349e+dirty349.96 ms375.00 ms25.04 ms
e42816c+dirty347.06 ms348.18 ms1.12 ms
df05370+dirty395.08 ms430.38 ms35.30 ms
d1a10a1+dirty364.43 ms362.98 ms-1.45 ms

App size

RevisionPlainWith SentryDiff
9402883+dirty7.15 MiB8.39 MiB1.23 MiB
8cb898b+dirty7.15 MiB8.39 MiB1.24 MiB
6b1624f+dirty7.15 MiB8.39 MiB1.23 MiB
2646c98+dirty7.15 MiB8.38 MiB1.23 MiB
3e4cdf5+dirty7.15 MiB8.39 MiB1.23 MiB
0459aee+dirty7.15 MiB8.38 MiB1.23 MiB
b74349e+dirty7.15 MiB8.39 MiB1.24 MiB
e42816c+dirty7.15 MiB8.39 MiB1.24 MiB
df05370+dirty7.15 MiB8.39 MiB1.23 MiB
d1a10a1+dirty7.15 MiB8.39 MiB1.24 MiB

Previous results on branch: antonis/feedback-webfixes

Startup times

RevisionPlainWith SentryDiff
d7f56e5+dirty391.04 ms397.85 ms6.81 ms
e9a7e86+dirty407.96 ms420.29 ms12.33 ms

App size

RevisionPlainWith SentryDiff
d7f56e5+dirty7.15 MiB8.39 MiB1.24 MiB
e9a7e86+dirty7.15 MiB8.39 MiB1.24 MiB

Base automatically changed from antonis/feedback-simplify-onaddscreenshot to feedback-uiFebruary 18, 2025 14:48
@antonis
Merge branch 'feedback-ui' into antonis/feedback-webfixes
01cb31d
# Conflicts:
#	packages/core/src/js/feedback/FeedbackWidget.tsx
@antonisantonis mentioned this pull request Feb 18, 2025
Closed
26 tasks
krystofwoldrich
krystofwoldrich approved these changes Feb 20, 2025
View reviewed changes

@krystofwoldrichkrystofwoldrich left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you! Works as expected with Expo Web.

@antonis
antonis merged commit ef4be9e into feedback-uiFeb 20, 2025
@antonis
antonis deleted the antonis/feedback-webfixes branch February 20, 2025 07:59
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@lucas-zimermanlucas-zimermanAwaiting requested review from lucas-zimerman
1 more reviewer
@krystofwoldrichkrystofwoldrichkrystofwoldrich approved these changes
Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@antonis@lucas-zimerman@krystofwoldrich