Tengo un componente que usa async y await .
Estoy tratando de probar si se representa el marcador de posición para la entrada.
Sin embargo, siempre obtengo el error anterior.
Este es el componente:
const [Loading, setLoading] = useState(false) const [name, setName] = useState(''); const [options, setOptions] = useState([]) const [data, setData] = useState(false) useEffect(() => { setLoading(true) const newUsers = async() => { const response = await fetch('https://jsonplaceholder.typicode.com/users') .then((res) => res.json()) .then((data) => { setData(data) }); }; newUsers(); }, []) if (!data) return <p className = 'text-center font-bold text-6xl' > Loading... < /p> if (!Loading) return <p className = 'text-center font-bold text-6xl' > Data loaded < /p> <input id = "input" className = 'w-96 h-16 border-1 shadow-lg rounded-lg' placeholder = "Search..." onChange = { e => handleChange(e.target.value) } value = { name } />esta es la prueba
test('input appears', async () => { await waitFor(() => { expect(screen.getByPlaceholderText('Search...')).toBeInTheDocument() }) })Parece que olvidaste devolver la entrada
const [Loading, setLoading] = useState(false) const [name, setName] = useState(''); const [options, setOptions] = useState([]) const [data, setData] = useState(false) useEffect(() => { setLoading(true) const newUsers = async() => { const response = await fetch('https://jsonplaceholder.typicode.com/users') .then((res) => res.json()) .then((data) => { setData(data) }); }; newUsers(); }, []) if (!data) return <p className = 'text-center font-bold text-6xl' > Loading... < /p> if (!Loading) return <p className = 'text-center font-bold text-6xl' > Data loaded < /p> return ( // <---- Return <input id = "input" className = 'w-96 h-16 border-1 shadow-lg rounded-lg' placeholder = "Search..." onChange = { e => handleChange(e.target.value) } value = { name } /> );