react-component / react-component/overflow

Warning: Can't perform a React state update on an unmounted component

Open
#44 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
64
Forks
40
Avg merge
3h 40m
Merged PRs (30d)
1

Description

We use Ant Design 4.x (which uses this library under the hood) and if we try to click an Ant dropdown inside a unit test, we always get this error:

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.
    at Overflow (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-overflow@1.3.1_react-dom@17.0.2_react@17.0.2\node_modules\rc-overflow\lib\Overflow.js:36:32)
    at InheritableContextProvider (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-menu@9.8.4_react-dom@17.0.2_react@17.0.2\node_modules\rc-menu\lib\context\MenuContext.js:31:23)
    at C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-menu@9.8.4_react-dom@17.0.2_react@17.0.2\node_modules\rc-menu\lib\Menu.js:55:27
    at C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\antd@4.24.15_react-dom@17.0.2_react@17.0.2\node_modules\antd\lib\menu\index.js:42:24
    at Menu (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\antd@4.24.15_react-dom@17.0.2_react@17.0.2\node_modules\antd\lib\menu\index.js:150:37)
    at NoCompactStyle (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\antd@4.24.15_react-dom@17.0.2_react@17.0.2\node_modules\antd\lib\space\Compact.js:41:23)
    at OverrideProvider (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\antd@4.24.15_react-dom@17.0.2_react@17.0.2\node_modules\antd\lib\menu\OverrideContext.js:23:21)
    at div
    at Align (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-align@4.0.15_react-dom@17.0.2_react@17.0.2\node_modules\rc-align\lib\Align.js:47:23)
    at DomWrapper (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-motion@2.9.0_react-dom@17.0.2_react@17.0.2\node_modules\rc-motion\lib\DomWrapper.js:20:34)
    at C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-motion@2.9.0_react-dom@17.0.2_react@17.0.2\node_modules\rc-motion\lib\CSSMotion.js:41:32
    at C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-trigger@5.3.4_react-dom@17.0.2_react@17.0.2\node_modules\rc-trigger\lib\Popup\PopupInner.js:35:23
    at div
    at C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-trigger@5.3.4_react-dom@17.0.2_react@17.0.2\node_modules\rc-trigger\lib\Popup\index.js:32:22
    at C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-util@5.38.0_react-dom@17.0.2_react@17.0.2\node_modules\rc-util\lib\Portal.js:12:25
    at Trigger (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-trigger@5.3.4_react-dom@17.0.2_react@17.0.2\node_modules\rc-trigger\lib\index.js:82:36)
    at Dropdown (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\rc-dropdown@4.0.1_react-dom@17.0.2_react@17.0.2\node_modules\rc-dropdown\lib\Dropdown.js:33:28)
    at Dropdown (C:\Users\kgetz\Work\event-viewer\common\temp\node_modules\.pnpm\antd@4.24.15_react-dom@17.0.2_react@17.0.2\node_modules\antd\lib\dropdown\dropdown.js:30:33)

Glancing at the other open issues, it seems similar to #23.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the Ant Design 4.x dropdown interaction in a unit test and inspect the warning stack at rc-overflow/lib/Overflow.js. Compare the behavior with issue #23, then verify that closing or unmounting the dropdown no longer produces the React state-update warning.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.