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

An update to Dropzone inside a test was not wrapped in act(...). #842

Open
mmiszy opened this issue Jun 21, 2019 · 3 comments

Comments

@mmiszy
Copy link

commented Jun 21, 2019

What is the current behavior?

When trying to test a component containing Dropzone, there's a console.errror (but tests pass):

console.error node_modules/react-dom/cjs/react-dom.development.js:506
  Warning: An update to Dropzone inside a test was not wrapped in act(...).
  
  When testing, code that causes React state updates should be wrapped into act(...):
  
  act(() => {
    /* fire events that update state */
  });
  /* assert on the output */
  
  This ensures that you're testing the behavior the user would see in the browser. Learn more at https://fb.me/react-wrap-tests-with-act
      in Dropzone (at InputFile.js:86)
      in div (at InputFile.js:85)
      in InputFile (at InputFile.test.js:68)

Test example which triggers the error:

import { render, act } from '@testing-library/react';

describe('InputFile', () => {
  it('example', async () => {
    act(() => {
      const rendered = render(<InputFile {...props} />);
    });
  });
});

InputFile is:

class InputFile extends React.Component {
  onDrop = () => { /**/ }

  render() {
    return (
      <Dropzone
        onDrop={this.onDrop}
      >
        {({ getRootProps, getInputProps }) => {
          if (uploading) {
            return <div>...uploading</div>;
          }

          return (
            <div {...getRootProps()}>
              <input {...getInputProps()} />
            </div>
          );
        }}
      </Dropzone>
    );
  }
}
@rolandjitsu

This comment has been minimized.

Copy link
Collaborator

commented Jul 2, 2019

I'm familiar with this and we actually also get it, but we just ignore it. There's a long discussion in facebook/react#14769 that should address this issue. When it will be fixed I will update our tests as well and you could use that as an example of how to test components that use the dropzone.

@harisdz

This comment has been minimized.

Copy link

commented Aug 27, 2019

@rolandjitsu so the warnings are fixed in React 16.9 and the latest version of react-testing-library but I still get them for react-dropzone - is it still the case with you as well?

@rolandjitsu

This comment has been minimized.

Copy link
Collaborator

commented Aug 28, 2019

@harisdz I would have to spend some time updating the dev deps and going through the tests to see if that's the case, but unfortunately I don't have the time to do it. You're more than welcome to have a look at it if you'd like.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants
You can’t perform that action at this time.