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

Cannot test the Modal with react-testing-library and jsdom #3959

Closed
silviubogan opened this issue Jun 4, 2020 · 3 comments
Closed

Cannot test the Modal with react-testing-library and jsdom #3959

silviubogan opened this issue Jun 4, 2020 · 3 comments
Labels

Comments

@silviubogan
Copy link

silviubogan commented Jun 4, 2020

Bug Report

Steps

  1. Open https://codesandbox.io/s/semantic-ui-react-8etbr?file=/index.test.js
  2. Select the index.test.js file on the left sidebar
  3. Select the Tests tab on the right and press the play all button

Expected Result

The resulting HTML printed in the Console section at the bottom of the Tests tab contains the contents of the Modal

Actual Result

In the Console section at the bottom of the Tests tab an empty string is displayed

Version

0.88.2

Testcase

https://codesandbox.io/s/semantic-ui-react-8etbr?file=/index.test.js

@welcome
Copy link

welcome bot commented Jun 4, 2020

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you've completed all the fields in the issue template so we can best help.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

@layershifter
Copy link
Member

It's not an of Modal component itself.

Modal uses ReactDOM.createPortal() to render its content to a document.body and it seems that there are issues in react-testing-library (testing-library/react-testing-library#62). I checked the issue at it seems that there is no resolution for this case.

At least I check and selectors like getByText() work (https://codesandbox.io/s/semantic-ui-react-0oume?file=/index.test.js) as expected.

Please let us know if you will find a proper solution.

@elkwood
Copy link

elkwood commented Aug 14, 2020

The solution of adding {container: document.body } as a render option worked for me.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants