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

act() console errors in Popover via ListBox #864

Open
jamiek-acl opened this issue Jan 4, 2021 · 0 comments
Open

act() console errors in Popover via ListBox #864

jamiek-acl opened this issue Jan 4, 2021 · 0 comments

Comments

@jamiek-acl
Copy link
Contributor

jamiek-acl commented Jan 4, 2021

Current behavior

While making the @sriracha/UserLookup feature (which uses the @paprika/ListBox, my tests were throwing console errors. I think the errors were coming from from the @paprika/Popover via the ListBox, as it changes its state (appearing on click) after a timeout:

https://github.com/acl-services/sriracha/pull/766#discussion_r548326636

Warning: An update to Provider 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 Provider (created by ListBox)
        in ListBox (created by WithTags)
        in div (created by WithTags)
        in WithTags (created by UserLookUp)
        in UserLookUp (created by App)
        in App
        in Provider
        in L10n
Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
        in Provider (created by ListBox)
        in ListBox (created by WithTags)
        in div (created by WithTags)
        in WithTags (created by UserLookUp)
        in UserLookUp (created by App)
        in App
        in Provider
        in L10n
Warning: An update to ListBox.Filter 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 ListBox.Filter (created by WithTags)
        in div (created by Context.Consumer)
        in StyledComponent (created by Boxstyles__Box)
        in Boxstyles__Box (created by Box)
        in Box (created by ListBox)
        in div (created by Context.Consumer)
        in StyledComponent (created by Contentstyles__ContentStyled)
        in Contentstyles__ContentStyled (created by Popover.Content)
        in Popover.Content (created by Content)
        in Content (created by ListBox)
        in ListBox (created by ForwardRef)
        in PopoverChildren (created by Popover)
Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
        in ListBox.Filter (created by WithTags)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant