Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

findBy* and waitForElement* not returning HTMLElement anymore (since 6.1.0) (works in dom-testing-library) #345

Closed
joual opened this issue Apr 5, 2019 · 10 comments · Fixed by #346
Labels

Comments

@joual
Copy link
Contributor

joual commented Apr 5, 2019

  • react-testing-library version: 6.1.x
  • react version: ^16.8.3
  • node version: 10.15.x
  • npm (or yarn) version: 6.9.0

Relevant code or config:

The following test fails in react-testing-library

test('findByTestId returns the element', async () => {
  const ref = React.createRef()
  const {findByTestId, getByTestId} = render(
    <div ref={ref} data-testid="foo" />,
  )
  await expect(findByTestId('foo')).resolves.toEqual(getByTestId('foo'))
})

While the following test passes in dom-testing-library

test('waits for element to appear in a specified container', async () => {
  const {rerender, container, getByTestId} = render('<div />')
  const promise = waitForElement(() => getByTestId('div'), {container})
  setTimeout(() => rerender('<div data-testid="div" />'))
  const element = await promise
  expect(element).toEqual(getByTestId('div'))
})

What you did:

I was trying to use the findByTestId API to grab an element.

What happened:

The resolved value is undefined in react-testing-library 6.1.x but returns fine in 6.0.0.

Reproduction:

See the above scenarios above.

Problem description:

Code that used to leverage the elements returned by findBy* and waitFor* will now start to fail.

Suggested solution:

I suspect this has to do with the recent asyncWrapper addition, which is set to cb => cb() in DTL but likely something that doesn't return the value in RTL.

@kentcdodds
Copy link
Member

I've reproduced this. I'm working on a fix

@joual
Copy link
Contributor Author

joual commented Apr 5, 2019

  const result = await cb()
  // make all effects resolve after
  act(() => {})
  return result;

in act-compat seems to fix it for me

@kentcdodds
Copy link
Member

That's what I was thinking as well, but it's not working for me 🤔

@joual
Copy link
Contributor Author

joual commented Apr 5, 2019

Let me open a quick PR to check.

@kentcdodds
Copy link
Member

Interestingly, that fixes findBy* but not waitForElement 🤔

@kentcdodds
Copy link
Member

Oh, nevermind. That was something else. I'll have this fixed in a moment.

@kentcdodds
Copy link
Member

I'll just push to master and consider your feedback a review 😉

@joual
Copy link
Contributor Author

joual commented Apr 5, 2019

Oh! Interesting indeed, ya okay I'll close my PR then.

@kentcdodds
Copy link
Member

Oh, I didn't notice you made one! I'll merge yours!

@joual joual mentioned this issue Apr 5, 2019
4 tasks
kentcdodds pushed a commit that referenced this issue Apr 5, 2019
* failing test

* act-compat change

* fix(act): ensure that the result is returned from our wrapper

Closes #345
Closes #347
@kentcdodds
Copy link
Member

🎉 This issue has been resolved in version 6.1.2 🎉

The release is available on:

Your semantic-release bot 📦🚀

lucbpz pushed a commit to lucbpz/react-testing-library that referenced this issue Jul 26, 2020
lucbpz pushed a commit to lucbpz/react-testing-library that referenced this issue Jul 26, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants