react-native-testing-library icon indicating copy to clipboard operation
react-native-testing-library copied to clipboard

"Unable to find node on an unmounted component" occurring with consecutive fireEvent.changeText() calls

Open gusbmurphy opened this issue 4 years ago • 1 comments

Describe the bug

While writing tests for my RN application, I was running into a problem where tests were failing with Unable to find node on an unmounted component., I was able to prevent that from happening be reordering a few lines of code so that two fireEvent.changeText() calls were no longer on consecutive lines, and am not sure why that seemed to be the solution.

Failing test

This block of code:

const minuteInput = getByA11yLabel(minuteInputA11yLabel);
const hourInput = getByA11yLabel(hourInputA11yLabel);
const numOfMinutes = randomIntFromInterval(5, 30);
const numOfHours = randomIntFromInterval(1, 3);
fireEvent.changeText(minuteInput, numOfMinutes.toString());
fireEvent.changeText(hourInput, numOfHours.toString());

Was producing this error:

Unable to find node on an unmounted component.

      307 |     const numOfHours = randomIntFromInterval(1, 3);
      308 |     fireEvent.changeText(minuteInput, numOfMinutes.toString());
    > 309 |     fireEvent.changeText(hourInput, numOfHours.toString());
          |               ^
      310 |
      311 |     nextButton = getByA11yLabel(nextButtonA11yLabel);
      312 |     fireEvent.press(nextButton);

Which went away when I changed that block of code to look like this:

const minuteInput = getByA11yLabel(minuteInputA11yLabel);
const numOfMinutes = randomIntFromInterval(5, 30);
fireEvent.changeText(minuteInput, numOfMinutes.toString());

const hourInput = getByA11yLabel(hourInputA11yLabel);
const numOfHours = randomIntFromInterval(1, 3);
fireEvent.changeText(hourInput, numOfHours.toString());

Expected behavior

I wouldn't have expected reordering those lines to have had an effect, which leads me to believe that there was some issue with calling consecutive fireEvent methods. I found a similar, older issue here. Am I on to something or is was there something else I corrected by reordering those lines?

Versions

  npmPackages:
    @testing-library/react-native: ^7.1.0 => 7.1.0 
    react: 16.13.1 => 16.13.1 
    react-native: 0.63.4 => 0.63.4 
    react-test-renderer: 16.13.1 => 16.13.1 

gusbmurphy avatar Mar 02 '21 18:03 gusbmurphy

Is it possible that hourInput disappears when minute input is edited? If so, this is expected. A proper repro would be helpful here.

thymikee avatar Mar 02 '21 18:03 thymikee

@gusbmurphy does the issue still occurs on the latest version of RNTL? If so please provide a repro repository, hopefully based on ours examples/basic app from our repo.

mdjastrzebski avatar Sep 26 '22 12:09 mdjastrzebski

Closing as stale.

@gusbmurphy If the issue still occurs on the latest version of RNTL, please provide a minimal repro repository, hopefully based on examples/basic app from our repo.

mdjastrzebski avatar Sep 30 '22 11:09 mdjastrzebski

Going from "^11.2.0" to "^11.3.0" fixed it for me

Norfeldt avatar Oct 19 '22 06:10 Norfeldt