Disabling then enabling Stepper component causes text to disappear

[steven-haddix]

Describe the bug

Re-enabling a disabled Stepper component hides number text

To Reproduce

Steps to reproduce the behavior:

1. Render stepper component with disabled true
2. Stepper Text correctly shows with Grey50 color
3. User enables stepper via Switch component hooked up to useState
4. Re-render Stepper component with disabled false
5. Stepper Text is invisible

Expected behavior

When the stepper component is re-enabled the number Text is shown

Code snippet

export default function Example({ route, navigation }) {
  const [stepperValue, onChangeStepperValue] = useState(0)
  const [isStepperDisabled, onChangeIsStepperDisabled] = useState(false)

  return (
    <View flex center marginH-20>
      <Card paddingV-30 paddingH-30>
          <View row spread marginB-10>
            <Text text60>Switch:</Text>
            <Switch onValueChange={onChangeIsStepperDisabled} value={isStepperDisabled} />
          </View>
          <View row spread marginB-20 paddingL-20>
            <Text text70>Stepper: </Text>
            <Stepper
              minValue={0}
              maxValue={60}
              disabled={isStepperDisabled}
              onValueChange={onChangeStepperValue}
              value={stepperValue}
            />
          </View>
      </Card>
    </View>
  )
}

Screenshots

Device (please complete the following information)

• Device: Pixel 5a
• OS: Android 12
• Expo: 44
• ExpoGO: 2.23.2

Additional context

Only tested in the Expo Go application environment

[Inbal-Tish]

@steven-haddix Hi. I couldn't reproduce the issue on Android emulator. Is it only reproduced on Expo or on a real device?

[ethanshar]

Closing due to inactivity