3feeecc740
…s metadata - Reorder handleFile() to check workflow before parameters - Add validation to prevent JSON parse errors from crashing imports - Fix loadGraphData() to use explicit type validation instead of falsy check - Ensures ComfyUI-generated PNGs with both metadata types load the workflow, not parameters Fixes issue where large workflows (e.g., 634 nodes) were replaced with basic A1111 format when importing PNG files. ## Summary Fixed workflow loading from PNG images to prioritize workflow metadata over parameters, preventing large workflows from being replaced with basic A1111 format. ## Changes - **What**: Reordered `handleFile()` to check workflow before parameters, added JSON parse error handling and validation, fixed `loadGraphData()` to use explicit type checking instead of falsy check - **Dependencies**: None ## Review Focus The key issue was in `handleFile()` where parameters were checked before workflow, causing ComfyUI-generated PNGs (which contain both workflow and parameters metadata) to incorrectly import as A1111 format. The fix ensures: 1. Workflow is always checked first and validated properly 2. Parameters are only used as a fallback when no workflow exists 3. Invalid/malformed workflow data doesn't crash the import process Additionally, `loadGraphData()` was using a falsy check (`if (!graphData)`) which could incorrectly replace valid but falsy values. Now uses explicit type validation. Tested with real-world PNG containing 634-node workflow (780KB) + parameters (1KB) - now correctly loads the workflow instead of discarding it. <!-- Fixes #ISSUE_NUMBER --> ## Screenshots (if applicable) N/A - Backend logic fix, no UI changes Fixes #6633 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7154-Fix-workflow-loading-from-PNG-images-with-both-workflow-and-parameter-2bf6d73d365081ecb7a6c4bf6b6ccd51) by [Unito](https://www.unito.io) --------- Co-authored-by: Alexander Brown <DrJKL0424@gmail.com> Co-authored-by: Alexander Brown <drjkl@comfy.org>
Scripts Directory Documentation
This directory contains TypeScript code inherited from the legacy ComfyUI JavaScript frontend project. The code has been migrated from JavaScript to TypeScript while maintaining compatibility with the original functionality.
When implementing new features, prefer using the new Vue3 system over the legacy scripts.
Key Components
ComfyApi (api.ts)
Main API client class that handles communication with the ComfyUI backend. Provides methods for:
- Queue management
- Model operations
- Extension handling
- WebSocket communication
- User data management
ComfyApp (app.ts)
Core application class that manages:
- Graph manipulation
- Node management
- Canvas interactions
- Extension system
- Workflow state
UI Components (ui/)
Collection of reusable UI components including:
- Buttons and button groups
- Popups and dialogs
- Draggable lists
- Image previews
- Menu system
- Settings dialog
Integration with Vite
All TypeScript exports are shimmed through Vite configuration to maintain compatibility with the legacy JavaScript codebase. The shimming logic can be found in vite.config.mts.
Legacy Compatibility
This codebase maintains compatibility with the original ComfyUI Legacy Frontend while providing TypeScript type safety and modern development features.
For users wanting to fall back to the legacy frontend, use the command line argument:
--front-end-version Comfy-Org/ComfyUI_legacy_frontend@latest