test: regression coverage for subgraph live-preview promotion (incident-94) - #14548
test: regression coverage for subgraph live-preview promotion (incident-94)#14548claude[bot] wants to merge 1 commit into
Conversation
Adds e2e and unit coverage for incident-94: a mid-execution sampler preview inside a subgraph doesn't render on the outer SubgraphNode because LGraphNode.vue's LivePreview v-if excludes subgraph nodes. Both tests currently fail against main.
🎭 Playwright: ❌ 1773 passed, 1 failed · 4 flaky❌ Failed Tests📊 Browser Reports
🎨 Storybook: ✅ Built — View Storybook📦 Bundle: 8.21 MB gzip ⚪ 0 BDetailsSummary
Category Glance App Entry Points — 3.62 kB (baseline 3.62 kB) • ⚪ 0 BMain entry bundles and manifests Status: 1 unchanged Graph Workspace — 1.29 MB (baseline 1.29 MB) • ⚪ 0 BGraph editor runtime, canvas, workflow orchestration Status: 2 unchanged Views & Navigation — 111 kB (baseline 111 kB) • ⚪ 0 BTop-level views, pages, and routed surfaces Status: 16 unchanged Panels & Settings — 551 kB (baseline 551 kB) • ⚪ 0 BConfiguration panels, inspectors, and settings screens Status: 26 unchanged User & Accounts — 28.7 kB (baseline 28.7 kB) • ⚪ 0 BAuthentication, profile, and account management bundles Status: 10 unchanged Editors & Dialogs — 124 kB (baseline 124 kB) • ⚪ 0 BModals, dialogs, drawers, and in-app editors Status: 7 unchanged UI Components — 70 kB (baseline 70 kB) • ⚪ 0 BReusable component library chunks Status: 15 unchanged Data & Services — 3.45 MB (baseline 3.45 MB) • ⚪ 0 BStores, services, APIs, and repositories Status: 17 unchanged Utilities & Hooks — 386 kB (baseline 386 kB) • ⚪ 0 BHelpers, composables, and utility bundles Status: 36 unchanged Vendor & Third-Party — 15.7 MB (baseline 15.7 MB) • ⚪ 0 BExternal libraries and shared vendor chunks Status: 16 unchanged Other — 12.7 MB (baseline 12.7 MB) • ⚪ 0 BBundles that do not match a named category Status: 280 unchanged ⚡ Performance Report
Show regressions
All metrics
Historical variance (last 15 runs)
Trend (last 15 commits on main)
Raw data{
"timestamp": "2026-08-02T00:18:54.071Z",
"gitSha": "21cc4826afb3af09546c46ad6a5a122550f9cb1c",
"branch": "test/subgraph-sampler-preview-promotion",
"measurements": [
{
"name": "canvas-idle",
"durationMs": 2036.4009999999837,
"styleRecalcs": 8,
"styleRecalcDurationMs": 8.462000000000002,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 533.847,
"heapDeltaBytes": 4813336,
"heapUsedBytes": 72891064,
"domNodes": 16,
"jsHeapTotalBytes": 20574208,
"scriptDurationMs": 21.957,
"eventListeners": 4,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "canvas-idle",
"durationMs": 2034.6600000000308,
"styleRecalcs": 9,
"styleRecalcDurationMs": 8.586,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 509.26700000000005,
"heapDeltaBytes": 4945732,
"heapUsedBytes": 72818676,
"domNodes": 18,
"jsHeapTotalBytes": 20049920,
"scriptDurationMs": 21.840999999999998,
"eventListeners": 4,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.800000000000182
},
{
"name": "canvas-mouse-sweep",
"durationMs": 2053.8329999999974,
"styleRecalcs": 81,
"styleRecalcDurationMs": 51.49600000000001,
"layouts": 12,
"layoutDurationMs": 3.9290000000000003,
"taskDurationMs": 1076.135,
"heapDeltaBytes": -230160,
"heapUsedBytes": 67300256,
"domNodes": 63,
"jsHeapTotalBytes": 21884928,
"scriptDurationMs": 145.282,
"eventListeners": 6,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "canvas-mouse-sweep",
"durationMs": 1852.137999999968,
"styleRecalcs": 76,
"styleRecalcDurationMs": 41.488,
"layouts": 12,
"layoutDurationMs": 3.4999999999999996,
"taskDurationMs": 910.7250000000001,
"heapDeltaBytes": -479760,
"heapUsedBytes": 67426700,
"domNodes": 59,
"jsHeapTotalBytes": 21360640,
"scriptDurationMs": 128.661,
"eventListeners": 4,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.800000000000182
},
{
"name": "canvas-zoom-sweep",
"durationMs": 1729.633999999976,
"styleRecalcs": 30,
"styleRecalcDurationMs": 18.463,
"layouts": 6,
"layoutDurationMs": 0.7440000000000001,
"taskDurationMs": 425.501,
"heapDeltaBytes": 7777452,
"heapUsedBytes": 75799884,
"domNodes": 76,
"jsHeapTotalBytes": 19525632,
"scriptDurationMs": 25.02,
"eventListeners": 19,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "canvas-zoom-sweep",
"durationMs": 1742.309999999975,
"styleRecalcs": 30,
"styleRecalcDurationMs": 17.526,
"layouts": 6,
"layoutDurationMs": 0.6640000000000001,
"taskDurationMs": 413.745,
"heapDeltaBytes": 7899688,
"heapUsedBytes": 75913280,
"domNodes": 77,
"jsHeapTotalBytes": 20574208,
"scriptDurationMs": 24.410999999999998,
"eventListeners": 19,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.699999999999818
},
{
"name": "dom-widget-clipping",
"durationMs": 604.5919999999683,
"styleRecalcs": 11,
"styleRecalcDurationMs": 8.261000000000001,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 397.15,
"heapDeltaBytes": -11534868,
"heapUsedBytes": 56182700,
"domNodes": 18,
"jsHeapTotalBytes": 21360640,
"scriptDurationMs": 61.24100000000001,
"eventListeners": 2,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.800000000000182
},
{
"name": "dom-widget-clipping",
"durationMs": 610.6120000000601,
"styleRecalcs": 11,
"styleRecalcDurationMs": 8.541,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 399.788,
"heapDeltaBytes": -11788368,
"heapUsedBytes": 56107848,
"domNodes": 18,
"jsHeapTotalBytes": 20836352,
"scriptDurationMs": 61.847,
"eventListeners": 2,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.66333333333332,
"p95FrameDurationMs": 16.800000000000182
},
{
"name": "large-graph-idle",
"durationMs": 2041.7620000000056,
"styleRecalcs": 8,
"styleRecalcDurationMs": 7.876999999999999,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 757.382,
"heapDeltaBytes": 7920568,
"heapUsedBytes": 66418120,
"domNodes": -282,
"jsHeapTotalBytes": 5566464,
"scriptDurationMs": 125.07099999999998,
"eventListeners": -144,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.800000000000182
},
{
"name": "large-graph-idle",
"durationMs": 2039.6299999999883,
"styleRecalcs": 9,
"styleRecalcDurationMs": 9.222999999999999,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 770.837,
"heapDeltaBytes": 8183940,
"heapUsedBytes": 66723316,
"domNodes": -280,
"jsHeapTotalBytes": 4517888,
"scriptDurationMs": 124.99300000000001,
"eventListeners": -144,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "large-graph-pan",
"durationMs": 2250.5330000000185,
"styleRecalcs": 69,
"styleRecalcDurationMs": 15.216000000000001,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 1388.068,
"heapDeltaBytes": 5917920,
"heapUsedBytes": 65903676,
"domNodes": -284,
"jsHeapTotalBytes": 4743168,
"scriptDurationMs": 464.71,
"eventListeners": -142,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "large-graph-pan",
"durationMs": 2215.217999999936,
"styleRecalcs": 68,
"styleRecalcDurationMs": 14.335999999999999,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 1360.1080000000002,
"heapDeltaBytes": -4447148,
"heapUsedBytes": 55722240,
"domNodes": -283,
"jsHeapTotalBytes": 5304320,
"scriptDurationMs": 450.475,
"eventListeners": -144,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.699999999999818
},
{
"name": "large-graph-zoom",
"durationMs": 3329.8050000000217,
"styleRecalcs": 64,
"styleRecalcDurationMs": 14.752,
"layouts": 60,
"layoutDurationMs": 7.714,
"taskDurationMs": 1637.079,
"heapDeltaBytes": 5751068,
"heapUsedBytes": 67318256,
"domNodes": -287,
"jsHeapTotalBytes": 8450048,
"scriptDurationMs": 576.962,
"eventListeners": -148,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.800000000000182
},
{
"name": "large-graph-zoom",
"durationMs": 3392.834000000107,
"styleRecalcs": 65,
"styleRecalcDurationMs": 16.162000000000003,
"layouts": 60,
"layoutDurationMs": 7.832999999999999,
"taskDurationMs": 1652.6499999999999,
"heapDeltaBytes": 7330796,
"heapUsedBytes": 68798236,
"domNodes": -287,
"jsHeapTotalBytes": 7663616,
"scriptDurationMs": 579.179,
"eventListeners": -148,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.66333333333332,
"p95FrameDurationMs": 16.799999999999272
},
{
"name": "minimap-idle",
"durationMs": 2035.4240000000345,
"styleRecalcs": 8,
"styleRecalcDurationMs": 8.776000000000003,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 751.8240000000001,
"heapDeltaBytes": 8429004,
"heapUsedBytes": 69244088,
"domNodes": -284,
"jsHeapTotalBytes": 4780032,
"scriptDurationMs": 122.582,
"eventListeners": -144,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "minimap-idle",
"durationMs": 2014.2190000000255,
"styleRecalcs": 7,
"styleRecalcDurationMs": 7.300000000000001,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 756.8799999999999,
"heapDeltaBytes": 7354832,
"heapUsedBytes": 67946356,
"domNodes": -283,
"jsHeapTotalBytes": 4780032,
"scriptDurationMs": 123.762,
"eventListeners": -144,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "subgraph-dom-widget-clipping",
"durationMs": 596.9830000000229,
"styleRecalcs": 47,
"styleRecalcDurationMs": 11.361999999999998,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 418.183,
"heapDeltaBytes": -11277236,
"heapUsedBytes": 56466484,
"domNodes": 20,
"jsHeapTotalBytes": 21098496,
"scriptDurationMs": 120.872,
"eventListeners": 8,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "subgraph-dom-widget-clipping",
"durationMs": 609.536999999932,
"styleRecalcs": 48,
"styleRecalcDurationMs": 13.212000000000002,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 420.624,
"heapDeltaBytes": -12220168,
"heapUsedBytes": 55873056,
"domNodes": 22,
"jsHeapTotalBytes": 22409216,
"scriptDurationMs": 124.40500000000002,
"eventListeners": 8,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.66333333333335,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "subgraph-idle",
"durationMs": 2057.1090000000254,
"styleRecalcs": 10,
"styleRecalcDurationMs": 9.341000000000003,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 581.355,
"heapDeltaBytes": -21653440,
"heapUsedBytes": 46390504,
"domNodes": -279,
"jsHeapTotalBytes": 20439040,
"scriptDurationMs": 20.561999999999998,
"eventListeners": -148,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.66333333333332,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "subgraph-idle",
"durationMs": 2021.394999999984,
"styleRecalcs": 10,
"styleRecalcDurationMs": 9.892000000000001,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 564.747,
"heapDeltaBytes": -21371208,
"heapUsedBytes": 46633912,
"domNodes": -279,
"jsHeapTotalBytes": 21225472,
"scriptDurationMs": 19.816,
"eventListeners": -148,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "subgraph-mouse-sweep",
"durationMs": 1758.0449999999814,
"styleRecalcs": 77,
"styleRecalcDurationMs": 42.631,
"layouts": 16,
"layoutDurationMs": 4.824,
"taskDurationMs": 836.406,
"heapDeltaBytes": -4559400,
"heapUsedBytes": 63395316,
"domNodes": 64,
"jsHeapTotalBytes": 21360640,
"scriptDurationMs": 98.985,
"eventListeners": 4,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.66999999999998,
"p95FrameDurationMs": 16.799999999999272
},
{
"name": "subgraph-mouse-sweep",
"durationMs": 1737.4099999999544,
"styleRecalcs": 75,
"styleRecalcDurationMs": 38.337999999999994,
"layouts": 16,
"layoutDurationMs": 4.5169999999999995,
"taskDurationMs": 856.8299999999999,
"heapDeltaBytes": -18738292,
"heapUsedBytes": 49397936,
"domNodes": -283,
"jsHeapTotalBytes": 20439040,
"scriptDurationMs": 99.94600000000001,
"eventListeners": -148,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "subgraph-transition-enter",
"durationMs": 1425.2240000000143,
"styleRecalcs": 19,
"styleRecalcDurationMs": 32.12,
"layouts": 15,
"layoutDurationMs": 13.649999999999999,
"taskDurationMs": 1029.727,
"heapDeltaBytes": 31146576,
"heapUsedBytes": 99405972,
"domNodes": 13673,
"jsHeapTotalBytes": 15204352,
"scriptDurationMs": 39.843999999999994,
"eventListeners": 2371,
"totalBlockingTimeMs": 137,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "viewport-pan-sweep",
"durationMs": 8696.964999999978,
"styleRecalcs": 250,
"styleRecalcDurationMs": 40.67900000000001,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 4871.075,
"heapDeltaBytes": 16268452,
"heapUsedBytes": 75025272,
"domNodes": -281,
"jsHeapTotalBytes": 6545408,
"scriptDurationMs": 1490.772,
"eventListeners": -128,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.799999999999272
},
{
"name": "viewport-pan-sweep",
"durationMs": 8453.738000000045,
"styleRecalcs": 249,
"styleRecalcDurationMs": 37.66700000000001,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 4741.334999999999,
"heapDeltaBytes": 10492336,
"heapUsedBytes": 72076924,
"domNodes": -279,
"jsHeapTotalBytes": 6807552,
"scriptDurationMs": 1452.707,
"eventListeners": -126,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.670000000000012,
"p95FrameDurationMs": 16.799999999999272
},
{
"name": "vue-large-graph-idle",
"durationMs": 17439.555999999982,
"styleRecalcs": 0,
"styleRecalcDurationMs": 0,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 17399.453999999998,
"heapDeltaBytes": -60902412,
"heapUsedBytes": 165895024,
"domNodes": -8312,
"jsHeapTotalBytes": -11735040,
"scriptDurationMs": 586.385,
"eventListeners": -16387,
"totalBlockingTimeMs": 0,
"frameDurationMs": 17.779999999999927,
"p95FrameDurationMs": 16.799999999999272
},
{
"name": "vue-large-graph-idle",
"durationMs": 17391.391,
"styleRecalcs": 0,
"styleRecalcDurationMs": 0,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 17361.087,
"heapDeltaBytes": -55686620,
"heapUsedBytes": 168361880,
"domNodes": -8312,
"jsHeapTotalBytes": -12001280,
"scriptDurationMs": 619.7330000000001,
"eventListeners": -16389,
"totalBlockingTimeMs": 11,
"frameDurationMs": 17.780000000000047,
"p95FrameDurationMs": 16.799999999999272
},
{
"name": "vue-large-graph-pan",
"durationMs": 21361.036000000015,
"styleRecalcs": 147,
"styleRecalcDurationMs": 20.05699999999999,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 21313.966,
"heapDeltaBytes": -56546760,
"heapUsedBytes": 157746632,
"domNodes": -8316,
"jsHeapTotalBytes": -13312000,
"scriptDurationMs": 955.4990000000001,
"eventListeners": -16385,
"totalBlockingTimeMs": 350,
"frameDurationMs": 17.776666666666642,
"p95FrameDurationMs": 16.700000000000728
},
{
"name": "vue-large-graph-pan",
"durationMs": 21468.724999999948,
"styleRecalcs": 151,
"styleRecalcDurationMs": 19.600999999999978,
"layouts": 0,
"layoutDurationMs": 0,
"taskDurationMs": 21405.718999999997,
"heapDeltaBytes": -61603008,
"heapUsedBytes": 156336296,
"domNodes": -8316,
"jsHeapTotalBytes": -13574144,
"scriptDurationMs": 926.0099999999999,
"eventListeners": -16379,
"totalBlockingTimeMs": 201,
"frameDurationMs": 17.776666666666642,
"p95FrameDurationMs": 16.799999999999272
},
{
"name": "workflow-execution",
"durationMs": 466.16399999999203,
"styleRecalcs": 12,
"styleRecalcDurationMs": 18.637,
"layouts": 3,
"layoutDurationMs": 0.6300000000000001,
"taskDurationMs": 121.79399999999998,
"heapDeltaBytes": -15788932,
"heapUsedBytes": 51296616,
"domNodes": 128,
"jsHeapTotalBytes": 7729152,
"scriptDurationMs": 11.208999999999998,
"eventListeners": 67,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.800000000000182
},
{
"name": "workflow-execution",
"durationMs": 476.4479999998912,
"styleRecalcs": 15,
"styleRecalcDurationMs": 23.976,
"layouts": 4,
"layoutDurationMs": 1.4860000000000002,
"taskDurationMs": 127.20899999999999,
"heapDeltaBytes": -16005816,
"heapUsedBytes": 51077840,
"domNodes": 119,
"jsHeapTotalBytes": 7729152,
"scriptDurationMs": 10.753000000000002,
"eventListeners": 65,
"totalBlockingTimeMs": 0,
"frameDurationMs": 16.666666666666668,
"p95FrameDurationMs": 16.700000000000728
}
]
} |
|
Requested by Christian Byrne · Slack thread Closing this draft. I compared this against #14551, which sounded related ("SamplerCustomAdvanced/KSamplerSelect previews not bubbling to the outer SubgraphNode") but turned out to be a genuinely distinct bug on a separate rendering path, not a fix for this one:
Rather than losing this work, I pushed both test files here as an additional commit onto #14551's branch and left a comment there: #14551 (comment) Generated by Claude Code |
<!-- ccr-slack-attribution -->
Requested by Christian Byrne · Slack thread
Summary
Adds e2e and unit regression coverage for incident-94: a mid-execution sampler/latent preview image inside a subgraph does not appear on the outer, non-entered SubgraphNode. Progress bars/spinners still render correctly on the subgraph node — only the live preview image is missing.
Root cause (already identified, not touched by this PR): commit 0157b47 (PR #12197, "Subgraph Link Only Promotion" / ADR 0009) added
&& !lgraphNode?.isSubgraphNode()to the live-previewv-ifinsrc/renderer/extensions/vueNodes/components/LGraphNode.vue. The underlying data pipeline already populates the preview correctly for the SubgraphNode's own execution id — this is purely a rendering-layer guard that hides it.Both tests in this PR currently fail against
main, as intended — they are meant to go green once thev-ifguard is fixed.What's added
browser_tests/tests/vueNodes/interactions/node/imagePreview.spec.ts— new e2e test that builds a subgraph containing a KSampler, stays on the outer (non-entered) graph, fires the realb_preview_with_metadataWS event viaExecutionHelper.latentPreviewagainst the nested execution id, and asserts the outer SubgraphNode renders the live preview image.src/renderer/extensions/vueNodes/components/LGraphNode.test.ts— new component test asserting that when a node is a subgraph node with a populated preview, theLivePreviewelement renders.Test plan
pnpm test:unit src/renderer/extensions/vueNodes/components/LGraphNode.test.ts— new test fails againstmain(noimgrendered), 14 pre-existing tests in the file still passpnpm lint/pnpm typecheckon changed files — cleanpnpm test:browser:local— could not run in this environment (no ComfyUI backend/dev server reachable); the e2e test should be run in CI or against a local ComfyUI instanceGenerated by Claude Code