- Add browser_tests/types/globals.d.ts with Window interface augmentation
- Add types for app, graph, LiteGraph, LGraphBadge and test globals
- Standardize window['prop'] to window.prop across 37 test files
- Update browser_tests/tsconfig.json to include new type definitions
Amp-Thread-ID: https://ampcode.com/threads/T-019c16b3-cc31-70ea-9727-a933cb0ee942
Co-authored-by: Amp <amp@ampcode.com>
- Fix widgetTextBox locator in ComfyPage
- Add exact match for 'Add' button in search filter panel
- Fix ClipboardHelper to properly handle undefined vs null locators
- Use canvasOps.dragAndDrop in NodeOperationsHelper
- Use nodeOps.waitForGraphNodes in link interaction tests
- Add typecheck:browser script for browser tests
Amp-Thread-ID: https://ampcode.com/threads/T-019c1696-c595-7724-8dca-64f73f19f478
Co-authored-by: Amp <amp@ampcode.com>
Phase 2 of ComfyPage refactor:
- Add ToastHelper, DragDropHelper, CommandHelper instances to ComfyPage
- Remove migrated methods from ComfyPage (command, toast, dragDrop, workflow, canvasOps, nodeOps methods)
- Update all test files to use new helper paths
- Keep visibleToasts as passthrough getter for backward compatibility
Amp-Thread-ID: https://ampcode.com/threads/T-019c1666-ed27-773c-976a-07cc805d7a6c
Co-authored-by: Amp <amp@ampcode.com>
Migrate all test callers to use helper classes directly:
- nodeOps: getGraphNodesCount, getNodeRefById, selectNodes, etc.
- canvasOps: dragAndDrop, zoom, pan, resetView, etc.
- subgraph: rightClickInputSlot, connectToOutput, etc.
Reduces ComfyPage.ts from 1335 to 1085 lines (-250 lines).
Amp-Thread-ID: https://ampcode.com/threads/T-019c1318-58b7-757f-801c-5b676f0d3421
Co-authored-by: Amp <amp@ampcode.com>
## Summary
Improves type safety in test files by replacing unsafe type patterns
with proper TypeScript idioms.
## Changes
- Define typed `TestWindow` interface extending `Window` for Playwright
tests with custom properties
- Use `Partial<HTMLElement>` with single type assertion for DOM element
mocks
- Remove redundant type imports
- Fix `console.log` → `console.warn` in test fixture
## Files Changed
16 test files across browser_tests, packages, and src/components
## Test Plan
- ✅ `pnpm typecheck` passes
- ✅ No new `any` types introduced
- ✅ All pre-commit hooks pass
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8253-refactor-improve-TypeScript-patterns-in-test-files-Group-1-8-2f16d73d365081548f9ece7bcf0525ee)
by [Unito](https://www.unito.io)
---------
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
A frequent pattern is to add a node to the graph, and then update the
nodes position afterwards.
Some of these cases (like subgraph unpacking) can set the node position
in advance, but others, (like importA1111) require information on nodes
in order to perform arranging.
Alternatives, like allowing code to either modify `app.configuringGraph`
or otherwise set a temporary state were considered, but create the same
problem of requiring fixes in many places.
As a proposed alternative, when a node is created, an extra tick of
delay is always added before initializing layout.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7591-Always-wait-for-next-tick-before-layout-init-2cc6d73d365081f4ababc38020645670)
by [Unito](https://www.unito.io)
---------
Co-authored-by: DrJKL <DrJKL0424@gmail.com>
Co-authored-by: github-actions <github-actions@github.com>
Adds support for entering math inside number widgets in vue mode
Migrates components to simple html elements (div and button) by
borrowing styling from the (reverted) reka-ui migration in #6985. The
existing (evil) litegraph eval code is extracted as a utility function
and reused.
This PR means we're entirely writing our own NumberField.
Also adds support for scrubbing widgets like in litegraph
### Known Issue
- Scrubbing causes text to be highlighted, ~~starting a scrub from
highlighted text will instead drag the text~~.
- It seems this can only be prevented with `pointerdown.prevent`, but
this requires a manual `input.focus()` which does not place the cursor
at location of mouse click.
(Obligatory: _It won't do you a bit of good to review math_)
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7759-Implement-vue-math-2d46d73d365081b9acd4d6422669016e)
by [Unito](https://www.unito.io)
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: DrJKL <DrJKL0424@gmail.com>
# Fix Import Failed Warning Icon
## Problem Description
Warning icons were not displayed when import failed errors occurred in
installed packages.
## Root Cause
Conflict detection logic mismatch between `PackCardFooter` and
`PackEnableToggle`:
- **PackCardFooter**: Uses `checkNodeCompatibility()`
- System compatibility check **before** installation (OS, accelerator,
version, etc.)
- Does not include import failed information
- **PackEnableToggle**: Uses `getConflictsForPackageByID()`
- Actual conflict data **after** installation (including import failed)
- But was dependent on parent component's `hasConflict` prop
## Changes Made
### 1. PackEnableToggle.vue
```diff
- <div v-if="hasConflict">
+ <div v-if="packageConflict?.has_conflict">
```
- Removed `hasConflict` prop dependency
- Changed to use only internal store data (`packageConflict`)
### 2. PackCardFooter.vue
```diff
- <PackEnableToggle :has-conflict="hasConflicts" :node-pack="nodePack" />
+ <PackEnableToggle :node-pack="nodePack" />
```
- Removed unnecessary `has-conflict` prop passing
## Result
- ✅ Warning icon properly displays for installed packages with import
failed errors
- ✅ Conflict modal works correctly when clicked
- ✅ Each component uses appropriate conflict detection logic
[after.webm](https://github.com/user-attachments/assets/80576018-0a5b-4e32-9df6-686be3774313)
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7753-fix-import-fail-info-warning-icon-2d36d73d365081518fbeedf539a19040)
by [Unito](https://www.unito.io)
---------
Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: github-actions <github-actions@github.com>
## Summary
<!-- One sentence describing what changed and why. -->
## Changes
- **What**: <!-- Core functionality added/modified -->
- **Breaking**: <!-- Any breaking changes (if none, remove this line)
-->
- **Dependencies**: <!-- New dependencies (if none, remove this line)
-->
## Review Focus
<!-- Critical design decisions or edge cases that need attention -->
<!-- If this PR fixes an issue, uncomment and update the line below -->
<!-- Fixes #ISSUE_NUMBER -->
## Screenshots (if applicable)
<!-- Add screenshots or video recording to help explain your changes -->
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7395-chore-fix-playwright-expectations-2c66d73d3650819d8913d80be55d7908)
by [Unito](https://www.unito.io)
---------
Co-authored-by: github-actions <github-actions@github.com>
## Summary
Reduce lower level font definitions in most places. Default to Inter.
See #6912
## Review Focus
Comic Sans is still an option...
## Screenshots (if applicable)
<!-- Add screenshots or video recording to help explain your changes -->
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7220-Style-Font-Consistency-2c26d73d365081348f2dd8909dd9bb8f)
by [Unito](https://www.unito.io)
---------
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: github-actions <github-actions@github.com>
## Summary
Makes the area a bit to the left and right of the dot also clickable.
Addresses complaints about it being tricky to connect nodes in Nodes
2.0.
---------
Co-authored-by: github-actions <github-actions@github.com>
## Summary
Changes the layout store to treat node sizes as body-only measurements
while LiteGraph continues to reason about full heights. DOM-driven
updates are tagged with `LayoutSource.DOM`, which lets the store strip
the title height exactly once before persisting. That classification (a
new mutation source - `LayoutSource.DOM`) is accurate because those
mutations are triggered by the browser’s layout engine via
ResizeObserver, rather than by direct calls into the layout APIs (e.g.,
`moveNodeTo`, `useNodeDrag`). So all sources are:
- `LayoutSource.DOM`: browser layout/ResizeObserver measurements that
include the title bar
- `LayoutSource.Vue`: direct Vue-driven mutations routed through the
layout store
- `LayoutSource.Canvas`: legacy LiteGraph/canvas updates that will be
phased out over time
- `LayoutSource.External`: for multiplayer or syncing with a when going
online after making changes offline (in teams/workspace)
When layout state flows back into LiteGraph we add the title height just
in time for `liteNode.setSize`, so LiteGraph’s rendering stays
unchanged. This makes Vue node resizing and workflow persistence
deterministic - multiline widgets hold their dimensions across reloads
because every path that crosses the layout/LiteGraph boundary performs
the same normalization.
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6966-normalize-height-at-sites-2b76d73d365081b6bcb4f4ce6a27663a)
by [Unito](https://www.unito.io)
---------
Co-authored-by: github-actions <github-actions@github.com>
