Comfy-Org / Comfy-Org/ComfyUI_frontend
Fix unsafe type assertions to DOM element types throughout codebase
- Dominant language
- TypeScript
- Stars
- 2k
- Forks
- 699
- Avg merge
- 1d 7h
- Merged PRs (30d)
- 490
Description
## Problem
Throughout the codebase, there are numerous unsafe type assertions to DOM element types (HTMLElement, HTMLInputElement, HTMLSelectElement, etc.) that don't verify the target is non-null or actually the expected type before casting.
**Example pattern:**
```typescript
const capturePointer = (e: PointerEvent) =>
(e.target as HTMLElement).setPointerCapture(e.pointerId)
```
This can fail at runtime if `e.target` is null.
**Safer pattern:**
```typescript
const capturePointer = (e: PointerEvent) => {
if (e.target instanceof HTMLElement) {
e.target.setPointerCapture(e.pointerId)
}
}
```
## Scope
Found **60+ occurrences** across the codebase, including:
- Event handlers casting `event.target` or `event.currentTarget`
- DOM query results (`querySelector`, `querySelectorAll`)
- Element references and refs
### Files with highest occurrence counts:
- `src/components/ui/stepper/FormattedNumberStepper.vue` (2)
- `src/components/rightSidePanel/parameters/TabSubgraphInputs.vue` (2)
- `src/components/rightSidePanel/parameters/TabGlobalParameters.vue` (2)
- `src/components/rightSidePanel/layout/TransitionCollapse.vue` (2)
- `src/components/topbar/WorkflowTabs.vue` (2)
- Many more files with 1-2 occurrences each
## Action Items
1. Replace unsafe `as HTMLElement` (and similar) casts with proper type guards using `instanceof`
2. Add null checks before accessing properties/methods
3. Consider using `currentTarget` instead of `target` where appropriate (currentTarget is typed and guaranteed to be the element the listener was attached to)
## References
- Originated from PR #7825 review: https://github.com/Comfy-Org/ComfyUI_frontend/pull/7825#discussion_r2688700030
- Related to TypeScript type safety best practices
## Search Patterns Used
```bash
rg 'as HTML\w*Element' --type=ts -g '*.vue'
```
---
Reported by: @DrJKL
┆Issue is synchronized with this [Notion page](https://www.notion.so/Issue-8133-Fix-unsafe-type-assertions-to-DOM-element-types-throughout-codebase-2eb6d73d36508179bff3ddb8905a3c98) by [Unito](https://www.unito.io)
Contributor guide
Assessment
This issue has not been assessed yet.