mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-01-30 12:59:55 +00:00

Files

Christian Byrne 06b0eecfe4 fix Vue node widgets should be in disabled state if their slots are connected with a link (#5834 )

## Summary

Fixes https://github.com/Comfy-Org/ComfyUI_frontend/issues/5692 by
making widget link connection status trigger on change so Vue widgets
with connected links could properly switch to the `disabled` state when
they are implicitly converted to inputs.

## Changes

- **What**: Added `node:slot-links:changed` event tracking and reactive
slot data synchronization for Vue widgets

```mermaid
graph TD
    A[Widget Link Change] --> B[NodeInputSlot.link setter]
    B --> C{Is Widget Input?}
    C -->|Yes| D[Trigger slot-links:changed]
    C -->|No| E[End]
    D --> F[Graph Event Handler]
    F --> G[syncNodeSlotData]
    G --> H[Update Vue Reactive Data]
    H --> I[Widget Re-render]
    
    style A fill:#f9f9f9,stroke:#333,color:#000
    style I fill:#f9f9f9,stroke:#333,color:#000
```

## Review Focus

Widget reactivity performance with frequent link changes and event
handler memory management in graph operations.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5834-fix-Vue-node-widgets-should-be-in-disabled-state-if-their-slots-are-connected-with-a-link-27c6d73d365081f6a6c3c1ddc3905c5e)
by [Unito](https://www.unito.io)

2025-10-09 10:30:12 -07:00

canvas

lint: add tsconfig for browser_tests, fix existing violations (#5633 )

2025-09-18 11:35:44 -07:00

core

fix Vue node widgets should be in disabled state if their slots are connected with a link (#5834 )

2025-10-09 10:30:12 -07:00

infrastructure

[refactor] Migrate litegraph tests to centralized location (#5072 )

2025-08-18 10:28:31 -07:00

subgraph

fix(docs): correct typos in comments and strings found during code view (#5880 )

2025-10-01 18:35:38 -07:00

utils

Tests: Vitest configuration cleanup (#5888 )

2025-10-02 21:01:42 -07:00

README.md

Migration: pnpm (#5215 )

2025-08-27 06:10:15 -07:00

README.md

LiteGraph Tests

This directory contains the test suite for the LiteGraph library.

Structure

litegraph/
├── core/           # Core functionality tests (LGraph, LGraphNode, etc.)
├── canvas/         # Canvas-related tests (rendering, interactions)
├── infrastructure/ # Infrastructure tests (Rectangle, utilities)
├── subgraph/       # Subgraph-specific tests
├── utils/          # Utility function tests
└── fixtures/       # Test helpers, fixtures, and assets

Running Tests

# Run all litegraph tests
pnpm test:unit -- tests-ui/tests/litegraph/

# Run specific subdirectory
pnpm test:unit -- tests-ui/tests/litegraph/core/

# Run single test file
pnpm test:unit -- tests-ui/tests/litegraph/core/LGraph.test.ts

Migration Status

These tests were migrated from src/lib/litegraph/test/ to centralize test infrastructure. Currently, some tests are marked with .skip due to import/setup issues that need to be resolved.

TODO: Fix Skipped Tests

The following test files have been temporarily disabled and need fixes:

Most subgraph tests (circular dependency issues)
Some core tests (missing test utilities)
Canvas tests (mock setup issues)

See individual test files marked with // TODO: Fix these tests after migration for specific issues.

Writing New Tests

Always import from the barrel export to avoid circular dependencies:

import { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'

Use the test fixtures from fixtures/ directory
Follow existing patterns for test organization

Test Fixtures

Test fixtures and helpers are located in the fixtures/ directory:

testExtensions.ts - Custom vitest extensions
subgraphHelpers.ts - Helpers for creating test subgraphs
subgraphFixtures.ts - Common subgraph test scenarios
assets/ - Test data files