Skip to content

Commit fc0ec5d

Browse files
NickGerlemanNickGerleman
committed
Revert "Implement accessibilityState (microsoft#4617)"
This reverts commit 9718f84.
1 parent 9b2a305 commit fc0ec5d

File tree

2 files changed

+22
-93
lines changed

2 files changed

+22
-93
lines changed

‎vnext/ReactUWP/Views/FrameworkElementViewManager.cpp‎

Lines changed: 3 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -141,21 +141,12 @@ void FrameworkElementViewManager::TransferProperties(XamlView oldView, XamlView
141141
}
142142
}
143143

144-
static folly::dynamic GetAccessibilityStateProps() {
145-
folly::dynamic props = folly::dynamic::object();
146-
147-
props.update(folly::dynamic::object("selected", "boolean")("disabled", "boolean")("checked", "string")(
148-
"busy", "boolean")("expanded", "boolean"));
149-
return props;
150-
}
151-
152144
folly::dynamic FrameworkElementViewManager::GetNativeProps() const {
153145
folly::dynamic props = Super::GetNativeProps();
154146
props.update(folly::dynamic::object("accessible", "boolean")("accessibilityRole", "string")(
155-
"accessibilityStates", "array")("accessibilityState", GetAccessibilityStateProps())(
156-
"accessibilityHint", "string")("accessibilityLabel", "string")("accessibilityPosInSet", "number")(
157-
"accessibilitySetSize", "number")("testID", "string")("tooltip", "string")("accessibilityActions", "array")(
158-
"accessibilityLiveRegion", "string"));
147+
"accessibilityStates", "array")("accessibilityHint", "string")("accessibilityLabel", "string")(
148+
"accessibilityPosInSet", "number")("accessibilitySetSize", "number")("testID", "string")("tooltip", "string")(
149+
"accessibilityActions", "array")("accessibilityLiveRegion", "string"));
159150
return props;
160151
}
161152

@@ -419,49 +410,6 @@ bool FrameworkElementViewManager::UpdateProperty(
419410
}
420411
}
421412

422-
DynamicAutomationProperties::SetAccessibilityStateSelected(
423-
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Selected)]);
424-
DynamicAutomationProperties::SetAccessibilityStateDisabled(
425-
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Disabled)]);
426-
DynamicAutomationProperties::SetAccessibilityStateChecked(
427-
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Checked)]);
428-
DynamicAutomationProperties::SetAccessibilityStateUnchecked(
429-
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Unchecked)]);
430-
DynamicAutomationProperties::SetAccessibilityStateBusy(
431-
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Busy)]);
432-
DynamicAutomationProperties::SetAccessibilityStateExpanded(
433-
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Expanded)]);
434-
DynamicAutomationProperties::SetAccessibilityStateCollapsed(
435-
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Collapsed)]);
436-
} else if (propertyName == "accessibilityState") {
437-
bool states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::CountStates)] = {};
438-
439-
if (propertyValue.isObject()) {
440-
for (const auto &pair : propertyValue.items()) {
441-
const std::string &innerName = pair.first.getString();
442-
const folly::dynamic &innerValue = pair.second;
443-
444-
if (innerName == "selected")
445-
states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Selected)] = innerValue.getBool();
446-
else if (innerName == "disabled")
447-
states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Disabled)] = innerValue.getBool();
448-
else if (innerName == "checked") {
449-
states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Checked)] =
450-
innerValue.isBool() && innerValue.getBool();
451-
states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Unchecked)] =
452-
innerValue.isBool() && !innerValue.getBool();
453-
// If the state is "mixed" we'll just set both Checked and Unchecked to false,
454-
// then later in the IToggleProvider implementation it will return the Intermediate state
455-
// due to both being set to false (see DynamicAutomationPeer::ToggleState()).
456-
} else if (innerName == "busy")
457-
states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Busy)] = innerValue.getBool();
458-
else if (innerName == "expanded") {
459-
states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Expanded)] = innerValue.getBool();
460-
states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Collapsed)] = !innerValue.getBool();
461-
}
462-
}
463-
}
464-
465413
DynamicAutomationProperties::SetAccessibilityStateSelected(
466414
element, states[static_cast<int32_t>(winrt::react::uwp::AccessibilityStates::Selected)]);
467415
DynamicAutomationProperties::SetAccessibilityStateDisabled(

‎vnext/src/RNTester/js/examples-win/Accessibility/AccessibilityExampleWindows.tsx‎

Lines changed: 19 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -270,7 +270,7 @@ class AccessibilityStateExamples extends React.Component {
270270
public state = {
271271
viewDisabled: false,
272272
itemsSelected: [false, false, false],
273-
viewChecked: 0,
273+
viewChecked: false,
274274
viewBusy: false,
275275
viewCollapsed: false,
276276
};
@@ -294,7 +294,7 @@ class AccessibilityStateExamples extends React.Component {
294294
backgroundColor: this.state.viewDisabled ? 'gray' : 'lightskyblue',
295295
}}
296296
accessibilityRole="none"
297-
accessibilityState={{disabled: this.state.viewDisabled}}>
297+
accessibilityStates={this.state.viewDisabled ? ['disabled'] : []}>
298298
<Text>
299299
This View should be{' '}
300300
{this.state.viewDisabled ? 'disabled' : 'enabled'} according to UIA
@@ -318,9 +318,9 @@ class AccessibilityStateExamples extends React.Component {
318318
}}
319319
accessibilityRole="button"
320320
accessibilityLabel={'Selectable item ' + (item.index + 1)}
321-
accessibilityState={{
322-
selected: this.state.itemsSelected[item.index],
323-
}}
321+
accessibilityStates={
322+
this.state.itemsSelected[item.index] ? ['selected'] : []
323+
}
324324
onPress={() => this.selectPress(item.index)}>
325325
<Text>
326326
{this.state.itemsSelected[item.index]
@@ -332,8 +332,8 @@ class AccessibilityStateExamples extends React.Component {
332332
keyExtractor={(item, index) => index.toString()}
333333
/>
334334
<Text>
335-
The following TouchableHighlight cycles accessibilityState.checked
336-
through unchecked/checked/mixed for the View under it:
335+
The following TouchableHighlight toggles accessibilityState.checked
336+
and accessibilityState.unchecked for the View under it:
337337
</Text>
338338
<TouchableHighlight
339339
style={{width: 100, height: 50, backgroundColor: 'blue'}}
@@ -343,37 +343,22 @@ class AccessibilityStateExamples extends React.Component {
343343
</TouchableHighlight>
344344
<View
345345
style={{
346-
backgroundColor:
347-
this.state.viewChecked === 0
348-
? 'green'
349-
: this.state.viewChecked === 1
350-
? 'gray'
351-
: 'lightskyblue',
346+
backgroundColor: this.state.viewChecked ? 'gray' : 'lightskyblue',
352347
}}
353348
//@ts-ignore
354349
accessibilityRole="checkbox"
355350
//@ts-ignore
356-
accessibilityState={{
357-
checked:
358-
this.state.viewChecked === 0
359-
? false
360-
: this.state.viewChecked === 1
361-
? true
362-
: 'mixed',
363-
}}>
351+
accessibilityStates={
352+
this.state.viewChecked ? ['checked'] : ['unchecked']
353+
}>
364354
<Text>
365355
This View should be{' '}
366-
{this.state.viewChecked === 0
367-
? 'Unchecked'
368-
: this.state.viewChecked === 1
369-
? 'Checked'
370-
: 'Mixed'}{' '}
371-
according to UIA
356+
{this.state.viewChecked ? 'Checked' : 'Unchecked'} according to UIA
372357
</Text>
373358
</View>
374359
<Text>
375-
The following TouchableHighlight toggles the acessibilityState.busy
376-
for the View under it:
360+
The following TouchableHighlight toggles accessibilityState.busy for
361+
the View under it:
377362
</Text>
378363
<TouchableHighlight
379364
style={{width: 100, height: 50, backgroundColor: 'blue'}}
@@ -387,7 +372,7 @@ class AccessibilityStateExamples extends React.Component {
387372
}}
388373
accessibilityRole="none"
389374
//@ts-ignore
390-
accessibilityState={{busy: this.state.viewBusy}}>
375+
accessibilityStates={this.state.viewBusy ? ['busy'] : []}>
391376
<Text>
392377
This View should be {this.state.viewBusy ? 'Busy' : 'Not Busy'}{' '}
393378
according to UIA
@@ -410,9 +395,9 @@ class AccessibilityStateExamples extends React.Component {
410395
}}
411396
accessibilityRole="none"
412397
//@ts-ignore
413-
accessibilityState={{
414-
expanded: !this.state.viewCollapsed,
415-
}}>
398+
accessibilityStates={
399+
this.state.viewCollapsed ? ['collapsed'] : ['expanded']
400+
}>
416401
<Text>
417402
This View should be{' '}
418403
{this.state.viewCollapsed ? 'Collapsed' : 'Expanded'} according to
@@ -434,11 +419,7 @@ class AccessibilityStateExamples extends React.Component {
434419
};
435420

436421
private checkedPress = () => {
437-
let newChecked = this.state.viewChecked + 1;
438-
if (newChecked === 3) {
439-
newChecked = 0;
440-
}
441-
this.setState({viewChecked: newChecked});
422+
this.setState({viewChecked: !this.state.viewChecked});
442423
};
443424

444425
private busyPress = () => {

0 commit comments

Comments
 (0)