CODEWITHSUNDEEP
typescriptreact-nativereact-hooksreact-testing-library
Victor Guedes
Victor Guedes

Reputation: 41

Failed Testing Switch React Native with Testing Library

I'm getting the following error when trying to simulate an event using fireEvent "onChange" : "TypeError: Cannot read property 'value' of undefined"

My component :

const [isActive, setIsActive] = useState<boolean>(policy_value);

  const handleChangeSwitch = () => { 
    const value = !isActive;
    settingsService.updatePolicy(id, value);
    setIsActive(!isActive);
  };

    <Switch value={isActive}  onChange={handleChangeSwitch} testID="policy-switch"/>

My test:

const { getByTestId } = render(<Policy data={mockPolicy} />);

let switchButton = getByTestId("policy-switch")

fireEvent(switchButton, "onChange", { value: true });

expect(settingsService.updatePolicy).toHaveBeenCalled();

I tried:

fireEvent(switchButton, "onChange", { value: true });
fireEvent(switchButton, "onChange", true);
fireEvent(switchButton, "onChange");

Upvotes: 1

Views: 2195

Answers (1)

Victor Guedes
Victor Guedes

Reputation: 41

I solved this problem by changing onChange to onValueChange

<Switch value={isActive}  onValueChange={handleChangeSwitch} testID="policy-switch"/>


const { getByTestId } = render(<Policy data={mockPolicy} />);

let switchButton = getByTestId("policy-switch")

fireEvent(switchButton, "onValueChange", true);

expect(settingsService.updatePolicy).toHaveBeenCalled();

Upvotes: 3

Related Questions