title: why @testing-library/react-native render do not respect !== undefined/ !==null if clause?
body: <p>I am writing a test using @testing-library/react-native to render my component and test the event onPress when the user press on a flatlist element. I have a list with a couple of elements, however, during its execution, it changes its value to undefined (which I also don't understand). So, when the list is undefined, it tries to render the elements of an undefined list. But the render should only happen when <code>if(myList !== undefined &amp;&amp; myList !== null)</code> and it still execute the code inside of this clause. Is it an expected behaviour? How can I stop it of executing it? I also have tested the if clause with <code>if(myList)</code> and having same result.</p>
  <p>MyComponent.js</p>
  <pre><code>const moods = useSelector(state =&gt; state.onboardingReducer.mood);
  
  const renderMoods = (itemData) =&gt; {
       console.log('I am on RENDER MOODS')
       if(moods!==undefined &amp;&amp; moods !== null){
              console.log('moods ' + JSON.stringify(moods))
              moodsCopy = [...moods];
        } 
        const textStyle = (moodsCopy)? {backgroundColor: 'red'} : {backgroundColor: 'blue'}
        return (&lt;View&gt;
                      &lt;TouchableOpacity
                          onPress={handleOnPress.bind(this, itemData.item)}&gt;
                          &lt;Text style={textStyle} data-testid=&quot;text&quot;&gt;{itemData.item.title}&lt;/Text&gt;
                      &lt;/TouchableOpacity&gt;
                  &lt;/View&gt;);
  };
  </code></pre>
  <p>myComponent-test.js</p>
  <pre><code>    import { render, fireEvent, waitForElementToBeRemoved } from '@testing-library/react-native';
  
  describe('events',  () =&gt; { 
          
          test('On press to remove item', async () =&gt; {
              useSelector.mockReturnValueOnce(userInfo).mockReturnValueOnce([ 
                  {name: 'Happy', id: '111'},
                  {name: 'In Love', id:'111'} 
             ]); 
  
             const { getByText, getByTestId, debug } = render(&lt;MoodList {...props}/&gt;);
  
          }
  }
  </code></pre>
  <p>On my console I get:</p>
  <pre><code>moods [{&quot;name&quot;:&quot;Happy&quot;,&quot;id&quot;:&quot;111&quot;},{&quot;name&quot;:&quot;In Love&quot;,&quot;id&quot;:&quot;111&quot;}]
  I am on RENDER MOODS
  moods undefined
  I am on RENDER MOODS
  </code></pre>
  <p>And finally I get an error:</p>
  <pre><code>TypeError: Invalid attempt to spread non-iterable instance.
      In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
  </code></pre>