ComfyUI_frontend
ComfyUI_frontend copied to clipboard
Fixing race condition
Summary
Original PR and discussion: https://github.com/Comfy-Org/litegraph.js/pull/1082
Original Example HTML to visually describe the issue: https://github.com/Comfy-Org/litegraph.js/blob/8e5c4452cd67ccd91146ba79514bb001c470900a/public/mousemoving_example_with_blur.html
The ordering of mouseup and mousemove events is not defined. So there may be a mouseup event before the next mousemove event where buttons=0, but there may also be a mouseup immediately after.
The original code was designed to handle the case where a user click and drags, then tabs out. It turns out, you still get mousemove events in that case, so we can reset the CanvasPointer the moment it happens, as opposed to attempting to detect if it did happen in the past. The original code was designed under the assumption that if there was no mouseup, and then there was a mousemove with buttons=0, then we must have lost the focus at some point. Unfortunately, on some computers (notably my Macbook M2) this has the side effect of making it so that if your mouse pointer was even slightly moving when releasing the mouse button, it would reset and not connect the graph nodes. Extremely frustrating.
Changes
- What: Window blur reset handling.
- Breaking: Nothing.
- Dependencies: Nothing.
Review Focus
To replicate this, use a high pixel density display and a sensitive mouse device, such as a Retina Display and a macbook touchpad. This also happens in low resolution displays with less sensitive mouse devices, but the race condition is much harder to create, because you need to move at least 1 pixel during the release of the mouse button. If you want to replicate the bug, and you're on a non-Retina display or you have a basic USB mouse, you'll need to move your mouse rather vigorously. If you're on a macbook M2, just use the computer normally.
βIssue is synchronized with this Notion page by Unito
π Playwright Test Results
β οΈ Tests passed with flaky tests
β° Completed at: 11/03/2025, 05:02:18 AM UTC
π Summary
- Total Tests: 500
- Passed: 468 β
- Failed: 0
- Flaky: 2 β οΈ
- Skipped: 30 βοΈ
π Test Reports by Browser
- β chromium: View Report β’ β 459 / β 0 / β οΈ 2 / βοΈ 30
- β chromium-2x: View Report β’ β 2 / β 0 / β οΈ 0 / βοΈ 0
- β chromium-0.5x: View Report β’ β 1 / β 0 / β οΈ 0 / βοΈ 0
- β mobile-chrome: View Report β’ β 6 / β 0 / β οΈ 0 / βοΈ 0
π Click on the links above to view detailed test results for each browser configuration.
π¨ Storybook Build Status
Build is starting...
β° Started at: 11/03/2025, 03:38:59 AM UTC
π Building Storybook
- π¦ Installing dependencies...
- π§ Building Storybook components...
- π Preparing deployment to Cloudflare Pages...
β±οΈ Please wait while the Storybook build is in progress...
Bundle Size Report
Summary
- Raw size: 12.2 MB baseline 12.2 MB β :red_circle: +853 B
- Gzip: 2.48 MB baseline 2.48 MB β :red_circle: +182 B
- Brotli: 1.95 MB baseline 1.95 MB β :red_circle: +88 B
- Bundles: 58 current β’ 58 baseline β’ 13 added / 13 removed
Category Glance Data & Services :red_circle: +1 kB (11.4 kB) Β· UI Components :green_circle: -111 B (12.5 kB) Β· Graph Workspace :green_circle: -24 B (725 kB) Β· App Entry Points :green_circle: -15 B (3.27 MB) Β· Vendor & Third-Party :white_circle: 0 B (5.32 MB) Β· Other :white_circle: 0 B (2.55 MB) Β· + 3 more
Per-category breakdown
App Entry Points β 3.27 MB (baseline 3.27 MB) β’ :green_circle: -15 B
Main entry bundles and manifests
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| assets/index-CueuJcbN.js (new) | β | 2.89 MB | :red_circle: +2.89 MB | :red_circle: +597 kB | :red_circle: +451 kB |
| ~~assets/index-DoRSRY3L.js~~ (removed) | 2.89 MB | β | :green_circle: -2.89 MB | :green_circle: -597 kB | :green_circle: -451 kB |
| ~~assets/index-K3aYY2vi.js~~ (removed) | 382 kB | β | :green_circle: -382 kB | :green_circle: -76.6 kB | :green_circle: -62.1 kB |
| assets/index-1UJ61uwA.js (new) | β | 381 kB | :red_circle: +381 kB | :red_circle: +76.6 kB | :red_circle: +62.1 kB |
| assets/index-opiIE5I-.js (new) | β | 1.75 kB | :red_circle: +1.75 kB | :red_circle: +575 B | :red_circle: +485 B |
| ~~assets/index-ttZPki58.js~~ (removed) | 1.75 kB | β | :green_circle: -1.75 kB | :green_circle: -576 B | :green_circle: -490 B |
Status: 3 added / 3 removed
Graph Workspace β 725 kB (baseline 725 kB) β’ :green_circle: -24 B
Graph editor runtime, canvas, workflow orchestration
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| ~~assets/GraphView-CbDUY5xW.js~~ (removed) | 725 kB | β | :green_circle: -725 kB | :green_circle: -142 kB | :green_circle: -109 kB |
| assets/GraphView-DpwGqEgq.js (new) | β | 725 kB | :red_circle: +725 kB | :red_circle: +142 kB | :red_circle: +109 kB |
Status: 1 added / 1 removed
Views & Navigation β 8.18 kB (baseline 8.18 kB) β’ :white_circle: 0 B
Top-level views, pages, and routed surfaces
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| assets/UserSelectView-BUKPRrel.js (new) | β | 8.18 kB | :red_circle: +8.18 kB | :red_circle: +2.48 kB | :red_circle: +2.17 kB |
| ~~assets/UserSelectView-BzRL0rM7.js~~ (removed) | 8.18 kB | β | :green_circle: -8.18 kB | :green_circle: -2.48 kB | :green_circle: -2.17 kB |
Status: 1 added / 1 removed
Panels & Settings β 293 kB (baseline 293 kB) β’ :white_circle: 0 B
Configuration panels, inspectors, and settings screens
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| ~~assets/CreditsPanel-BRX4tMUE.js~~ (removed) | 22.9 kB | β | :green_circle: -22.9 kB | :green_circle: -5.45 kB | :green_circle: -4.76 kB |
| assets/CreditsPanel-ew7gq34O.js (new) | β | 22.9 kB | :red_circle: +22.9 kB | :red_circle: +5.45 kB | :red_circle: +4.76 kB |
| assets/KeybindingPanel-CyzRI6kr.js (new) | β | 15.3 kB | :red_circle: +15.3 kB | :red_circle: +3.78 kB | :red_circle: +3.33 kB |
| ~~assets/KeybindingPanel-T5r0EHYz.js~~ (removed) | 15.3 kB | β | :green_circle: -15.3 kB | :green_circle: -3.78 kB | :green_circle: -3.33 kB |
| assets/ExtensionPanel-Bm5SjccX.js (new) | β | 12.1 kB | :red_circle: +12.1 kB | :red_circle: +2.84 kB | :red_circle: +2.49 kB |
| ~~assets/ExtensionPanel-Ch1OWEYP.js~~ (removed) | 12.1 kB | β | :green_circle: -12.1 kB | :green_circle: -2.84 kB | :green_circle: -2.49 kB |
| assets/AboutPanel-CX2tJpW5.js (new) | β | 10.3 kB | :red_circle: +10.3 kB | :red_circle: +2.67 kB | :red_circle: +2.34 kB |
| ~~assets/AboutPanel-DxAr03k6.js~~ (removed) | 10.3 kB | β | :green_circle: -10.3 kB | :green_circle: -2.68 kB | :green_circle: -2.34 kB |
| assets/ServerConfigPanel-BbfV10tQ.js (new) | β | 8.23 kB | :red_circle: +8.23 kB | :red_circle: +2.17 kB | :red_circle: +1.91 kB |
| ~~assets/ServerConfigPanel-BDc7SXmC.js~~ (removed) | 8.23 kB | β | :green_circle: -8.23 kB | :green_circle: -2.18 kB | :green_circle: -1.91 kB |
| ~~assets/UserPanel-CHob7oaI.js~~ (removed) | 7.94 kB | β | :green_circle: -7.94 kB | :green_circle: -2.07 kB | :green_circle: -1.81 kB |
| assets/UserPanel-EPDD0t6m.js (new) | β | 7.94 kB | :red_circle: +7.94 kB | :red_circle: +2.07 kB | :red_circle: +1.8 kB |
| assets/settings-0O6mq5to.js | 24.3 kB | 24.3 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-BYaBy7dC.js | 20.4 kB | 20.4 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-C3vygQN4.js | 25.7 kB | 25.7 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-CbKYXyH0.js | 22.7 kB | 22.7 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-CCholIsI.js | 25 kB | 25 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-DFX7vRkK.js | 19.8 kB | 19.8 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-INJLrcmT.js | 31.3 kB | 31.3 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-iR6BKRXe.js | 23.7 kB | 23.7 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/settings-YjQmudNE.js | 23.5 kB | 23.5 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
Status: 6 added / 6 removed
UI Components β 12.5 kB (baseline 12.6 kB) β’ :green_circle: -111 B
Reusable component library chunks
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| ~~assets/ComfyQueueButton-BtyPuAsN.js~~ (removed) | 11.3 kB | β | :green_circle: -11.3 kB | :green_circle: -2.83 kB | :green_circle: -2.52 kB |
| assets/ComfyQueueButton-CHkVdUPx.js (new) | β | 11.2 kB | :red_circle: +11.2 kB | :red_circle: +2.78 kB | :red_circle: +2.46 kB |
| assets/UserAvatar.vue_vue_type_script_setup_true_lang-CY-Afo9h.js | 1.29 kB | 1.29 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
Status: 1 added / 1 removed
Data & Services β 11.4 kB (baseline 10.4 kB) β’ :red_circle: +1 kB
Stores, services, APIs, and repositories
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| assets/keybindingService-DoEw9fLm.js (new) | β | 8.61 kB | :red_circle: +8.61 kB | :red_circle: +2.08 kB | :red_circle: +1.78 kB |
| ~~assets/keybindingService-DpPd4rs-.js~~ (removed) | 7.6 kB | β | :green_circle: -7.6 kB | :green_circle: -1.84 kB | :green_circle: -1.59 kB |
| assets/serverConfigStore-BXxesUPS.js | 2.79 kB | 2.79 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
Status: 1 added / 1 removed
Utilities & Hooks β 1.07 kB (baseline 1.07 kB) β’ :white_circle: 0 B
Helpers, composables, and utility bundles
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| assets/mathUtil-CTARWQ-l.js | 1.07 kB | 1.07 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
Vendor & Third-Party β 5.32 MB (baseline 5.32 MB) β’ :white_circle: 0 B
External libraries and shared vendor chunks
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| assets/vendor-other-DTJaZ2wB.js | 3.22 MB | 3.22 MB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/vendor-primevue-PESgPnbc.js | 517 B | 517 B | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/vendor-three-JDoAqkQm.js | 1.37 MB | 1.37 MB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/vendor-tiptap-BovKm-bo.js | 232 kB | 232 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/vendor-vue-CE9hyBb0.js | 92.4 kB | 92.4 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/vendor-xterm-BZLod3g9.js | 407 kB | 407 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
Other β 2.55 MB (baseline 2.55 MB) β’ :white_circle: 0 B
Bundles that do not match a named category
| File | Before | After | Ξ Raw | Ξ Gzip | Ξ Brotli |
|---|---|---|---|---|---|
| assets/commands-B2KZRBmX.js | 15.1 kB | 15.1 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-Bw-ckyga.js | 13.9 kB | 13.9 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-C_NmM85I.js | 13.8 kB | 13.8 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-CuozCW4W.js | 14 kB | 14 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-DGfVUJCR.js | 16.2 kB | 16.2 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-dOJNDogK.js | 14.5 kB | 14.5 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-DwiE551e.js | 14.7 kB | 14.7 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-Fw7mvqSy.js | 13.1 kB | 13.1 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/commands-FXnO1W4Q.js | 13.2 kB | 13.2 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-B2H4r1yK.js | 70.7 kB | 70.7 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-BfrcYvru.js | 59.4 kB | 59.4 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-BhRi1J0e.js | 68.4 kB | 68.4 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-BUG9wuyt.js | 80.3 kB | 80.3 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-C0hL5eRA.js | 76.4 kB | 76.4 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-CkKZCT7r.js | 58.7 kB | 58.7 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-D1RQ0Vb_.js | 66.3 kB | 66.3 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-DdyfZOXg.js | 67.6 kB | 67.6 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/main-DPE2NqRw.js | 92.9 kB | 92.9 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-3I1vPgv4.js | 181 kB | 181 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-B2huPGKQ.js | 190 kB | 190 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-BWugyUzd.js | 215 kB | 215 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-bXqu6Stq.js | 194 kB | 194 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-CtB2M3sY.js | 229 kB | 229 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-D-rCrn-T.js | 200 kB | 200 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-D38DSnl1.js | 179 kB | 179 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-DAsU52ON.js | 192 kB | 192 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
| assets/nodeDefs-DnGONaA_.js | 196 kB | 196 kB | :white_circle: 0 B | :white_circle: 0 B | :white_circle: 0 B |
Do I need to do a thing to get this merged or reviewed? It's annoying that whenever I update Comfy, I have to also patch the frontend with this fix to make the nodes work on my Macbook. Presumably it's an issue for anyone with a high DPI display and fast input device.