fix: support TextInput editable={false} prop check in isEnabled/isDisabled matchers

README.md

@@ -119,8 +119,11 @@ toBeDisabled();
 
 Check whether or not an element is disabled from a user perspective.
 
-This matcher will check if the element or its parent has a `disabled` prop, or if it has
-`accessibilityState={{disabled: true}}.
+This matcher will check if the element or its parent has any of those props :
+
+- `disabled={true}`
+- `accessibilityState={{disabled: true}}`
+- `editable={false}` (for `TextInput` only)
 
 It also works with `accessibilityStates={['disabled']}` for now. However, this prop is deprecated in
 React Native [0.62](https://reactnative.dev/blog/2020/03/26/version-0.62#breaking-changes)

src/__tests__/to-be-disabled.tsx

@@ -49,6 +49,20 @@ describe('.toBeDisabled', () => {
       expect(() => expect(queryByTestId(name)).not.toBeDisabled()).toThrow();
     });
   });
+
+  test('handle editable prop for TextInput', () => {
+    const { getByTestId } = render(
+      <View>
+        <TextInput testID="disabled" editable={false} />
+        <TextInput testID="enabled-by-default" />
+        <TextInput testID="enabled" editable />
+      </View>,
+    );
+
+    expect(getByTestId('disabled')).toBeDisabled();
+    expect(getByTestId('enabled-by-default')).not.toBeDisabled();
+    expect(getByTestId('enabled')).not.toBeDisabled();
+  });
 });
 
 describe('.toBeEnabled', () => {
@@ -79,12 +93,26 @@ describe('.toBeEnabled', () => {
       expect(() => expect(queryByTestId(name)).not.toBeEnabled()).toThrow();
     });
   });
+
+  test('handle editable prop for TextInput', () => {
+    const { getByTestId } = render(
+      <View>
+        <TextInput testID="enabled-by-default" />
+        <TextInput testID="enabled" editable />
+        <TextInput testID="disabled" editable={false} />
+      </View>,
+    );
+
+    expect(getByTestId('enabled-by-default')).toBeEnabled();
+    expect(getByTestId('enabled')).toBeEnabled();
+    expect(getByTestId('disabled')).not.toBeEnabled();
+  });
 });
 
 describe('for .toBeEnabled/Disabled Button', () => {
   test('handles disabled prop for button', () => {
     const { queryByTestId } = render(
-      <View testID="view">
+      <View>
         <Button testID="enabled" title="enabled" />
         <Button disabled testID="disabled" title="disabled" />
       </View>,
@@ -96,7 +124,7 @@ describe('for .toBeEnabled/Disabled Button', () => {
 
   test('handles button a11y state', () => {
     const { queryByTestId } = render(
-      <View testID="view">
+      <View>
         <Button accessibilityState={{ disabled: false }} testID="enabled" title="enabled" />
         <Button accessibilityState={{ disabled: true }} testID="disabled" title="disabled" />
       </View>,
@@ -108,7 +136,7 @@ describe('for .toBeEnabled/Disabled Button', () => {
 
   test('Errors when matcher misses', () => {
     const { queryByTestId, queryByText } = render(
-      <View testID="view">
+      <View>
         <Button testID="enabled" title="enabled" />
         <Button disabled testID="disabled" title="disabled" />
       </View>,

src/to-be-disabled.ts

@@ -18,6 +18,9 @@ const DISABLE_TYPES = [
 ];
 
 function isElementDisabled(element: ReactTestInstance) {
+  if (getType(element) === 'TextInput' && element?.props?.editable === false) {
+    return true;
+  }
   if (!DISABLE_TYPES.includes(getType(element))) return false;
 
   return (