Microsoft/react-native-windows

Add E2E Snapshot Tests for TouchableWithoutFeedback

Open

#11312 opened on Feb 27, 2023

View on GitHub
 (1 comment) (0 reactions) (0 assignees)C# (6,114 stars) (544 forks)batch import
Area: FabricArea: TestsArea: TouchableWithoutFeedbackNew ArchitectureWorkstream: Test Coverageenhancementgood first issue

Description

Add E2E Snapshots for the TouchableWithoutFeedback. Snapshots should include Composition visual tree and accessibility tree for the component.

STATUS TYPES

Status Description
Not Implemented Prop is not implemented for given architecture.
Not Completed No test or sample exists for the prop.
Sample Completed Sample exists for the prop, but sample is not run in a Jest Snapshot Test.
Completed Sample and Snapshot test exists for the prop.

PROPS STATUS FOR TOUCHABLEWITHOUTFEEDBACK

Test Description Status (Paper) Status (Fabric) Notes
Default [x] Sample Completed – RNTester [x] Completed
AccessibilityHint [ ] Not Completed [ ] Not Completed
AccessibilityLabel [ ] Not Completed [ ] Not Completed
AccessibilityActions [ ] Not Completed [ ] Not Completed
AccessibilityRole [ ] Not Completedr [x] Completed
AccessibilityValue [ ] Not Completed [ ] Not Completed
AccessibilityPosInSet [ ] Not Completed [x] Completed
AccessibilitySetSize [ ] Not Completed [x] Completed
AccessibilityLiveRegion [ ] Not Completed [x] Completed
ImportantforAccessibility – no-hide-descendants [ ] Not Completed [ ] Not Completed
testID [x] Sample Completed – RNTester [x] Completed
Style – backgroundColor [x] Sample Completed – RNTester [x] Completed
Style – borderBottomColor Not Implemented [ ] Not Completed
Style – borderBottomEndRadius [ ] Not Completed [ ] Not Completed
Style –borderBottomLeftRadius [ ] Not Completed [ ] Not Completed
Style – borderBottomRightRadius [ ] Not Completed [ ] Not Completed
Style – borderBottomStartRadius [ ] Not Completed [ ] Not Completed
Style – borderBottomWidth [ ] Not Completed [ ] Not Completed
Style – borderColor [ ] Not Completed [ ] Not Completed
Style – borderEndColor Not Implemented [ ] Not Completed
Style – borderLeftColor Not Implemented [ ] Not Completed
Style – borderLeftWidth [ ] Not Completed [ ] Not Completed
Style – borderRadius [x] Sample Completed – RNTester [ ] Not Completed
Style – borderRightColor Not Implemented [ ] Not Completed
Style – borderStartColor Not Implemented [ ] Not Completed
Style – borderStyle [ ] Not Completed [ ] Not Completed
Style – borderTopColor Not Implemented [ ] Not Completed
Style – borderTopEndRadius [ ] Not Completed [ ] Not Completed
Style – borderTopLeftRadius [ ] Not Completed [ ] Not Completed
Style – borderTopRightRadius [ ] Not Completed [ ] Not Completed
Style – borderTopStartRadius [ ] Not Completed [ ] Not Completed
Style – borderTopWidth [ ] Not Completed [ ] Not Completed
Style – borderWidth [ ] Not Completed [ ] Not Completed
Style – elevation Not Implemented [ ] Not Completed
Style – opacity [ ] Not Completed [ ] Not Completed
Style – height [ ] Not Completed [x] Completed
Style – width [ ] Not Completed [x] Completed
Style – overflow [ ] Not Completed [ ] Not Completed
Style – backfaceVisibility [ ] Not Completed [ ] Not Completed
Accessible [ ] Not Completed [ ] Not Completed
Focusable [ ] Not Completed [ ] Not Completed
HitSlop [x] Sample Completed – RNTester [ ] Not Completed
NativeID [ ] Not Completed [ ] Not Completed
NextFocus* [ ] Not Completed [ ] Not Completed
onAccessibilityAction [ ] Not Completed [ ] Not Completed
onAccessibilityTab [ ] Not Completed [ ] Not Completed
onAccessibilityEscape [ ] Not Completed [ ] Not Completed
onLayout [ ] Not Completed [ ] Not Completed
onMoveShoudlSetResponder [ ] Not Completed [ ] Not Completed
onMoveShouldSetResponderCapture [ ] Not Completed [ ] Not Completed
onResponderGrant [ ] Not Completed [ ] Not Completed
onResponderMove [ ] Not Completed [ ] Not Completed
onResponserReject [ ] Not Completed [ ] Not Completed
onResponderRelease [ ] Not Completed [ ] Not Completed
onResponderTerminate [ ] Not Completed [ ] Not Completed
onResponderTerminationRequest [ ] Not Completed [ ] Not Completed
onStartShouldSetResponder [ ] Not Completed [ ] Not Completed
onStartShouldSetResponderCatpure [ ] Not Completed [ ] Not Completed
pointerEvents [ ] Not Completed [ ] Not Completed
removeClippedSubviews [ ] Not Completed [ ] Not Completed
needsOffscreenAlphaCompositioning [ ] Not Completed [ ] Not Completed
toolTip [ ] Not Completed [ ] Not Completed
onFocus [ ] Not Completed [ ] Not Completed
onBlur [ ] Not Completedr [ ] Not Completed
onPress [x] Sample Completed – RNTester [x] Completed
onPressIn [ ] Not Completed [x] Completed
onPressOut [ ] Not Completed [x] Completed
onLongPress [ ] Not Completed [x] Completed
delayPressIn [ ] Not Completed [x] Completed
delayPressOut [ ] Not Completed [x] Completed
delayLongPress [ ] Not Completed [x] Completed
disabled [x] Sample Completed – RNTester [x] Completed
background [x] Sample Completed – RNTester [ ] Not Completed
touchSoundDisabled [ ] Not Completed [x] Completed

Contributor guide

Tech stack
typescriptreactjest
Domain
frontendtestingaccessibility
Issue type
test
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
3-5 days
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
fresh
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Familiarity with React NativeJest snapshot testingRNTester app
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
65
Research direction
Review the list of props in the issue body; many are marked Not Completed for both Paper and Fabric. For each prop, check if a RNTester sample already exists. If a sample exists, add a Jest snapshot test similar to existing tests for other components. If no sample exists, first create a sample in RNTester, then add the snapshot. The test should include both composition and accessibility tree snapshots. Focus on one prop at a time, starting with those that have a sample completed but no snapshot (e.g., borderRadius). Look at existing snapshot test files for TouchableWithoutFeedback in the repo for reference.