add more tests for disabled state

anday013 · Jan 18, 2024 · 244112c · 244112c
1 parent 61a3f34
commit 244112c
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 0 deletions.
diff --git a/src/OtpInput/OtpInput.test.tsx b/src/OtpInput/OtpInput.test.tsx
@@ -58,6 +58,10 @@ describe("OtpInput", () => {
 
       const inputs = screen.getAllByTestId("otp-input");
       expect(inputs[0]).not.toHaveTextContent("1");
+      inputs.forEach((i) => expect(i).toBeDisabled());
+
+      const hiddenInput = screen.getByTestId("otp-input-hidden");
+      expect(hiddenInput).toBeDisabled();
     });
 
     test("focusColor should not be overridden by theme", () => {

diff --git a/src/OtpInput/OtpInput.tsx b/src/OtpInput/OtpInput.tsx
@@ -46,6 +46,7 @@ export const OtpInput = forwardRef<OtpInputRef, OtpInputProps>((props, ref) => {
             return (
               <Pressable
                 key={`${char}-${index}`}
+                disabled={disabled}
                 onPress={handlePress}
                 style={[
                   styles.codeContainer,
@@ -89,6 +90,8 @@ export const OtpInput = forwardRef<OtpInputRef, OtpInputProps>((props, ref) => {
         style={styles.hiddenInput}
         secureTextEntry={secureTextEntry}
         autoComplete="one-time-code"
+        aria-disabled={disabled}
+        editable={!disabled}
         testID="otp-input-hidden"
       />
     </View>

diff --git a/src/OtpInput/__snapshots__/OtpInput.test.tsx.snap b/src/OtpInput/__snapshots__/OtpInput.test.tsx.snap
@@ -410,6 +410,7 @@ exports[`OtpInput UI should render correctly 1`] = `
   <TextInput
     autoComplete="one-time-code"
     autoFocus={true}
+    editable={true}
     inputMode="numeric"
     maxLength={6}
     onChangeText={[Function]}