rocketseat-education / bootcamp-gostack-desafios

Repositório contendo todos os desafios dos módulos do Bootcamp Gostack
https://pages.rocketseat.com.br/gostack
MIT License
1.18k stars 999 forks source link

Desafio 11 - fireEvent.changeText with problem #45

Closed pedrohasf closed 4 years ago

pedrohasf commented 4 years ago

The Problem In test "Should be able to list the food plates filtered by name search" the fireEvent.changeText function is called causing malfunctions due to it not going through the setSearchValue function and in consequence searchValue is not updated and the fake api is called with wrong values in the test. Instead of being called with 'Ao molho' it is called with an empty string due to the issue.

josepholiveira commented 4 years ago

Hello @pedrohasf!

I did not understand the issue, why would it not go throught the setSearchValue? The fireEvent.changeText should trigger the onChangeText on the input, and by that you could update the searchValue by calling the setSearchValue.

Upon calling the setSearchValue you would also trigger the useEffect, by adding the searchValue in it's dependency array.

If you could give us code examples, or a little video showing the problem happening we should be able to see if the problem is something else.

pedrohasf commented 4 years ago

Hello @josepholiveira My useEffect function is as follow:

useEffect(() => {
    async function loadFoods(): Promise<void> {
      if (searchValue && !selectedCategory) {
        const response = await api.get(`foods?name_like=${searchValue}`);
        setFoods(response.data);
        return;
      }
      if (selectedCategory && !searchValue.length) {
        const response = await api.get(
          `foods?category_like=${selectedCategory}`,
        );
        setFoods(response.data);
        return;
      }
      if (searchValue.length && selectedCategory) {
        const response = await api.get(
          `foods?name_like=${searchValue}&category_like=${selectedCategory}`,
        );
        setFoods(response.data);
        return;
      }
      if (!searchValue.length && !selectedCategory) {
        const response = await api.get('foods?name_like=');
        setFoods(response.data);
      }
    }

    loadFoods();
  }, [selectedCategory, searchValue]);

I have debugged and i saw that the variable searchValue on testing reaches the useEfffect function but with its value as an empty string and not as 'Ao molho' as the test needed it to be. I am not entirely certain that this is the problem but i believe it is, for searchValue to be an empty string it must not have been through setSearchValue.

Thanks for the support.

josepholiveira commented 4 years ago

Could you upload your code to github or message me on discord so i can take a better look at it?

Testing in my code returned me the correct searchValue, and i would like to take a look at it. My discord user is DOGIM#0985.