Skip to content

Commit ad7d3e3

Browse files
antoniskrystofwoldrichlucas-zimerman
authored
fix(feedback): Fixes accessibility issue on iOS (#4739)
* Update the client implementation to use the new capture feedback js api * Updates SDK API * Adds new feedback button in the sample * Adds changelog * Removes unused mock * Update CHANGELOG.md Co-authored-by: Krystof Woldrich <[email protected]> * Directly use captureFeedback from sentry/core * Use import from core * Fixes imports order lint issue * Fixes build issue * Adds captureFeedback tests from sentry-javascript * Update CHANGELOG.md * Only deprecate client captureUserFeedback * Add simple form UI * Adds basic form functionality * Update imports * Update imports * Remove useState hook to avoid multiple react instances issues * Move types and styles in different files * Removes attachment button to be added back separately along with the implementation * Add basic field validation * Adds changelog * Updates changelog * Updates changelog * Trim whitespaces from the submitted feedback * Adds tests * Renames FeedbackFormScreen to FeedbackForm * Add beta label * Extract default text to constants * Moves constant to a separate file and aligns naming with JS * Adds input text labels * Close screen before sending the feedback to minimise wait time Co-authored-by: LucasZF <[email protected]> * Rename file for consistency * Flatten configuration hierarchy and clean up * Align required values with JS * Use Sentry user email and name when set * Simplifies email validation * Show success alert message * Aligns naming with JS and unmounts the form by default * Use the minimum config without props in the changelog * Adds development not for unimplemented function * Show email and name conditionally * Adds sentry branding (png logo) * Adds sentry logo resource * Add assets in module exports * Revert "Add assets in module exports" This reverts commit 5292475. * Revert "Adds sentry logo resource" This reverts commit d6e9229. * Revert "Adds sentry branding (png logo)" This reverts commit 8c56753. * Add last event id * Mock lastEventId * Adds beta note in the changelog * Autoinject feedback form * Updates changelog * Align colors with JS * Update CHANGELOG.md Co-authored-by: Krystof Woldrich <[email protected]> * Update CHANGELOG.md Co-authored-by: Krystof Woldrich <[email protected]> * Update CHANGELOG.md Co-authored-by: Krystof Woldrich <[email protected]> * Use regular fonts for both buttons * Handle keyboard properly * Adds an option on whether the email should be validated * Merge properties only once * Loads current user data on form construction * Remove unneeded extra padding * Fix background color issue * Adds feedback button * Updates the changelog * Fixes changelog typo * Updates styles background color Co-authored-by: Krystof Woldrich <[email protected]> * Use defaultProps * Correct defaultProps * Adds test to verify when getUser is called * Use smaller image Co-authored-by: LucasZF <[email protected]> * Add margin next to the icon * Adds bottom spacing in the ErrorScreen so that the feedback button does not hide the scrollview buttons * (2.2) feat: Add Feedback Form UI Branding logo (#4357) * Adds sentry branding logo as a base64 encoded png --------- Co-authored-by: LucasZF <[email protected]> * Autoinject feedback form (#4370) * Align changelog entry * Update changelog * Disable bouncing * Add modal ui appearance * Update snapshot tests * Fix bottom margin * Fix sheet height * Remove extra modal border * Do not expose modal styles * Animate background color * Avoid keyboard in modal * Update changelog * Fix changelog * Updates comment * Extract FeedbackButtonProps * Add public function description to satisfy lint check * Adds tests * Fix tests * Add hardcoded dark and light color themes * Rename theme options * Update snapshot tests * Include in the feedback integration * Fix circular dependency * Add theme integration options * Adds changelog * Add comment note * Align with JS api * Remove unneeded line Co-authored-by: Krystof Woldrich <[email protected]> * Place widget button below the feedback widget shadow * Expose showFeedbackButton/hideFeedbackButton methods * Add dummy integration for tracking usage * Adds button border * Fixes tests * Add accentBackground and accentForeground colors * Extract integration getter in a helper function * Adds dynamic theming support * Add snapshot tests * Show screenshot button UI * Add screenshot button integration * Add screenshot icon * Adds Take a screenshot button in FeedbackWidget * Updates snapshot tests * Fix circularDepCheck * Fix circularDepCheck * Attache captured screenshot * Hide the take screenshot button when there is a screenshot * Convert uint8Array to Base64 on the native side * ref(feedback): Extracts FeedbackWidgetProvider in a separate file * Updates exposed comments * Adds snapshot tests * Disable functionality on the Web * Add screenshot button in the sample expo app * Adds system theme tests * Test dynamically changed theme * Remove showScreenshotButton and hideScreenshotButton from the exposed api * Fix function name typo * Adds enableTakeScreenshot option * Adds happy flow test * Make flow tests more granular * Increate wait time out to fix flakiness on ci * Reset widget state after each test * Fix CI flakiness * Remove flaky test * fix(feedback): Fixes accessibility issue on iOS * Add changelog --------- Co-authored-by: Krystof Woldrich <[email protected]> Co-authored-by: LucasZF <[email protected]>
1 parent 7f8e673 commit ad7d3e3

File tree

5 files changed

+33
-15
lines changed

5 files changed

+33
-15
lines changed

Diff for: CHANGELOG.md

+1
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
### Fixes
1818

1919
- Avoid silent failure when JS bundle was not created due to Sentry Xcode scripts failure ([#4690](https://github.com/getsentry/sentry-react-native/pull/4690))
20+
- Fixes Feedback Widget accessibility issue on iOS ([#4739](https://github.com/getsentry/sentry-react-native/pull/4739))
2021

2122
### Dependencies
2223

Diff for: packages/core/src/js/feedback/FeedbackWidget.tsx

+5-1
Original file line numberDiff line numberDiff line change
@@ -262,7 +262,11 @@ export class FeedbackWidget extends React.Component<FeedbackWidgetProps, Feedbac
262262
}
263263

264264
return (
265-
<TouchableWithoutFeedback onPress={notWeb() ? Keyboard.dismiss: undefined}>
265+
<TouchableWithoutFeedback
266+
onPress={notWeb() ? Keyboard.dismiss : undefined}
267+
accessible={false}
268+
accessibilityElementsHidden={false}
269+
>
266270
<View style={styles.container}>
267271
<View style={styles.titleContainer}>
268272
<Text style={styles.title}>{text.formTitle}</Text>

Diff for: packages/core/test/feedback/ScreenshotButton.test.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -181,7 +181,7 @@ describe('ScreenshotButton', () => {
181181
const takeScreenshotButtonAfterCapture = queryByText('Take a screenshot');
182182
expect(takeScreenshotButtonAfterCapture).toBeNull();
183183
});
184-
184+
185185
await waitFor(() => {
186186
const removeScreenshotButtonAfterCapture = queryByText('Remove screenshot');
187187
expect(removeScreenshotButtonAfterCapture).toBeTruthy();

Diff for: packages/core/test/feedback/__snapshots__/FeedbackWidget.test.tsx.snap

+12-6
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
exports[`FeedbackWidget matches the snapshot with custom styles 1`] = `
44
<View
5+
accessibilityElementsHidden={false}
56
accessibilityState={
67
{
78
"busy": undefined,
@@ -11,7 +12,7 @@ exports[`FeedbackWidget matches the snapshot with custom styles 1`] = `
1112
"selected": undefined,
1213
}
1314
}
14-
accessible={true}
15+
accessible={false}
1516
focusable={true}
1617
onClick={[Function]}
1718
onResponderGrant={[Function]}
@@ -235,6 +236,7 @@ exports[`FeedbackWidget matches the snapshot with custom styles 1`] = `
235236

236237
exports[`FeedbackWidget matches the snapshot with custom styles and screenshot button 1`] = `
237238
<View
239+
accessibilityElementsHidden={false}
238240
accessibilityState={
239241
{
240242
"busy": undefined,
@@ -244,7 +246,7 @@ exports[`FeedbackWidget matches the snapshot with custom styles and screenshot b
244246
"selected": undefined,
245247
}
246248
}
247-
accessible={true}
249+
accessible={false}
248250
focusable={true}
249251
onClick={[Function]}
250252
onResponderGrant={[Function]}
@@ -525,6 +527,7 @@ exports[`FeedbackWidget matches the snapshot with custom styles and screenshot b
525527

526528
exports[`FeedbackWidget matches the snapshot with custom texts 1`] = `
527529
<View
530+
accessibilityElementsHidden={false}
528531
accessibilityState={
529532
{
530533
"busy": undefined,
@@ -534,7 +537,7 @@ exports[`FeedbackWidget matches the snapshot with custom texts 1`] = `
534537
"selected": undefined,
535538
}
536539
}
537-
accessible={true}
540+
accessible={false}
538541
focusable={true}
539542
onClick={[Function]}
540543
onResponderGrant={[Function]}
@@ -789,6 +792,7 @@ exports[`FeedbackWidget matches the snapshot with custom texts 1`] = `
789792

790793
exports[`FeedbackWidget matches the snapshot with custom texts and screenshot button 1`] = `
791794
<View
795+
accessibilityElementsHidden={false}
792796
accessibilityState={
793797
{
794798
"busy": undefined,
@@ -798,7 +802,7 @@ exports[`FeedbackWidget matches the snapshot with custom texts and screenshot bu
798802
"selected": undefined,
799803
}
800804
}
801-
accessible={true}
805+
accessible={false}
802806
focusable={true}
803807
onClick={[Function]}
804808
onResponderGrant={[Function]}
@@ -1116,6 +1120,7 @@ exports[`FeedbackWidget matches the snapshot with custom texts and screenshot bu
11161120

11171121
exports[`FeedbackWidget matches the snapshot with default configuration 1`] = `
11181122
<View
1123+
accessibilityElementsHidden={false}
11191124
accessibilityState={
11201125
{
11211126
"busy": undefined,
@@ -1125,7 +1130,7 @@ exports[`FeedbackWidget matches the snapshot with default configuration 1`] = `
11251130
"selected": undefined,
11261131
}
11271132
}
1128-
accessible={true}
1133+
accessible={false}
11291134
focusable={true}
11301135
onClick={[Function]}
11311136
onResponderGrant={[Function]}
@@ -1380,6 +1385,7 @@ exports[`FeedbackWidget matches the snapshot with default configuration 1`] = `
13801385

13811386
exports[`FeedbackWidget matches the snapshot with default configuration and screenshot button 1`] = `
13821387
<View
1388+
accessibilityElementsHidden={false}
13831389
accessibilityState={
13841390
{
13851391
"busy": undefined,
@@ -1389,7 +1395,7 @@ exports[`FeedbackWidget matches the snapshot with default configuration and scre
13891395
"selected": undefined,
13901396
}
13911397
}
1392-
accessible={true}
1398+
accessible={false}
13931399
focusable={true}
13941400
onClick={[Function]}
13951401
onResponderGrant={[Function]}

Diff for: packages/core/test/feedback/__snapshots__/FeedbackWidgetManager.test.tsx.snap

+14-7
Original file line numberDiff line numberDiff line change
@@ -702,6 +702,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with cus
702702
>
703703
<View>
704704
<View
705+
accessibilityElementsHidden={false}
705706
accessibilityState={
706707
{
707708
"busy": undefined,
@@ -711,7 +712,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with cus
711712
"selected": undefined,
712713
}
713714
}
714-
accessible={true}
715+
accessible={false}
715716
focusable={true}
716717
onClick={[Function]}
717718
onResponderGrant={[Function]}
@@ -1049,6 +1050,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with cus
10491050
>
10501051
<View>
10511052
<View
1053+
accessibilityElementsHidden={false}
10521054
accessibilityState={
10531055
{
10541056
"busy": undefined,
@@ -1058,7 +1060,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with cus
10581060
"selected": undefined,
10591061
}
10601062
}
1061-
accessible={true}
1063+
accessible={false}
10621064
focusable={true}
10631065
onClick={[Function]}
10641066
onResponderGrant={[Function]}
@@ -1396,6 +1398,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with def
13961398
>
13971399
<View>
13981400
<View
1401+
accessibilityElementsHidden={false}
13991402
accessibilityState={
14001403
{
14011404
"busy": undefined,
@@ -1405,7 +1408,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with def
14051408
"selected": undefined,
14061409
}
14071410
}
1408-
accessible={true}
1411+
accessible={false}
14091412
focusable={true}
14101413
onClick={[Function]}
14111414
onResponderGrant={[Function]}
@@ -1743,6 +1746,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with def
17431746
>
17441747
<View>
17451748
<View
1749+
accessibilityElementsHidden={false}
17461750
accessibilityState={
17471751
{
17481752
"busy": undefined,
@@ -1752,7 +1756,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with def
17521756
"selected": undefined,
17531757
}
17541758
}
1755-
accessible={true}
1759+
accessible={false}
17561760
focusable={true}
17571761
onClick={[Function]}
17581762
onResponderGrant={[Function]}
@@ -2090,6 +2094,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with def
20902094
>
20912095
<View>
20922096
<View
2097+
accessibilityElementsHidden={false}
20932098
accessibilityState={
20942099
{
20952100
"busy": undefined,
@@ -2099,7 +2104,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with def
20992104
"selected": undefined,
21002105
}
21012106
}
2102-
accessible={true}
2107+
accessible={false}
21032108
focusable={true}
21042109
onClick={[Function]}
21052110
onResponderGrant={[Function]}
@@ -2437,6 +2442,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with sys
24372442
>
24382443
<View>
24392444
<View
2445+
accessibilityElementsHidden={false}
24402446
accessibilityState={
24412447
{
24422448
"busy": undefined,
@@ -2446,7 +2452,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with sys
24462452
"selected": undefined,
24472453
}
24482454
}
2449-
accessible={true}
2455+
accessible={false}
24502456
focusable={true}
24512457
onClick={[Function]}
24522458
onResponderGrant={[Function]}
@@ -2784,6 +2790,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with sys
27842790
>
27852791
<View>
27862792
<View
2793+
accessibilityElementsHidden={false}
27872794
accessibilityState={
27882795
{
27892796
"busy": undefined,
@@ -2793,7 +2800,7 @@ exports[`FeedbackButtonManager the Feedback Widget matches the snapshot with sys
27932800
"selected": undefined,
27942801
}
27952802
}
2796-
accessible={true}
2803+
accessible={false}
27972804
focusable={true}
27982805
onClick={[Function]}
27992806
onResponderGrant={[Function]}

0 commit comments

Comments
 (0)