mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-29 10:42:44 +00:00
[backport cloud/1.32] fix: Vue Node <-> Litegraph node height offset normalization (#6977)
## Summary
Backport of #6966 onto cloud/1.32.
- cherry-picked 29dbfa3f
- resolved snapshot conflicts by taking the updated expectations from
the upstream commit
## Testing
- pnpm typecheck
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6977-backport-cloud-1-32-fix-Vue-Node-Litegraph-node-height-offset-normalization-2b86d73d36508119a3e8db7b27107215)
by [Unito](https://www.unito.io)
Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
@@ -1,11 +1,9 @@
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest'
|
||||
|
||||
import { LiteGraph } from '@/lib/litegraph/src/litegraph'
|
||||
import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
|
||||
import {
|
||||
type LayoutChange,
|
||||
LayoutSource,
|
||||
type NodeLayout
|
||||
} from '@/renderer/core/layout/types'
|
||||
import { LayoutSource } from '@/renderer/core/layout/types'
|
||||
import type { LayoutChange, NodeLayout } from '@/renderer/core/layout/types'
|
||||
|
||||
describe('layoutStore CRDT operations', () => {
|
||||
beforeEach(() => {
|
||||
@@ -304,4 +302,108 @@ describe('layoutStore CRDT operations', () => {
|
||||
expect(recentOps.length).toBeGreaterThanOrEqual(1)
|
||||
expect(recentOps[0].type).toBe('moveNode')
|
||||
})
|
||||
|
||||
it('normalizes DOM-sourced heights before storing', () => {
|
||||
const nodeId = 'dom-node'
|
||||
const layout = createTestNode(nodeId)
|
||||
|
||||
layoutStore.applyOperation({
|
||||
type: 'createNode',
|
||||
entity: 'node',
|
||||
nodeId,
|
||||
layout,
|
||||
timestamp: Date.now(),
|
||||
source: LayoutSource.External,
|
||||
actor: 'test'
|
||||
})
|
||||
|
||||
layoutStore.setSource(LayoutSource.DOM)
|
||||
layoutStore.batchUpdateNodeBounds([
|
||||
{
|
||||
nodeId,
|
||||
bounds: {
|
||||
x: layout.bounds.x,
|
||||
y: layout.bounds.y,
|
||||
width: layout.size.width,
|
||||
height: layout.size.height + LiteGraph.NODE_TITLE_HEIGHT
|
||||
}
|
||||
}
|
||||
])
|
||||
|
||||
const nodeRef = layoutStore.getNodeLayoutRef(nodeId)
|
||||
expect(nodeRef.value?.size.height).toBe(layout.size.height)
|
||||
expect(nodeRef.value?.size.width).toBe(layout.size.width)
|
||||
expect(nodeRef.value?.position).toEqual(layout.position)
|
||||
})
|
||||
|
||||
it('normalizes very small DOM-sourced heights safely', () => {
|
||||
const nodeId = 'small-dom-node'
|
||||
const layout = createTestNode(nodeId)
|
||||
layout.size.height = 10
|
||||
|
||||
layoutStore.applyOperation({
|
||||
type: 'createNode',
|
||||
entity: 'node',
|
||||
nodeId,
|
||||
layout,
|
||||
timestamp: Date.now(),
|
||||
source: LayoutSource.External,
|
||||
actor: 'test'
|
||||
})
|
||||
|
||||
layoutStore.setSource(LayoutSource.DOM)
|
||||
layoutStore.batchUpdateNodeBounds([
|
||||
{
|
||||
nodeId,
|
||||
bounds: {
|
||||
x: layout.bounds.x,
|
||||
y: layout.bounds.y,
|
||||
width: layout.size.width,
|
||||
height: layout.size.height + LiteGraph.NODE_TITLE_HEIGHT
|
||||
}
|
||||
}
|
||||
])
|
||||
|
||||
const nodeRef = layoutStore.getNodeLayoutRef(nodeId)
|
||||
expect(nodeRef.value?.size.height).toBeGreaterThanOrEqual(0)
|
||||
})
|
||||
|
||||
it('handles undefined NODE_TITLE_HEIGHT without NaN results', () => {
|
||||
const nodeId = 'undefined-title-height'
|
||||
const layout = createTestNode(nodeId)
|
||||
|
||||
layoutStore.applyOperation({
|
||||
type: 'createNode',
|
||||
entity: 'node',
|
||||
nodeId,
|
||||
layout,
|
||||
timestamp: Date.now(),
|
||||
source: LayoutSource.External,
|
||||
actor: 'test'
|
||||
})
|
||||
|
||||
const originalTitleHeight = LiteGraph.NODE_TITLE_HEIGHT
|
||||
// @ts-expect-error – intentionally simulate undefined runtime value
|
||||
LiteGraph.NODE_TITLE_HEIGHT = undefined
|
||||
|
||||
try {
|
||||
layoutStore.setSource(LayoutSource.DOM)
|
||||
layoutStore.batchUpdateNodeBounds([
|
||||
{
|
||||
nodeId,
|
||||
bounds: {
|
||||
x: layout.bounds.x,
|
||||
y: layout.bounds.y,
|
||||
width: layout.size.width,
|
||||
height: layout.size.height
|
||||
}
|
||||
}
|
||||
])
|
||||
|
||||
const nodeRef = layoutStore.getNodeLayoutRef(nodeId)
|
||||
expect(nodeRef.value?.size.height).toBe(layout.size.height)
|
||||
} finally {
|
||||
LiteGraph.NODE_TITLE_HEIGHT = originalTitleHeight
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user