eschutho opened a new pull request, #35256:
URL: https://github.com/apache/superset/pull/35256
## Summary
Fixes DOM error `NotFoundError: Failed to execute 'insertBefore' on 'Node'`
in DatasourceModal by replacing imperative modal updates with declarative React
state management.
## Problem
The DatasourceModal component was storing modal instances from
`Modal.useModal()` and calling `.update()` on them imperatively. This caused
DOM manipulation conflicts with React's reconciliation process, leading to the
error when React tried to insert DOM nodes that were no longer children of
their expected parents.
## Solution
- **Convert ref to state**: Changed `syncColumnsRef` to `syncColumns` state
variable for proper React reactivity
- **Remove imperative updates**: Eliminated `confirmModal.update()` calls
that manipulated DOM outside React's control
- **Simplify modal creation**: Modal content now updates naturally through
React re-renders
- **Fix dependencies**: Removed circular dependency in `getSaveDialog`
callback
- **Add tests**: Created comprehensive tests to verify proper hook usage and
prevent regressions
## Test Plan
- [x] All existing DatasourceModal tests pass (14/14)
- [x] New tests verify `Modal.useModal` hook usage instead of direct
`Modal.confirm`
- [x] Tests confirm modal interactions work without DOM errors
- [x] TypeScript compilation successful
- [x] Pre-commit hooks pass (ESLint, type checking)
## Technical Details
**Before**: Modal content was updated imperatively:
```javascript
const [confirmModal, setConfirmModal] = useState(null);
// ...
confirmModal.update({ content: getSaveDialog() }); // ❌ DOM manipulation
```
**After**: Modal content updates declaratively:
```javascript
const [syncColumns, setSyncColumns] = useState(false);
// Modal re-renders naturally when syncColumns state changes ✅
```
🤖 Generated with [Claude Code](https://claude.ai/code)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
