Switch Component doesn't disable click functionality when disabled

[amarlette]

Description

When using a screen reader the Switch component doesn't disable click functionality.

This issue is covered in-depth by parent issue #30840, please check there for more details.

Issue #30706 is similar to this issue and should be taken into account when creating a solution.

React Native version:

0.63

[wertlop]

Can I take this issue?

[amarlette]

@wertlop yes you are welcome to pick up this issue. Please mention the issue number in your pull request so that it links back. Thank you!

[smash-96]

@amarlette Hi, I'd like to work on this issue if it is still available
I see that the issue is still in backlog and has no updates. It says @fabriziobertoglio1987 closed it but the issue is still open.

Kindly clarify and let me know, thankyou!

[mdaj06]

hi @amarlette! i can have a go at this if its still open

[fabOnReact]

I closed my pr for this reason #31199 (comment). Interesting ideas:

react-native/ReactAndroid/src/main/java/com/facebook/react/views/switchview/ReactSwitch.java

Lines 38 to 50 in 3bd1159

	@Override
	public void setChecked(boolean checked) {
	if (mAllowChange && isChecked() != checked) {
	mAllowChange = false;
	super.setChecked(checked);
	setTrackColor(checked);
	} else {
	// Even if mAllowChange is set to false or the checked value hasn't changed, we still must
	// call the super method, since it will make sure the thumb is moved back to the correct edge.
	// Without calling the super method, the thumb might stuck in the middle of the switch.
	super.setChecked(isChecked());
	}
	}

I also want to investigate the Switch .js, .cpp and .java libraries and how changes to other .js components or .java classes may have caused this issue, including the Accessibility .java libraries.

Seems that my pr adds accessibilityState to the Switch component, but breaks the disabled prop/functionality.
I think that the AccessibilityDelegate must set certain properties when accessibilityState is passed in the Switch component which over-ride his disabled prop. The solution may be in AccessibilityDelegate or other relative classes

react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/ReactAccessibilityDelegate.java

Lines 137 to 138 in 3bd1159

	case SWITCH:
	return "android.widget.Switch";

react-native/ReactAndroid/src/main/java/com/facebook/react/uimanager/ReactAccessibilityDelegate.java

Lines 354 to 362 in 3bd1159

	} else if (state.equals(STATE_CHECKED) && value.getType() == ReadableType.Boolean) {
	final boolean boolValue = value.asBoolean();
	info.setCheckable(true);
	info.setChecked(boolValue);
	if (info.getClassName().equals(AccessibilityRole.getValue(AccessibilityRole.SWITCH))) {
	info.setText(
	context.getString(
	boolValue ? R.string.state_on_description : R.string.state_off_description));
	}