feat: testID property for use with e2e testing without interfering with a11y (#9793)

* fix(android): nested frames were sometimes not recreated (#9748)

Co-authored-by: Eduardo Speroni <edusperoni@gmail.com>

* feat: testID property for use with e2e testing without interfering with a11y

* feat: better testID support along a11y

wip

* fix: make sure we have a defined id

* feat: --env.e2e to enable testID

* chore: return if using testID

* chore: cleanup

Co-authored-by: Eduardo Speroni <edusperoni@gmail.com>
Co-authored-by: Igor Randjelovic <rigor789@gmail.com>
This commit is contained in:
Nathan Walker
2022-03-08 14:25:05 -08:00
committed by GitHub
parent 86fdf5810a
commit 8be543bcc7
17 changed files with 123 additions and 37 deletions

View File

@ -7,25 +7,25 @@
<GridLayout padding="20" class="a11y-demo-page">
<ScrollView>
<StackLayout>
<Button text="Open Modal Page" class="view-item" tap="{{openModal}}" />
<Button text="Open Normal Page" class="view-item" tap="{{openNormal}}" />
<Button testID="openModalPageButton" text="Open Modal Page" class="view-item" tap="{{openModal}}" />
<Button testID="openNormalPageButton" text="Open Normal Page" class="view-item" tap="{{openNormal}}" />
<Label text="Accessible Label" class="view-item a11y text-center" accessibilityLabel="Accessible Label" accessibilityHint="Just a label" accessibilityRole="{{accessibilityRole.StaticText}}" accessibilityValue="Accessible Label" />
<Button text="Accessible Button" class="view-item a11y" accessibilityLabel="Accessible Button" accessibilityHint="Tapping this really does nothing" />
<Label testID="testLabel1" text="Accessible Label" class="view-item a11y text-center" accessibilityLabel="Accessible Label" accessibilityHint="Just a label" accessibilityRole="{{accessibilityRole.StaticText}}" accessibilityValue="Accessible Label" />
<Button testID="testLabel2" text="Accessible Button" class="view-item a11y" accessibilityLabel="Accessible Button" accessibilityHint="Tapping this really does nothing" />
<Image src="res://icon" width="50" class="view-item a11y" accessibilityLabel="Image with explicit attribute role" accessibilityRole="{{accessibilityRole.Image}}" />
<Image src="res://icon" width="50" class="view-item a11y a11y-role-image" accessibilityLabel="Image with css defined role" />
<Image testID="testImage1" src="res://icon" width="50" class="view-item a11y" accessibilityLabel="Image with explicit attribute role" accessibilityRole="{{accessibilityRole.Image}}" />
<Image testID="testImage2" src="res://icon" width="50" class="view-item a11y a11y-role-image" accessibilityLabel="Image with css defined role" />
<Image src="{{ largeImageSrc }}" width="50" class="view-item a11y a11y-role-image" accessibilityLabel="Image with css defined role" />
<Switch checked="true" class="view-item a11y" accessibilityLabel="Switch with attribute state" accessibilityState="{{accessibilityState.Checked}}" checkedChange="{{checkedChange}}" />
<Switch checked="true" class="view-item a11y a11y-state-checked" accessibilityLabel="Switch with css state" checkedChange="{{checkedChange}}" />
<Switch testID="testSwitch1" checked="true" class="view-item a11y" accessibilityLabel="Switch with attribute state" accessibilityState="{{accessibilityState.Checked}}" checkedChange="{{checkedChange}}" />
<Switch testID="testSwitch2" checked="true" class="view-item a11y a11y-state-checked" accessibilityLabel="Switch with css state" checkedChange="{{checkedChange}}" />
<TextView hint="TextView" text="{{switchCheckedText}}" class="view-item a11y" accessibilityLabel="TestView with a value" accessibilityLiveRegion="{{accessibilityLiveRegions.Polite}}" />
<TextField hint="TextField" class="view-item a11y" accessibilityLabel="Plain jane TextField" accessibilityHint="Tell us your real name Jane" />
<TextView testID="testTextView" hint="TextView" text="{{switchCheckedText}}" class="view-item a11y" accessibilityLabel="TestView with a value" accessibilityLiveRegion="{{accessibilityLiveRegions.Polite}}" />
<TextField testID="testTextField" hint="TextField" class="view-item a11y" accessibilityLabel="Plain jane TextField" accessibilityHint="Tell us your real name Jane" />
<TextView hint="TextView" class="view-item a11y" accessibilityLabel="Nice TextView" accessibilityHint="Tell us about yourself Jane" />
<GridLayout rows="25" columns="*" class="view-item" accessibilityLabel="No can go GridLayout" accessibilityHint="A grid that will not get bigger when increasing accessible text size">
<GridLayout testID="testGridLayout1" rows="25" columns="*" class="view-item" accessibilityLabel="No can go GridLayout" accessibilityHint="A grid that will not get bigger when increasing accessible text size">
<Label text="IN-Accessible Grid" class="view-item text-center" />
</GridLayout>
<GridLayout rows="25,25" columns="*,50" class="view-item a11y" accessibilityLabel="Yes an accessible GridLayout" accessibilityHint="A grid that WILL get bigger dynamically when increasing accessible text size">
@ -33,7 +33,7 @@
<Label row="1" text="With another item in a row" class="view-item text-center" />
<Label rowSpan="2" col="1" text="Hi" />
</GridLayout>
<Slider value="10" minValue="0" maxValue="100" class="view-item a11y" accessibilityLabel="Slider" accessibilityHint="A smooth slider" accessibilityValue="10" />
<Slider testID="testSlider" value="10" minValue="0" maxValue="100" class="view-item a11y" accessibilityLabel="Slider" accessibilityHint="A smooth slider" accessibilityValue="10" />
</StackLayout>
</ScrollView>
</GridLayout>