ant-design / ant-design/pro-components
🐛[BUG] ProTable Ellipsis: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
### 🐛 bug 描述
```
Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
at removeChild (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:8467:26)
at commitDeletionEffectsOnFiber (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17506:21)
at recursivelyTraverseDeletionEffects (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17482:13)
at commitDeletionEffectsOnFiber (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17606:15)
at commitDeletionEffects (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17473:13)
at recursivelyTraverseMutationEffects (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17670:17)
at commitMutationEffectsOnFiber (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17892:15)
at recursivelyTraverseMutationEffects (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17681:15)
at commitMutationEffectsOnFiber (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17695:15)
at recursivelyTraverseMutationEffects (http://localhost:2048/node_modules/.vite/deps/chunk-QPHASEO2.js?v=3a228509:17681:15)
```
下面这个错误栈表明是 Ellipsis 功能报的错
```
console.js:213 The above error occurred in the component:
at Ellipsis (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:92356:9)
at span
at http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:92227:20
at http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:20122:28
at DomWrapper4 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:419:9)
at SingleObserver (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:435:24)
at ResizeObserver2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:524:24)
at http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:20819:34
at Tooltip2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:26299:36)
at http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:27017:20
at EllipsisTooltip (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:92472:9)
at DomWrapper4 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:419:9)
at SingleObserver (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:435:24)
at ResizeObserver2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:524:24)
at http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:92573:20
at Text (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:92985:9)
at td
at Cell2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:77456:5)
at tr
at BodyRow (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:77914:5)
at ImmutableComponent2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:77236:7)
at tbody
at Body (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:78053:5)
at ImmutableComponent2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:77236:7)
at table
at div
at div
at div
at Provider2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:77120:22)
at Table (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:79167:31)
at ImmutableComponent2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:77208:37)
at div
at div
at Spin (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:66763:20)
at div
at InternalTable (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:86569:20)
at Table2 (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:86911:39)
at div
at div
at http://localhost:2048/node_modules/.vite/deps/@ant-design_pro-components.js?v=3a228509:12729:25
at div
at TableRender (http://localhost:2048/node_modules/.vite/deps/@ant-design_pro-components.js?v=3a228509:37253:22)
at ProTable2 (http://localhost:2048/node_modules/.vite/deps/@ant-design_pro-components.js?v=3a228509:37450:28)
at ErrorBoundary2 (http://localhost:2048/node_modules/.vite/deps/@ant-design_pro-components.js?v=3a228509:8628:5)
at ProConfigProvider2 (http://localhost:2048/node_modules/.vite/deps/@ant-design_pro-components.js?v=3a228509:8498:24)
at Container2 (http://localhost:2048/node_modules/.vite/deps/@ant-design_pro-components.js?v=3a228509:34702:34)
at ProviderTableContainer2 (http://localhost:2048/node_modules/.vite/deps/@ant-design_pro-components.js?v=3a228509:37825:52)
// ...
at RenderedRoute (http://localhost:2048/node_modules/.vite/deps/react-router-dom.js?v=3a228509:3543:5)
at Routes (http://localhost:2048/node_modules/.vite/deps/react-router-dom.js?v=3a228509:3978:5)
at default
at QueryClientProvider (http://localhost:2048/node_modules/.vite/deps/@tanstack_react-query.js?v=3a228509:2715:3)
at Router (http://localhost:2048/node_modules/.vite/deps/react-router-dom.js?v=3a228509:3921:15)
at BrowserRouter (http://localhost:2048/node_modules/.vite/deps/react-router-dom.js?v=3a228509:4654:5)
at _ErrorBoundary (http://localhost:2048/node_modules/.vite/deps/@sentry_react.js?v=3a228509:19860:5)
at div
at App (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:18626:20)
at LocaleProvider (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:3129:17)
at SizeContextProvider (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:3740:9)
at MotionWrapper (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:5818:5)
at ProviderChildren (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:5967:9)
at ConfigProvider (http://localhost:2048/node_modules/.vite/deps/chunk-FG5XE72T.js?v=3a228509:6222:31)
at AntdContainer (http://localhost:2048/src/components/AntdContainer.tsx:20:26)
React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary2.
```
### 📷 复现步骤
开启 ProTable 列配置的 ellipsis 和 copyable,切到页面有一定几率触发。
### 🏞 期望结果
不报错
### 💻 复现代码
``` tsx
a.name.localeCompare(b.name),
},
// ...
]}
{/* ... */}
/>
```
### © 版本信息
"@ant-design/pro-components": "^2.6.43"
"antd": "^5.12.5"
Chrome Version 120.0.6099.199 (Official Build) (arm64)
MacOS 14.3 Beta (23D5033f)
### 🚑 其他信息

Contributor guide
Research direction
Start with the provided ProTable snippet using ellipsis and copyable, then inspect the ProTable/Ellipsis path shown in the stack trace and the integration point at src/components/AntdContainer.tsx. Reproduce the intermittent page switch and trace the removeChild failure; done means the same configuration can be switched without the DOMException.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100