acl-services / acl-services/paprika

`act()` console errors in Popover via ListBox

オープン
#864 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る
Low Priority ↓
主要言語
JavaScript
スター
54
フォーク
10
平均マージ
1日 12時間
マージ済み PR(30日)
6

説明

## 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)
```

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

評価

この issue はまだ評価されていません。

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。