fix(test): address PR review feedback for Node Library V2 E2E tests

Remove redundant tests (tab visibility, sort button, blueprints tab),
strengthen search filtering assertions, use deterministic folder
expansion, and remove unrelated JobHistorySidebarTab fixture wiring.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

browser_tests/fixtures/ComfyPage.ts

@@ -20,6 +20,7 @@ import { SettingDialog } from '@e2e/fixtures/components/SettingDialog'
 import {
   AssetsSidebarTab,
   NodeLibrarySidebarTab,
+  NodeLibrarySidebarTabV2,
   WorkflowsSidebarTab
 } from '@e2e/fixtures/components/SidebarTab'
 import { Topbar } from '@e2e/fixtures/components/Topbar'
@@ -33,7 +34,6 @@ import { FeatureFlagHelper } from '@e2e/fixtures/helpers/FeatureFlagHelper'
 import { KeyboardHelper } from '@e2e/fixtures/helpers/KeyboardHelper'
 import { NodeOperationsHelper } from '@e2e/fixtures/helpers/NodeOperationsHelper'
 import { PerformanceHelper } from '@e2e/fixtures/helpers/PerformanceHelper'
-import { QueueHelper } from '@e2e/fixtures/helpers/QueueHelper'
 import { SettingsHelper } from '@e2e/fixtures/helpers/SettingsHelper'
 import { SubgraphHelper } from '@e2e/fixtures/helpers/SubgraphHelper'
 import { ToastHelper } from '@e2e/fixtures/helpers/ToastHelper'
@@ -57,6 +57,7 @@ class ComfyPropertiesPanel {
 class ComfyMenu {
   private _assetsTab: AssetsSidebarTab | null = null
   private _nodeLibraryTab: NodeLibrarySidebarTab | null = null
+  private _nodeLibraryTabV2: NodeLibrarySidebarTabV2 | null = null
   private _workflowsTab: WorkflowsSidebarTab | null = null
   private _topbar: Topbar | null = null
 
@@ -79,6 +80,11 @@ class ComfyMenu {
     return this._nodeLibraryTab
   }
 
+  get nodeLibraryTabV2() {
+    this._nodeLibraryTabV2 ??= new NodeLibrarySidebarTabV2(this.page)
+    return this._nodeLibraryTabV2
+  }
+
   get assetsTab() {
     this._assetsTab ??= new AssetsSidebarTab(this.page)
     return this._assetsTab
@@ -200,7 +206,6 @@ export class ComfyPage {
   public readonly queuePanel: QueuePanel
   public readonly perf: PerformanceHelper
   public readonly assets: AssetsHelper
-  public readonly queue: QueueHelper
 
   /** Worker index to test user ID */
   public readonly userIds: string[] = []
@@ -248,7 +253,6 @@ export class ComfyPage {
     this.queuePanel = new QueuePanel(page)
     this.perf = new PerformanceHelper(page)
     this.assets = new AssetsHelper(page)
-    this.queue = new QueueHelper(page)
   }
 
   get visibleToasts() {

browser_tests/fixtures/components/SidebarTab.ts

@@ -100,6 +100,59 @@ export class NodeLibrarySidebarTab extends SidebarTab {
   }
 }
 
+export class NodeLibrarySidebarTabV2 extends SidebarTab {
+  constructor(public override readonly page: Page) {
+    super(page, 'node-library')
+  }
+
+  get searchInput() {
+    return this.page.getByPlaceholder('Search...')
+  }
+
+  get sidebarContent() {
+    return this.page.locator('.sidebar-content-container')
+  }
+
+  getTab(name: string) {
+    return this.sidebarContent.getByRole('tab', { name, exact: true })
+  }
+
+  get allTab() {
+    return this.getTab('All')
+  }
+
+  get blueprintsTab() {
+    return this.getTab('Blueprints')
+  }
+
+  get sortButton() {
+    return this.sidebarContent.getByRole('button', { name: 'Sort' })
+  }
+
+  getFolder(folderName: string) {
+    return this.sidebarContent
+      .getByRole('treeitem', { name: folderName })
+      .first()
+  }
+
+  getNode(nodeName: string) {
+    return this.sidebarContent.getByRole('treeitem', { name: nodeName }).first()
+  }
+
+  async expandFolder(folderName: string) {
+    const folder = this.getFolder(folderName)
+    const isExpanded = await folder.getAttribute('aria-expanded')
+    if (isExpanded !== 'true') {
+      await folder.click()
+    }
+  }
+
+  override async open() {
+    await super.open()
+    await this.searchInput.waitFor({ state: 'visible' })
+  }
+}
+
 export class WorkflowsSidebarTab extends SidebarTab {
   constructor(public override readonly page: Page) {
     super(page, 'workflows')
@@ -170,6 +223,63 @@ export class WorkflowsSidebarTab extends SidebarTab {
   }
 }
 
+export class JobHistorySidebarTab extends SidebarTab {
+  constructor(public override readonly page: Page) {
+    super(page, 'job-history')
+  }
+
+  /** Scope all locators to the sidebar panel to avoid collision
+   *  with QueueOverlayExpanded which renders the same controls. */
+  private get panel() {
+    return this.page.locator('.sidebar-content-container')
+  }
+
+  get allTab() {
+    return this.panel.getByRole('button', { name: 'All', exact: true })
+  }
+
+  get completedTab() {
+    return this.panel.getByRole('button', { name: 'Completed', exact: true })
+  }
+
+  get failedTab() {
+    return this.panel.getByRole('button', { name: 'Failed', exact: true })
+  }
+
+  get searchInput() {
+    return this.panel.getByPlaceholder('Search...')
+  }
+
+  get filterButton() {
+    return this.panel.getByRole('button', { name: /Filter/i })
+  }
+
+  get sortButton() {
+    return this.panel.getByRole('button', { name: /Sort/i })
+  }
+
+  get jobItems() {
+    return this.panel.locator('[data-job-id]')
+  }
+
+  get noActiveJobsText() {
+    return this.panel.getByText('No active jobs')
+  }
+
+  getJobById(id: string) {
+    return this.panel.locator(`[data-job-id="${id}"]`)
+  }
+
+  get groupLabels() {
+    return this.panel.locator('.text-xs.text-text-secondary')
+  }
+
+  override async open() {
+    await super.open()
+    await this.allTab.waitFor({ state: 'visible', timeout: 5000 })
+  }
+}
+
 export class AssetsSidebarTab extends SidebarTab {
   constructor(public override readonly page: Page) {
     super(page, 'assets')

browser_tests/fixtures/helpers/BuilderFooterHelper.ts

@@ -30,6 +30,10 @@ export class BuilderFooterHelper {
     return this.page.getByTestId(TestIds.builder.saveButton)
   }
 
+  get saveGroup(): Locator {
+    return this.page.getByTestId(TestIds.builder.saveGroup)
+  }
+
   get saveAsButton(): Locator {
     return this.page.getByTestId(TestIds.builder.saveAsButton)
   }

browser_tests/fixtures/helpers/QueueHelper.ts

@@ -1,79 +0,0 @@
-import type { Page, Route } from '@playwright/test'
-
-export class QueueHelper {
-  private queueRouteHandler: ((route: Route) => void) | null = null
-  private historyRouteHandler: ((route: Route) => void) | null = null
-
-  constructor(private readonly page: Page) {}
-
-  /**
-   * Mock the /api/queue endpoint to return specific queue state.
-   */
-  async mockQueueState(
-    running: number = 0,
-    pending: number = 0
-  ): Promise<void> {
-    this.queueRouteHandler = (route: Route) =>
-      route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify({
-          queue_running: Array.from({ length: running }, (_, i) => [
-            i,
-            `running-${i}`,
-            {},
-            {},
-            []
-          ]),
-          queue_pending: Array.from({ length: pending }, (_, i) => [
-            i,
-            `pending-${i}`,
-            {},
-            {},
-            []
-          ])
-        })
-      })
-    await this.page.route('**/api/queue', this.queueRouteHandler)
-  }
-
-  /**
-   * Mock the /api/history endpoint with completed/failed job entries.
-   */
-  async mockHistory(
-    jobs: Array<{ promptId: string; status: 'success' | 'error' }>
-  ): Promise<void> {
-    const history: Record<string, unknown> = {}
-    for (const job of jobs) {
-      history[job.promptId] = {
-        prompt: [0, job.promptId, {}, {}, []],
-        outputs: {},
-        status: {
-          status_str: job.status === 'success' ? 'success' : 'error',
-          completed: true
-        }
-      }
-    }
-    this.historyRouteHandler = (route: Route) =>
-      route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify(history)
-      })
-    await this.page.route('**/api/history**', this.historyRouteHandler)
-  }
-
-  /**
-   * Clear all route mocks set by this helper.
-   */
-  async clearMocks(): Promise<void> {
-    if (this.queueRouteHandler) {
-      await this.page.unroute('**/api/queue', this.queueRouteHandler)
-      this.queueRouteHandler = null
-    }
-    if (this.historyRouteHandler) {
-      await this.page.unroute('**/api/history**', this.historyRouteHandler)
-      this.historyRouteHandler = null
-    }
-  }
-}

browser_tests/fixtures/selectors.ts

@@ -82,6 +82,7 @@ export const TestIds = {
     footerNav: 'builder-footer-nav',
     saveButton: 'builder-save-button',
     saveAsButton: 'builder-save-as-button',
+    saveGroup: 'builder-save-group',
     saveAsChevron: 'builder-save-as-chevron',
     ioItem: 'builder-io-item',
     ioItemTitle: 'builder-io-item-title',

browser_tests/fixtures/utils/slotBoundsUtil.ts

@@ -0,0 +1,98 @@
+import { expect } from '@playwright/test'
+import type { Page } from '@playwright/test'
+
+export interface SlotMeasurement {
+  key: string
+  offsetX: number
+  offsetY: number
+}
+
+export interface NodeSlotData {
+  nodeId: string
+  nodeW: number
+  nodeH: number
+  slots: SlotMeasurement[]
+}
+
+/**
+ * Collect slot center offsets relative to the parent node element.
+ * Returns `null` when the node element is not found.
+ */
+export async function measureNodeSlotOffsets(
+  page: Page,
+  nodeId: string
+): Promise<NodeSlotData | null> {
+  return page.evaluate((id) => {
+    const nodeEl = document.querySelector(`[data-node-id="${id}"]`)
+    if (!nodeEl || !(nodeEl instanceof HTMLElement)) return null
+
+    const nodeRect = nodeEl.getBoundingClientRect()
+    const slotEls = nodeEl.querySelectorAll('[data-slot-key]')
+    const slots: SlotMeasurement[] = []
+
+    for (const slotEl of slotEls) {
+      const slotRect = slotEl.getBoundingClientRect()
+      slots.push({
+        key: (slotEl as HTMLElement).dataset.slotKey ?? 'unknown',
+        offsetX: slotRect.left + slotRect.width / 2 - nodeRect.left,
+        offsetY: slotRect.top + slotRect.height / 2 - nodeRect.top
+      })
+    }
+
+    return {
+      nodeId: id,
+      nodeW: nodeRect.width,
+      nodeH: nodeRect.height,
+      slots
+    }
+  }, nodeId)
+}
+
+/**
+ * Assert that every slot falls within the node dimensions (± `margin` px).
+ */
+export function expectSlotsWithinBounds(
+  data: NodeSlotData,
+  margin: number,
+  label?: string
+) {
+  const prefix = label ? `${label}: ` : ''
+
+  for (const slot of data.slots) {
+    expect(
+      slot.offsetX,
+      `${prefix}Slot ${slot.key} X=${slot.offsetX} outside width=${data.nodeW}`
+    ).toBeGreaterThanOrEqual(-margin)
+    expect(
+      slot.offsetX,
+      `${prefix}Slot ${slot.key} X=${slot.offsetX} outside width=${data.nodeW}`
+    ).toBeLessThanOrEqual(data.nodeW + margin)
+
+    expect(
+      slot.offsetY,
+      `${prefix}Slot ${slot.key} Y=${slot.offsetY} outside height=${data.nodeH}`
+    ).toBeGreaterThanOrEqual(-margin)
+    expect(
+      slot.offsetY,
+      `${prefix}Slot ${slot.key} Y=${slot.offsetY} outside height=${data.nodeH}`
+    ).toBeLessThanOrEqual(data.nodeH + margin)
+  }
+}
+
+/**
+ * Wait for slots, measure, and assert within bounds — single-node convenience.
+ */
+export async function assertNodeSlotsWithinBounds(
+  page: Page,
+  nodeId: string,
+  margin: number = 20
+) {
+  await page
+    .locator(`[data-node-id="${nodeId}"] [data-slot-key]`)
+    .first()
+    .waitFor()
+
+  const data = await measureNodeSlotOffsets(page, nodeId)
+  expect(data, `Node ${nodeId} not found in DOM`).not.toBeNull()
+  expectSlotsWithinBounds(data!, margin, `Node ${nodeId}`)
+}

browser_tests/tests/builderSaveFlow.spec.ts

@@ -189,6 +189,41 @@ test.describe('Builder save flow', { tag: ['@ui'] }, () => {
     await expect(saveAs.nameInput).toBeVisible()
   })
 
+  test('Save button width is consistent across all states', async ({
+    comfyPage
+  }) => {
+    const { appMode } = comfyPage
+    await comfyPage.workflow.loadWorkflow('default')
+    await fitToViewInstant(comfyPage)
+    await appMode.enterBuilder()
+
+    // State 1: Disabled "Save as" (no outputs selected)
+    const disabledBox = await appMode.footer.saveAsButton.boundingBox()
+    expect(disabledBox).toBeTruthy()
+
+    // Select I/O to enable the button
+    await appMode.steps.goToInputs()
+    const ksampler = await comfyPage.nodeOps.getNodeRefById('3')
+    await appMode.select.selectInputWidget(ksampler)
+    await appMode.steps.goToOutputs()
+    await appMode.select.selectOutputNode()
+
+    // State 2: Enabled "Save as" (unsaved, has outputs)
+    const enabledBox = await appMode.footer.saveAsButton.boundingBox()
+    expect(enabledBox).toBeTruthy()
+    expect(enabledBox!.width).toBe(disabledBox!.width)
+
+    // Save the workflow to transition to the Save + chevron state
+    await builderSaveAs(appMode, `${Date.now()} width-test`, 'App')
+    await appMode.saveAs.closeButton.click()
+    await comfyPage.nextFrame()
+
+    // State 3: Save + chevron button group (saved workflow)
+    const saveButtonGroupBox = await appMode.footer.saveGroup.boundingBox()
+    expect(saveButtonGroupBox).toBeTruthy()
+    expect(saveButtonGroupBox!.width).toBe(disabledBox!.width)
+  })
+
   test('Connect output popover appears when no outputs selected', async ({
     comfyPage
   }) => {

browser_tests/tests/collapsedNodeLinks.spec.ts

@@ -0,0 +1,68 @@
+import { expect } from '@playwright/test'
+
+import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { assertNodeSlotsWithinBounds } from '../fixtures/utils/slotBoundsUtil'
+
+const NODE_ID = '3'
+const NODE_TITLE = 'KSampler'
+
+test.describe(
+  'Collapsed node link positions',
+  { tag: ['@canvas', '@node'] },
+  () => {
+    test.beforeEach(async ({ comfyPage }) => {
+      await comfyPage.settings.setSetting('Comfy.VueNodes.Enabled', true)
+      await comfyPage.workflow.loadWorkflow('default')
+      await comfyPage.vueNodes.waitForNodes()
+    })
+
+    test.afterEach(async ({ comfyPage }) => {
+      await comfyPage.canvasOps.resetView()
+    })
+
+    test('link endpoints stay within collapsed node bounds', async ({
+      comfyPage
+    }) => {
+      const node = await comfyPage.vueNodes.getFixtureByTitle(NODE_TITLE)
+      await node.toggleCollapse()
+      await comfyPage.nextFrame()
+
+      await assertNodeSlotsWithinBounds(comfyPage.page, NODE_ID)
+    })
+
+    test('links follow collapsed node after drag', async ({ comfyPage }) => {
+      const node = await comfyPage.vueNodes.getFixtureByTitle(NODE_TITLE)
+      await node.toggleCollapse()
+      await comfyPage.nextFrame()
+
+      const box = await node.boundingBox()
+      expect(box).not.toBeNull()
+      await comfyPage.page.mouse.move(
+        box!.x + box!.width / 2,
+        box!.y + box!.height / 2
+      )
+      await comfyPage.page.mouse.down()
+      await comfyPage.page.mouse.move(
+        box!.x + box!.width / 2 + 200,
+        box!.y + box!.height / 2 + 100,
+        { steps: 10 }
+      )
+      await comfyPage.page.mouse.up()
+      await comfyPage.nextFrame()
+
+      await assertNodeSlotsWithinBounds(comfyPage.page, NODE_ID)
+    })
+
+    test('links recover correct positions after expand', async ({
+      comfyPage
+    }) => {
+      const node = await comfyPage.vueNodes.getFixtureByTitle(NODE_TITLE)
+      await node.toggleCollapse()
+      await comfyPage.nextFrame()
+      await node.toggleCollapse()
+      await comfyPage.nextFrame()
+
+      await assertNodeSlotsWithinBounds(comfyPage.page, NODE_ID)
+    })
+  }
+)

browser_tests/tests/sidebar/assets.spec.ts

@@ -527,20 +527,27 @@ test.describe('Assets sidebar - context menu', () => {
     // Dismiss any toasts that appeared after asset loading
     await tab.dismissToasts()
 
-    // Multi-select: click first, then Ctrl/Cmd+click second
+    // Multi-select: use keyboard.down/up so useKeyModifier('Control') detects
+    // the modifier — click({ modifiers }) only sets the mouse event flag and
+    // does not fire a keydown event that VueUse tracks.
     await cards.first().click()
-    await cards.nth(1).click({ modifiers: ['ControlOrMeta'] })
+    await comfyPage.page.keyboard.down('Control')
+    await cards.nth(1).click()
+    await comfyPage.page.keyboard.up('Control')
 
     // Verify multi-selection took effect and footer is stable before right-clicking
     await expect(tab.selectedCards).toHaveCount(2, { timeout: 3000 })
     await expect(tab.selectionFooter).toBeVisible({ timeout: 3000 })
 
-    // Right-click on a selected card (retry to let grid layout settle)
+    // Use dispatchEvent instead of click({ button: 'right' }) to avoid any
+    // overlay intercepting the event, and assert directly without toPass.
     const contextMenu = comfyPage.page.locator('.p-contextmenu')
-    await expect(async () => {
-      await cards.first().click({ button: 'right' })
-      await expect(contextMenu).toBeVisible()
-    }).toPass({ intervals: [300], timeout: 5000 })
+    await cards.first().dispatchEvent('contextmenu', {
+      bubbles: true,
+      cancelable: true,
+      button: 2
+    })
+    await expect(contextMenu).toBeVisible()
 
     // Bulk menu should show bulk download action
     await expect(tab.contextMenuItem('Download all')).toBeVisible()

browser_tests/tests/sidebar/nodeLibraryV2.spec.ts

@@ -0,0 +1,126 @@
+import { expect } from '@playwright/test'
+
+import { comfyPageFixture as test } from '../../fixtures/ComfyPage'
+
+test.describe('Node library sidebar V2', () => {
+  test.beforeEach(async ({ comfyPage }) => {
+    await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Top')
+    await comfyPage.settings.setSetting('Comfy.NodeLibrary.NewDesign', true)
+
+    const tab = comfyPage.menu.nodeLibraryTabV2
+    await tab.open()
+  })
+
+  test('Can switch between tabs', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await expect(tab.allTab).toHaveAttribute('aria-selected', 'true')
+
+    await tab.blueprintsTab.click()
+    await expect(tab.blueprintsTab).toHaveAttribute('aria-selected', 'true')
+    await expect(tab.allTab).toHaveAttribute('aria-selected', 'false')
+
+    await tab.allTab.click()
+    await expect(tab.allTab).toHaveAttribute('aria-selected', 'true')
+    await expect(tab.blueprintsTab).toHaveAttribute('aria-selected', 'false')
+  })
+
+  test('All tab displays node tree with folders', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await expect(tab.allTab).toHaveAttribute('aria-selected', 'true')
+    await expect(tab.getFolder('sampling')).toBeVisible()
+  })
+
+  test('Can expand folder and see nodes in All tab', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await tab.expandFolder('sampling')
+    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible()
+  })
+
+  test('Search filters nodes in All tab', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await expect(tab.getNode('KSampler (Advanced)')).not.toBeVisible()
+
+    await tab.searchInput.fill('KSampler')
+    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible({
+      timeout: 5000
+    })
+    await expect(tab.getNode('CLIPLoader')).not.toBeVisible()
+  })
+
+  test('Drag node to canvas adds it', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await tab.expandFolder('sampling')
+    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible()
+
+    const initialCount = await comfyPage.nodeOps.getGraphNodesCount()
+
+    const canvasBoundingBox = await comfyPage.page
+      .locator('#graph-canvas')
+      .boundingBox()
+    expect(canvasBoundingBox).not.toBeNull()
+    const targetPosition = {
+      x: canvasBoundingBox!.x + canvasBoundingBox!.width / 2,
+      y: canvasBoundingBox!.y + canvasBoundingBox!.height / 2
+    }
+
+    const nodeLocator = tab.getNode('KSampler (Advanced)')
+    await nodeLocator.dragTo(comfyPage.page.locator('#graph-canvas'), {
+      targetPosition
+    })
+
+    await expect
+      .poll(() => comfyPage.nodeOps.getGraphNodesCount(), { timeout: 5000 })
+      .toBe(initialCount + 1)
+  })
+
+  test('Right-click node shows context menu with bookmark option', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await tab.expandFolder('sampling')
+    const node = tab.getNode('KSampler (Advanced)')
+    await expect(node).toBeVisible()
+
+    await node.click({ button: 'right' })
+
+    const contextMenu = comfyPage.page.getByRole('menuitem', {
+      name: /Bookmark Node/
+    })
+    await expect(contextMenu).toBeVisible({ timeout: 3000 })
+  })
+
+  test('Search clear restores folder view', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await expect(tab.getFolder('sampling')).toBeVisible()
+
+    await tab.searchInput.fill('KSampler')
+    await expect(tab.getNode('KSampler (Advanced)')).toBeVisible({
+      timeout: 5000
+    })
+
+    await tab.searchInput.clear()
+    await tab.searchInput.press('Enter')
+
+    await expect(tab.getFolder('sampling')).toBeVisible({ timeout: 5000 })
+  })
+
+  test('Sort dropdown shows sorting options', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.nodeLibraryTabV2
+
+    await tab.sortButton.click()
+
+    // Reka UI DropdownMenuRadioItem renders with role="menuitemradio"
+    const options = comfyPage.page.getByRole('menuitemradio')
+    await expect(options.first()).toBeVisible({ timeout: 3000 })
+    await expect
+      .poll(() => options.count(), { timeout: 3000 })
+      .toBeGreaterThanOrEqual(2)
+  })
+})

browser_tests/tests/subgraph/subgraphSlots.spec.ts

@@ -7,6 +7,10 @@ import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/w
 
 import { comfyPageFixture as test, comfyExpect } from '../../fixtures/ComfyPage'
 import { SubgraphHelper } from '../../fixtures/helpers/SubgraphHelper'
+import {
+  expectSlotsWithinBounds,
+  measureNodeSlotOffsets
+} from '../../fixtures/utils/slotBoundsUtil'
 
 // Constants
 const RENAMED_INPUT_NAME = 'renamed_input'
@@ -19,20 +23,6 @@ const SELECTORS = {
   promptDialog: '.graphdialog input'
 } as const
 
-interface SlotMeasurement {
-  key: string
-  offsetX: number
-  offsetY: number
-}
-
-interface NodeSlotData {
-  nodeId: string
-  isSubgraph: boolean
-  nodeW: number
-  nodeH: number
-  slots: SlotMeasurement[]
-}
-
 test.describe('Subgraph Slots', { tag: ['@slow', '@subgraph'] }, () => {
   test.beforeEach(async ({ comfyPage }) => {
     await comfyPage.settings.setSetting('Comfy.UseNewMenu', 'Disabled')
@@ -604,71 +594,19 @@ test.describe('Subgraph Slots', { tag: ['@slow', '@subgraph'] }, () => {
       )
       await comfyPage.nextFrame()
 
-      // Wait for slot elements to appear in DOM
       await comfyPage.page.locator('[data-slot-key]').first().waitFor()
 
-      const result: NodeSlotData[] = await comfyPage.page.evaluate(() => {
-        const nodes = window.app!.graph._nodes
-        const slotData: NodeSlotData[] = []
+      const nodeIds = await comfyPage.page.evaluate(() =>
+        window
+          .app!.graph._nodes.filter((n) => !!n.isSubgraphNode?.())
+          .map((n) => String(n.id))
+      )
+      expect(nodeIds.length).toBeGreaterThan(0)
 
-        for (const node of nodes) {
-          const nodeId = String(node.id)
-          const nodeEl = document.querySelector(
-            `[data-node-id="${nodeId}"]`
-          ) as HTMLElement | null
-          if (!nodeEl) continue
-
-          const slotEls = nodeEl.querySelectorAll('[data-slot-key]')
-          if (slotEls.length === 0) continue
-
-          const slots: SlotMeasurement[] = []
-
-          const nodeRect = nodeEl.getBoundingClientRect()
-          for (const slotEl of slotEls) {
-            const slotRect = slotEl.getBoundingClientRect()
-            const slotKey = (slotEl as HTMLElement).dataset.slotKey ?? 'unknown'
-            slots.push({
-              key: slotKey,
-              offsetX: slotRect.left + slotRect.width / 2 - nodeRect.left,
-              offsetY: slotRect.top + slotRect.height / 2 - nodeRect.top
-            })
-          }
-
-          slotData.push({
-            nodeId,
-            isSubgraph: !!node.isSubgraphNode?.(),
-            nodeW: nodeRect.width,
-            nodeH: nodeRect.height,
-            slots
-          })
-        }
-
-        return slotData
-      })
-
-      const subgraphNodes = result.filter((n) => n.isSubgraph)
-      expect(subgraphNodes.length).toBeGreaterThan(0)
-
-      for (const node of subgraphNodes) {
-        for (const slot of node.slots) {
-          expect(
-            slot.offsetX,
-            `Slot ${slot.key} on node ${node.nodeId}: X offset ${slot.offsetX} outside node width ${node.nodeW}`
-          ).toBeGreaterThanOrEqual(-SLOT_BOUNDS_MARGIN)
-          expect(
-            slot.offsetX,
-            `Slot ${slot.key} on node ${node.nodeId}: X offset ${slot.offsetX} outside node width ${node.nodeW}`
-          ).toBeLessThanOrEqual(node.nodeW + SLOT_BOUNDS_MARGIN)
-
-          expect(
-            slot.offsetY,
-            `Slot ${slot.key} on node ${node.nodeId}: Y offset ${slot.offsetY} outside node height ${node.nodeH}`
-          ).toBeGreaterThanOrEqual(-SLOT_BOUNDS_MARGIN)
-          expect(
-            slot.offsetY,
-            `Slot ${slot.key} on node ${node.nodeId}: Y offset ${slot.offsetY} outside node height ${node.nodeH}`
-          ).toBeLessThanOrEqual(node.nodeH + SLOT_BOUNDS_MARGIN)
-        }
+      for (const nodeId of nodeIds) {
+        const data = await measureNodeSlotOffsets(comfyPage.page, nodeId)
+        expect(data, `Node ${nodeId} not found in DOM`).not.toBeNull()
+        expectSlotsWithinBounds(data!, SLOT_BOUNDS_MARGIN, `Node ${nodeId}`)
       }
     })
   })

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.43.10",
+  "version": "1.43.11",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",
@@ -140,6 +140,7 @@
     "@testing-library/jest-dom": "catalog:",
     "@testing-library/user-event": "catalog:",
     "@testing-library/vue": "catalog:",
+    "@total-typescript/shoehorn": "catalog:",
     "@types/fs-extra": "catalog:",
     "@types/jsdom": "catalog:",
     "@types/node": "catalog:",

pnpm-lock.yaml

@@ -135,6 +135,9 @@ catalogs:
     '@tiptap/starter-kit':
       specifier: ^2.27.2
       version: 2.27.2
+    '@total-typescript/shoehorn':
+      specifier: ^0.1.2
+      version: 0.1.2
     '@types/fs-extra':
       specifier: ^11.0.4
       version: 11.0.4
@@ -651,6 +654,9 @@ importers:
       '@testing-library/vue':
         specifier: 'catalog:'
         version: 8.1.0(@vue/compiler-sfc@3.5.28)(vue@3.5.13(typescript@5.9.3))
+      '@total-typescript/shoehorn':
+        specifier: 'catalog:'
+        version: 0.1.2
       '@types/fs-extra':
         specifier: 'catalog:'
         version: 11.0.4
@@ -4274,6 +4280,9 @@ packages:
       '@tmcp/auth':
         optional: true
 
+  '@total-typescript/shoehorn@0.1.2':
+    resolution: {integrity: sha512-p7nNZbOZIofpDNyP0u1BctFbjxD44Qc+oO5jufgQdFdGIXJLc33QRloJpq7k5T59CTgLWfQSUxsuqLcmeurYRw==}
+
   '@tweenjs/tween.js@23.1.3':
     resolution: {integrity: sha512-vJmvvwFxYuGnF2axRtPYocag6Clbb5YS7kLL+SO/TeVFzHqDIWrNKYtcsPMibjDx9O+bu+psAy9NKfWklassUA==}
 
@@ -13308,6 +13317,8 @@ snapshots:
       esm-env: 1.2.2
       tmcp: 1.19.0(typescript@5.9.3)
 
+  '@total-typescript/shoehorn@0.1.2': {}
+
   '@tweenjs/tween.js@23.1.3': {}
 
   '@tybys/wasm-util@0.10.1':

pnpm-workspace.yaml

@@ -46,6 +46,7 @@ catalog:
   '@tiptap/extension-table-row': ^2.27.2
   '@tiptap/pm': 2.27.2
   '@tiptap/starter-kit': ^2.27.2
+  '@total-typescript/shoehorn': ^0.1.2
   '@types/fs-extra': ^11.0.4
   '@types/jsdom': ^21.1.7
   '@types/node': ^24.1.0

src/base/common/downloadUtil.test.ts

@@ -1,3 +1,4 @@
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import {
@@ -43,12 +44,12 @@ describe('downloadUtil', () => {
     createObjectURLSpy.mockClear().mockReturnValue('blob:mock-url')
     revokeObjectURLSpy.mockClear().mockImplementation(() => {})
     // Create a mock anchor element
-    mockLink = {
+    mockLink = fromPartial<HTMLAnchorElement>({
       href: '',
       download: '',
       click: vi.fn(),
       style: { display: '' }
-    } as unknown as HTMLAnchorElement
+    })
 
     // Spy on DOM methods
     vi.spyOn(document, 'createElement').mockReturnValue(mockLink)
@@ -172,12 +173,14 @@ describe('downloadUtil', () => {
       const headersMock = {
         get: vi.fn().mockReturnValue(null)
       }
-      fetchMock.mockResolvedValue({
-        ok: true,
-        status: 200,
-        blob: blobFn,
-        headers: headersMock
-      } as unknown as Response)
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: true,
+          status: 200,
+          blob: blobFn,
+          headers: headersMock
+        })
+      )
 
       downloadFile(testUrl)
 
@@ -198,11 +201,13 @@ describe('downloadUtil', () => {
       mockIsCloud.value = true
       const testUrl = 'https://storage.googleapis.com/bucket/missing.bin'
       const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
-      fetchMock.mockResolvedValue({
-        ok: false,
-        status: 404,
-        blob: vi.fn()
-      } as Partial<Response> as Response)
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: false,
+          status: 404,
+          blob: vi.fn()
+        })
+      )
 
       downloadFile(testUrl)
 
@@ -224,12 +229,14 @@ describe('downloadUtil', () => {
       const headersMock = {
         get: vi.fn().mockReturnValue('attachment; filename="user-friendly.png"')
       }
-      fetchMock.mockResolvedValue({
-        ok: true,
-        status: 200,
-        blob: blobFn,
-        headers: headersMock
-      } as unknown as Response)
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: true,
+          status: 200,
+          blob: blobFn,
+          headers: headersMock
+        })
+      )
 
       downloadFile(testUrl)
 
@@ -256,12 +263,14 @@ describe('downloadUtil', () => {
             'attachment; filename="fallback.png"; filename*=UTF-8\'\'%E4%B8%AD%E6%96%87.png'
           )
       }
-      fetchMock.mockResolvedValue({
-        ok: true,
-        status: 200,
-        blob: blobFn,
-        headers: headersMock
-      } as unknown as Response)
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: true,
+          status: 200,
+          blob: blobFn,
+          headers: headersMock
+        })
+      )
 
       downloadFile(testUrl)
 
@@ -282,12 +291,14 @@ describe('downloadUtil', () => {
       const headersMock = {
         get: vi.fn().mockReturnValue(null)
       }
-      fetchMock.mockResolvedValue({
-        ok: true,
-        status: 200,
-        blob: blobFn,
-        headers: headersMock
-      } as unknown as Response)
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: true,
+          status: 200,
+          blob: blobFn,
+          headers: headersMock
+        })
+      )
 
       downloadFile(testUrl, 'my-fallback.png')
 
@@ -328,11 +339,13 @@ describe('downloadUtil', () => {
       const testUrl = 'https://storage.googleapis.com/bucket/image.png'
       const blob = new Blob(['test'], { type: 'image/png' })
       const mockTab = { location: { href: '' }, closed: false, close: vi.fn() }
-      windowOpenSpy.mockReturnValue(mockTab as unknown as Window)
-      fetchMock.mockResolvedValue({
-        ok: true,
-        blob: vi.fn().mockResolvedValue(blob)
-      } as unknown as Response)
+      windowOpenSpy.mockReturnValue(fromAny<Window, unknown>(mockTab))
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: true,
+          blob: vi.fn().mockResolvedValue(blob)
+        })
+      )
 
       await openFileInNewTab(testUrl)
 
@@ -346,11 +359,13 @@ describe('downloadUtil', () => {
       mockIsCloud.value = true
       const blob = new Blob(['test'], { type: 'image/png' })
       const mockTab = { location: { href: '' }, closed: false, close: vi.fn() }
-      windowOpenSpy.mockReturnValue(mockTab as unknown as Window)
-      fetchMock.mockResolvedValue({
-        ok: true,
-        blob: vi.fn().mockResolvedValue(blob)
-      } as unknown as Response)
+      windowOpenSpy.mockReturnValue(fromAny<Window, unknown>(mockTab))
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: true,
+          blob: vi.fn().mockResolvedValue(blob)
+        })
+      )
 
       await openFileInNewTab('https://example.com/image.png')
 
@@ -364,11 +379,10 @@ describe('downloadUtil', () => {
       const testUrl = 'https://storage.googleapis.com/bucket/missing.png'
       const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
       const mockTab = { location: { href: '' }, closed: false, close: vi.fn() }
-      windowOpenSpy.mockReturnValue(mockTab as unknown as Window)
-      fetchMock.mockResolvedValue({
-        ok: false,
-        status: 404
-      } as unknown as Response)
+      windowOpenSpy.mockReturnValue(fromAny<Window, unknown>(mockTab))
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({ ok: false, status: 404 })
+      )
 
       await openFileInNewTab(testUrl)
 
@@ -381,11 +395,13 @@ describe('downloadUtil', () => {
       mockIsCloud.value = true
       const blob = new Blob(['test'], { type: 'image/png' })
       const mockTab = { location: { href: '' }, closed: true, close: vi.fn() }
-      windowOpenSpy.mockReturnValue(mockTab as unknown as Window)
-      fetchMock.mockResolvedValue({
-        ok: true,
-        blob: vi.fn().mockResolvedValue(blob)
-      } as unknown as Response)
+      windowOpenSpy.mockReturnValue(fromAny<Window, unknown>(mockTab))
+      fetchMock.mockResolvedValue(
+        fromPartial<Response>({
+          ok: true,
+          blob: vi.fn().mockResolvedValue(blob)
+        })
+      )
 
       await openFileInNewTab('https://example.com/image.png')
 

src/components/builder/BuilderFooterToolbar.vue

@@ -33,76 +33,91 @@
         {{ t('g.next') }}
         <i class="icon-[lucide--chevron-right]" aria-hidden="true" />
       </Button>
-      <ConnectOutputPopover
-        v-if="!hasOutputs"
-        :is-select-active="isSelectStep"
-        @switch="navigateToStep('builder:outputs')"
-      >
+      <div class="relative min-w-24">
+        <!--
+          Invisible sizers: both labels rendered with matching button padding
+          so the container's intrinsic width equals the wider label.
+          height:0 + overflow:hidden keeps them invisible without affecting height.
+        -->
+        <div class="max-h-0 overflow-y-hidden" aria-hidden="true">
+          <div class="px-4 py-2 text-sm">{{ t('g.save') }}</div>
+          <div class="px-4 py-2 text-sm">{{ t('builderToolbar.saveAs') }}</div>
+        </div>
+        <ConnectOutputPopover
+          v-if="!hasOutputs"
+          class="w-full"
+          :is-select-active="isSelectStep"
+          @switch="navigateToStep('builder:outputs')"
+        >
+          <Button
+            size="lg"
+            class="w-full"
+            :class="disabledSaveClasses"
+            data-testid="builder-save-as-button"
+          >
+            {{ isSaved ? t('g.save') : t('builderToolbar.saveAs') }}
+          </Button>
+        </ConnectOutputPopover>
+        <ButtonGroup
+          v-else-if="isSaved"
+          data-testid="builder-save-group"
+          class="w-full rounded-lg bg-secondary-background has-[[data-save-chevron]:hover]:bg-secondary-background-hover"
+        >
+          <Button
+            size="lg"
+            :disabled="!isModified"
+            class="flex-1"
+            :class="isModified ? activeSaveClasses : disabledSaveClasses"
+            data-testid="builder-save-button"
+            @click="save()"
+          >
+            {{ t('g.save') }}
+          </Button>
+          <DropdownMenuRoot>
+            <DropdownMenuTrigger as-child>
+              <Button
+                size="lg"
+                :aria-label="t('builderToolbar.saveAs')"
+                data-save-chevron
+                data-testid="builder-save-as-chevron"
+                class="w-6 rounded-l-none border-l border-border-default px-0"
+              >
+                <i
+                  class="icon-[lucide--chevron-down] size-4"
+                  aria-hidden="true"
+                />
+              </Button>
+            </DropdownMenuTrigger>
+            <DropdownMenuPortal>
+              <DropdownMenuContent
+                align="end"
+                :side-offset="4"
+                class="z-1001 min-w-36 rounded-lg border border-border-subtle bg-base-background p-1 shadow-interface"
+              >
+                <DropdownMenuItem as-child @select="saveAs()">
+                  <Button
+                    variant="secondary"
+                    size="lg"
+                    class="w-full justify-start font-normal"
+                  >
+                    {{ t('builderToolbar.saveAs') }}
+                  </Button>
+                </DropdownMenuItem>
+              </DropdownMenuContent>
+            </DropdownMenuPortal>
+          </DropdownMenuRoot>
+        </ButtonGroup>
         <Button
+          v-else
           size="lg"
-          :class="cn('w-24', disabledSaveClasses)"
+          class="w-full"
+          :class="activeSaveClasses"
           data-testid="builder-save-as-button"
+          @click="saveAs()"
         >
-          {{ isSaved ? t('g.save') : t('builderToolbar.saveAs') }}
+          {{ t('builderToolbar.saveAs') }}
         </Button>
-      </ConnectOutputPopover>
-      <ButtonGroup
-        v-else-if="isSaved"
-        class="w-24 rounded-lg bg-secondary-background has-[[data-save-chevron]:hover]:bg-secondary-background-hover"
-      >
-        <Button
-          size="lg"
-          :disabled="!isModified"
-          class="flex-1"
-          :class="isModified ? activeSaveClasses : disabledSaveClasses"
-          data-testid="builder-save-button"
-          @click="save()"
-        >
-          {{ t('g.save') }}
-        </Button>
-        <DropdownMenuRoot>
-          <DropdownMenuTrigger as-child>
-            <Button
-              size="lg"
-              :aria-label="t('builderToolbar.saveAs')"
-              data-save-chevron
-              data-testid="builder-save-as-chevron"
-              class="w-6 rounded-l-none border-l border-border-default px-0"
-            >
-              <i
-                class="icon-[lucide--chevron-down] size-4"
-                aria-hidden="true"
-              />
-            </Button>
-          </DropdownMenuTrigger>
-          <DropdownMenuPortal>
-            <DropdownMenuContent
-              align="end"
-              :side-offset="4"
-              class="z-1001 min-w-36 rounded-lg border border-border-subtle bg-base-background p-1 shadow-interface"
-            >
-              <DropdownMenuItem as-child @select="saveAs()">
-                <Button
-                  variant="secondary"
-                  size="lg"
-                  class="w-full justify-start font-normal"
-                >
-                  {{ t('builderToolbar.saveAs') }}
-                </Button>
-              </DropdownMenuItem>
-            </DropdownMenuContent>
-          </DropdownMenuPortal>
-        </DropdownMenuRoot>
-      </ButtonGroup>
-      <Button
-        v-else
-        size="lg"
-        :class="activeSaveClasses"
-        data-testid="builder-save-as-button"
-        @click="saveAs()"
-      >
-        {{ t('builderToolbar.saveAs') }}
-      </Button>
+      </div>
     </nav>
   </div>
 </template>
@@ -126,8 +141,6 @@ import { useAppMode } from '@/composables/useAppMode'
 import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import { useAppModeStore } from '@/stores/appModeStore'
 import { useDialogStore } from '@/stores/dialogStore'
-import { cn } from '@/utils/tailwindUtil'
-
 import BuilderOpensAsPopover from './BuilderOpensAsPopover.vue'
 import { setWorkflowDefaultView } from './builderViewOptions'
 import ConnectOutputPopover from './ConnectOutputPopover.vue'

src/components/graph/DomWidgets.test.ts

@@ -1,3 +1,5 @@
+import { createTestingPinia } from '@pinia/testing'
+import { fromPartial } from '@total-typescript/shoehorn'
 import { mount } from '@vue/test-utils'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
@@ -9,7 +11,6 @@ import type { LGraphCanvas } from '@/lib/litegraph/src/LGraphCanvas'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import type { BaseDOMWidget } from '@/scripts/domWidget'
 import { useDomWidgetStore } from '@/stores/domWidgetStore'
-import { createTestingPinia } from '@pinia/testing'
 
 type TestWidget = BaseDOMWidget<object | string>
 
@@ -28,7 +29,7 @@ function createNode(
 }
 
 function createWidget(id: string, node: LGraphNode, y = 12): TestWidget {
-  return {
+  return fromPartial<TestWidget>({
     id,
     node,
     name: 'test_widget',
@@ -40,16 +41,16 @@ function createWidget(id: string, node: LGraphNode, y = 12): TestWidget {
     computedHeight: 40,
     margin: 10,
     isVisible: () => true
-  } as unknown as TestWidget
+  })
 }
 
 function createCanvas(graph: LGraph): LGraphCanvas {
-  return {
+  return fromPartial<LGraphCanvas>({
     graph,
     low_quality: false,
     read_only: false,
     isNodeVisible: vi.fn(() => true)
-  } as unknown as LGraphCanvas
+  })
 }
 
 function drawFrame(canvas: LGraphCanvas) {

src/components/graph/widgets/DomWidget.test.ts

@@ -1,14 +1,14 @@
-import { mount } from '@vue/test-utils'
 import { createTestingPinia } from '@pinia/testing'
+import { fromPartial } from '@total-typescript/shoehorn'
+import { mount } from '@vue/test-utils'
 import { setActivePinia } from 'pinia'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import { reactive } from 'vue'
 
-import { createMockLGraphNode } from '@/utils/__tests__/litegraphTestUtils'
 import type { BaseDOMWidget } from '@/scripts/domWidget'
 import type { DomWidgetState } from '@/stores/domWidgetStore'
 import { useDomWidgetStore } from '@/stores/domWidgetStore'
-
+import { createMockLGraphNode } from '@/utils/__tests__/litegraphTestUtils'
 import DomWidget from './DomWidget.vue'
 
 const mockUpdatePosition = vi.fn()
@@ -63,7 +63,7 @@ function createWidgetState(overrideDisabled: boolean): DomWidgetState {
     }
   })
 
-  const widget = {
+  const widget = fromPartial<BaseDOMWidget<object | string>>({
     id: 'dom-widget-id',
     name: 'test_widget',
     type: 'custom',
@@ -71,7 +71,7 @@ function createWidgetState(overrideDisabled: boolean): DomWidgetState {
     options: {},
     node,
     computedDisabled: false
-  } as unknown as BaseDOMWidget<object | string>
+  })
 
   domWidgetStore.registerWidget(widget)
   domWidgetStore.setPositionOverride(widget.id, {

src/components/graph/widgets/domWidgetZIndex.test.ts

@@ -1,7 +1,7 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { describe, expect, it } from 'vitest'
 
 import { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
-
 import { getDomWidgetZIndex } from './domWidgetZIndex'
 
 describe('getDomWidgetZIndex', () => {
@@ -15,7 +15,7 @@ describe('getDomWidgetZIndex', () => {
     first.order = 0
     second.order = 1
 
-    const nodes = (graph as unknown as { _nodes: LGraphNode[] })._nodes
+    const nodes = fromPartial<{ _nodes: LGraphNode[] }>(graph)._nodes
     nodes.splice(nodes.indexOf(first), 1)
     nodes.push(first)
 

src/components/load3d/Load3dViewerContent.vue

@@ -197,4 +197,15 @@ onBeforeUnmount(() => {
 :deep(.p-panel-content) {
   padding: 0;
 }
+
+:deep(.p-slider) {
+  height: 6px;
+}
+
+:deep(.p-slider-handle) {
+  width: 14px;
+  height: 14px;
+  margin-top: -4px;
+  margin-left: -7px;
+}
 </style>

src/components/load3d/controls/viewer/ViewerCameraControls.vue

@@ -1,9 +1,7 @@
 <template>
   <div class="space-y-4">
-    <div class="space-y-4">
-      <label>
-        {{ t('load3d.viewer.cameraType') }}
-      </label>
+    <div class="flex flex-col gap-2">
+      <label>{{ t('load3d.viewer.cameraType') }}</label>
       <Select
         v-model="cameraType"
         :options="cameras"
@@ -13,7 +11,7 @@
       </Select>
     </div>
 
-    <div v-if="showFOVButton" class="space-y-4">
+    <div v-if="showFOVButton" class="flex flex-col gap-2">
       <label>{{ t('load3d.fov') }}</label>
       <Slider
         v-model="fov"

src/components/load3d/controls/viewer/ViewerLightControls.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="space-y-4">
+  <div class="flex flex-col gap-2">
     <label>{{ $t('load3d.lightIntensity') }}</label>
 
     <Slider

src/components/load3d/controls/viewer/ViewerModelControls.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="space-y-4">
-    <div>
+    <div class="flex flex-col gap-2">
       <label>{{ $t('load3d.upDirection') }}</label>
       <Select
         v-model="upDirection"
@@ -10,7 +10,7 @@
       />
     </div>
 
-    <div v-if="!hideMaterialMode">
+    <div v-if="!hideMaterialMode" class="flex flex-col gap-2">
       <label>{{ $t('load3d.materialMode') }}</label>
       <Select
         v-model="materialMode"

src/components/load3d/controls/viewer/ViewerSceneControls.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="space-y-4">
-    <div v-if="!hasBackgroundImage">
+    <div v-if="!hasBackgroundImage" class="flex flex-col gap-2">
       <label>
         {{ $t('load3d.backgroundColor') }}
       </label>
-      <input v-model="backgroundColor" type="color" class="w-full" />
+      <input v-model="backgroundColor" type="color" class="h-8 w-full" />
     </div>
 
     <div>

src/components/rightSidePanel/errors/swapNodeGroups.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { createPinia, setActivePinia } from 'pinia'
 import { nextTick, ref } from 'vue'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
@@ -159,7 +160,7 @@ describe('swapNodeGroups computed', () => {
 
   it('excludes string nodeType entries', async () => {
     const swap = getSwapNodeGroups([
-      'StringGroupNode' as unknown as MissingNodeType,
+      fromAny<MissingNodeType, unknown>('StringGroupNode'),
       makeMissingNodeType('OldNode', {
         nodeId: '1',
         isReplaceable: true,

src/components/rightSidePanel/errors/useErrorGroups.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { createPinia, setActivePinia } from 'pinia'
 import { nextTick, ref } from 'vue'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
@@ -215,7 +216,7 @@ describe('useErrorGroups', () => {
       const { groups } = createErrorGroups()
       const missingNodesStore = useMissingNodesErrorStore()
       missingNodesStore.setMissingNodeTypes([
-        'StringGroupNode' as unknown as MissingNodeType
+        fromAny<MissingNodeType, unknown>('StringGroupNode')
       ])
       await nextTick()
 

src/components/rightSidePanel/parameters/WidgetActions.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { mount } from '@vue/test-utils'
 import { setActivePinia } from 'pinia'
 import type { Slots } from 'vue'
@@ -10,7 +11,6 @@ import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import type { SubgraphNode } from '@/lib/litegraph/src/subgraph/SubgraphNode'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import { usePromotionStore } from '@/stores/promotionStore'
-
 import WidgetActions from './WidgetActions.vue'
 
 const { mockGetInputSpecForWidget } = vi.hoisted(() => ({
@@ -93,13 +93,13 @@ describe('WidgetActions', () => {
   }
 
   function createMockNode(): LGraphNode {
-    return {
+    return fromAny<LGraphNode, unknown>({
       id: 1,
       type: 'TestNode',
       rootGraph: { id: 'graph-test' },
       computeSize: vi.fn(),
       size: [200, 100]
-    } as unknown as LGraphNode
+    })
   }
 
   function mountWidgetActions(widget: IBaseWidget, node: LGraphNode) {
@@ -216,17 +216,17 @@ describe('WidgetActions', () => {
     mockGetInputSpecForWidget.mockReturnValue({
       type: 'CUSTOM'
     })
-    const parentSubgraphNode = {
+    const parentSubgraphNode = fromAny<SubgraphNode, unknown>({
       id: 4,
       rootGraph: { id: 'graph-test' },
       computeSize: vi.fn(),
       size: [300, 150]
-    } as unknown as SubgraphNode
-    const node = {
+    })
+    const node = fromAny<LGraphNode, unknown>({
       id: 4,
       type: 'SubgraphNode',
       rootGraph: { id: 'graph-test' }
-    } as unknown as LGraphNode
+    })
     const widget = {
       name: 'text',
       type: 'text',

src/components/rightSidePanel/parameters/WidgetItem.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { mount } from '@vue/test-utils'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
@@ -72,13 +73,13 @@ const i18n = createI18n({
 })
 
 function createMockNode(overrides: Partial<LGraphNode> = {}): LGraphNode {
-  return {
+  return fromAny<LGraphNode, unknown>({
     id: 1,
     type: 'TestNode',
     isSubgraphNode: () => false,
     graph: { rootGraph: { id: 'test-graph-id' } },
     ...overrides
-  } as unknown as LGraphNode
+  })
 }
 
 function createMockWidget(overrides: Partial<IBaseWidget> = {}): IBaseWidget {
@@ -128,7 +129,7 @@ function createMockPromotedWidgetView(
       return 0
     }
   }
-  return new MockPromotedWidgetView() as unknown as IBaseWidget
+  return fromAny<IBaseWidget, unknown>(new MockPromotedWidgetView())
 }
 
 function mountWidgetItem(

src/composables/element/useDomClipping.test.ts

@@ -1,3 +1,4 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { describe, expect, it, vi, beforeEach, afterEach } from 'vitest'
 
 import { useDomClipping } from './useDomClipping'
@@ -8,7 +9,7 @@ function createMockElement(rect: {
   width: number
   height: number
 }): HTMLElement {
-  return {
+  return fromPartial<HTMLElement>({
     getBoundingClientRect: vi.fn(
       () =>
         ({
@@ -20,7 +21,7 @@ function createMockElement(rect: {
           toJSON: () => ({})
         }) as DOMRect
     )
-  } as unknown as HTMLElement
+  })
 }
 
 function createMockCanvas(rect: {
@@ -29,7 +30,7 @@ function createMockCanvas(rect: {
   width: number
   height: number
 }): HTMLCanvasElement {
-  return {
+  return fromPartial<HTMLCanvasElement>({
     getBoundingClientRect: vi.fn(
       () =>
         ({
@@ -41,7 +42,7 @@ function createMockCanvas(rect: {
           toJSON: () => ({})
         }) as DOMRect
     )
-  } as unknown as HTMLCanvasElement
+  })
 }
 
 describe('useDomClipping', () => {

src/composables/graph/useErrorClearingHooks.test.ts

@@ -1,5 +1,6 @@
-import { setActivePinia } from 'pinia'
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
+import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { installErrorClearingHooks } from '@/composables/graph/useErrorClearingHooks'
@@ -194,7 +195,7 @@ describe('Widget change error clearing via onWidgetChanged', () => {
 
     const store = useExecutionErrorStore()
     vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(
-      undefined as unknown as LGraph
+      fromAny<LGraph, unknown>(undefined)
     )
     store.lastNodeErrors = {
       [String(node.id)]: {

src/composables/graph/useGraphHierarchy.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { Rectangle } from '@/lib/litegraph/src/infrastructure/Rectangle'
@@ -8,7 +9,6 @@ import {
   createMockLGraphNode,
   createMockLGraphGroup
 } from '@/utils/__tests__/litegraphTestUtils'
-
 import { useGraphHierarchy } from './useGraphHierarchy'
 
 vi.mock('@/renderer/core/canvas/canvasStore')
@@ -36,7 +36,10 @@ describe('useGraphHierarchy', () => {
     mockNode = createMockNode()
     mockGroups = []
 
-    mockCanvasStore = {
+    mockCanvasStore = fromAny<
+      Partial<ReturnType<typeof useCanvasStore>>,
+      unknown
+    >({
       canvas: {
         graph: {
           groups: mockGroups
@@ -51,7 +54,7 @@ describe('useGraphHierarchy', () => {
       $dispose: vi.fn(),
       _customProperties: new Set(),
       _p: {}
-    } as unknown as Partial<ReturnType<typeof useCanvasStore>>
+    })
 
     vi.mocked(useCanvasStore).mockReturnValue(
       mockCanvasStore as ReturnType<typeof useCanvasStore>

src/composables/graph/useGraphNodeManager.test.ts

@@ -1,5 +1,6 @@
-import { setActivePinia } from 'pinia'
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
+import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { computed, nextTick, watch } from 'vue'
 
@@ -11,10 +12,10 @@ import {
   createTestSubgraphNode
 } from '@/lib/litegraph/src/subgraph/__fixtures__/subgraphHelpers'
 import { NodeSlotType } from '@/lib/litegraph/src/types/globalEnums'
-import { app } from '@/scripts/app'
-import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { useMissingModelStore } from '@/platform/missingModel/missingModelStore'
 import { useSettingStore } from '@/platform/settings/settingStore'
+import { app } from '@/scripts/app'
+import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { usePromotionStore } from '@/stores/promotionStore'
 import { useWidgetValueStore } from '@/stores/widgetValueStore'
 
@@ -277,18 +278,20 @@ describe('Widget slotMetadata reactivity on link disconnect', () => {
     const secondPromotedView = promotedViews[1]
     if (!secondPromotedView) throw new Error('Expected second promoted view')
 
-    ;(
-      secondPromotedView as unknown as {
+    fromAny<
+      {
         sourceNodeId: string
         sourceWidgetName: string
-      }
-    ).sourceNodeId = '9999'
-    ;(
-      secondPromotedView as unknown as {
+      },
+      unknown
+    >(secondPromotedView).sourceNodeId = '9999'
+    fromAny<
+      {
         sourceNodeId: string
         sourceWidgetName: string
-      }
-    ).sourceWidgetName = 'stale_widget'
+      },
+      unknown
+    >(secondPromotedView).sourceWidgetName = 'stale_widget'
 
     const { vueNodeData } = useGraphNodeManager(graph)
     const nodeData = vueNodeData.get(String(subgraphNode.id))

src/composables/graph/useImageMenuOptions.test.ts

@@ -1,8 +1,8 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { afterEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
 import { createMockLGraphNode } from '@/utils/__tests__/litegraphTestUtils'
-
 import { useImageMenuOptions } from './useImageMenuOptions'
 
 vi.mock('vue-i18n', async (importOriginal) => {
@@ -112,9 +112,11 @@ describe('useImageMenuOptions', () => {
         getType: vi.fn().mockResolvedValue(mockBlob)
       }
 
-      mockClipboard({
-        read: vi.fn().mockResolvedValue([mockClipboardItem])
-      } as unknown as Clipboard)
+      mockClipboard(
+        fromPartial<Clipboard>({
+          read: vi.fn().mockResolvedValue([mockClipboardItem])
+        })
+      )
 
       const { getImageMenuOptions } = useImageMenuOptions()
       const options = getImageMenuOptions(node)
@@ -131,7 +133,7 @@ describe('useImageMenuOptions', () => {
 
     it('handles missing clipboard API gracefully', async () => {
       const node = createImageNode()
-      mockClipboard({ read: undefined } as unknown as Clipboard)
+      mockClipboard(fromPartial<Clipboard>({ read: undefined }))
 
       const { getImageMenuOptions } = useImageMenuOptions()
       const options = getImageMenuOptions(node)
@@ -148,9 +150,11 @@ describe('useImageMenuOptions', () => {
         getType: vi.fn()
       }
 
-      mockClipboard({
-        read: vi.fn().mockResolvedValue([mockClipboardItem])
-      } as unknown as Clipboard)
+      mockClipboard(
+        fromPartial<Clipboard>({
+          read: vi.fn().mockResolvedValue([mockClipboardItem])
+        })
+      )
 
       const { getImageMenuOptions } = useImageMenuOptions()
       const options = getImageMenuOptions(node)

src/composables/maskeditor/useMaskEditorSaver.test.ts

@@ -1,10 +1,11 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
-import { app } from '@/scripts/app'
 import { api } from '@/scripts/api'
+import { app } from '@/scripts/app'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
 import { useMaskEditorSaver } from './useMaskEditorSaver'
 
@@ -21,7 +22,7 @@ vi.mock('@/stores/maskEditorDataStore', () => ({
 }))
 
 function createMockCtx(): CanvasRenderingContext2D {
-  return {
+  return fromPartial<CanvasRenderingContext2D>({
     drawImage: vi.fn(),
     getImageData: vi.fn(() => ({
       data: new Uint8ClampedArray(4 * 4 * 4),
@@ -30,11 +31,11 @@ function createMockCtx(): CanvasRenderingContext2D {
     })),
     putImageData: vi.fn(),
     globalCompositeOperation: 'source-over'
-  } as unknown as CanvasRenderingContext2D
+  })
 }
 
 function createMockCanvas(): HTMLCanvasElement {
-  return {
+  return fromPartial<HTMLCanvasElement>({
     width: 4,
     height: 4,
     getContext: vi.fn(() => createMockCtx()),
@@ -42,7 +43,7 @@ function createMockCanvas(): HTMLCanvasElement {
       cb(new Blob(['x'], { type: 'image/png' }))
     }),
     toDataURL: vi.fn(() => 'data:image/png;base64,mock')
-  } as unknown as HTMLCanvasElement
+  })
 }
 
 const mockEditorStore: Record<string, HTMLCanvasElement | null> = {
@@ -96,7 +97,7 @@ describe('useMaskEditorSaver', () => {
     app.nodeOutputs = {}
     app.nodePreviewImages = {}
 
-    mockNode = {
+    mockNode = fromAny<LGraphNode, unknown>({
       id: 42,
       type: 'LoadImage',
       images: [],
@@ -107,7 +108,7 @@ describe('useMaskEditorSaver', () => {
       widgets_values: ['original.png [input]'],
       properties: { image: 'original.png [input]' },
       graph: { setDirtyCanvas: vi.fn() }
-    } as unknown as LGraphNode
+    })
 
     mockDataStore.sourceNode = mockNode
     mockDataStore.inputData = {
@@ -135,7 +136,7 @@ describe('useMaskEditorSaver', () => {
     vi.spyOn(document, 'createElement').mockImplementation(
       (tagName: string, options?: ElementCreationOptions) => {
         if (tagName === 'canvas')
-          return createMockCanvas() as unknown as HTMLCanvasElement
+          return fromAny<HTMLCanvasElement, unknown>(createMockCanvas())
         return originalCreateElement(tagName, options)
       }
     )

src/composables/node/useNodeImageUpload.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
@@ -44,12 +45,12 @@ vi.mock('@/stores/assetsStore', () => ({
 }))
 
 function createMockNode(): LGraphNode {
-  return {
+  return fromAny<LGraphNode, unknown>({
     isUploading: false,
     imgs: [new Image()],
     graph: { setDirtyCanvas: vi.fn() },
     size: [300, 400]
-  } as unknown as LGraphNode
+  })
 }
 
 function createFile(name = 'test.png'): File {

src/composables/node/useNodePreviewAndDrag.test.ts

@@ -1,8 +1,8 @@
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { ref } from 'vue'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
-
 import { useNodePreviewAndDrag } from './useNodePreviewAndDrag'
 
 const mockStartDrag = vi.fn()
@@ -72,9 +72,9 @@ describe('useNodePreviewAndDrag', () => {
         toJSON: () => ({})
       })
 
-      const mockEvent = {
+      const mockEvent = fromPartial<MouseEvent>({
         currentTarget: mockElement
-      } as Partial<MouseEvent> as MouseEvent
+      })
       result.handleMouseEnter(mockEvent)
 
       expect(result.isHovered.value).toBe(true)
@@ -85,9 +85,9 @@ describe('useNodePreviewAndDrag', () => {
       const result = useNodePreviewAndDrag(nodeDef)
 
       const mockElement = document.createElement('div')
-      const mockEvent = {
+      const mockEvent = fromPartial<MouseEvent>({
         currentTarget: mockElement
-      } as Partial<MouseEvent> as MouseEvent
+      })
       result.handleMouseEnter(mockEvent)
 
       expect(result.isHovered.value).toBe(false)
@@ -116,9 +116,9 @@ describe('useNodePreviewAndDrag', () => {
         setData: vi.fn(),
         setDragImage: vi.fn()
       }
-      const mockEvent = {
+      const mockEvent = fromAny<DragEvent, unknown>({
         dataTransfer: mockDataTransfer
-      } as unknown as DragEvent
+      })
 
       result.handleDragStart(mockEvent)
 
@@ -151,10 +151,10 @@ describe('useNodePreviewAndDrag', () => {
 
       result.isDragging.value = true
 
-      const mockEvent = {
+      const mockEvent = fromPartial<DragEvent>({
         clientX: 100,
         clientY: 200
-      } as Partial<DragEvent> as DragEvent
+      })
 
       result.handleDragEnd(mockEvent)
 
@@ -168,11 +168,11 @@ describe('useNodePreviewAndDrag', () => {
 
       result.isDragging.value = true
 
-      const mockEvent = {
+      const mockEvent = fromPartial<DragEvent>({
         dataTransfer: { dropEffect: 'none' },
         clientX: 300,
         clientY: 400
-      } as Partial<DragEvent> as DragEvent
+      })
 
       result.handleDragEnd(mockEvent)
 

src/composables/useServerLogs.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { useEventListener } from '@vueuse/core'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { nextTick } from 'vue'
@@ -79,10 +80,10 @@ describe('useServerLogs', () => {
 
     // Simulate receiving a log event
     const mockEvent = new CustomEvent('logs', {
-      detail: {
+      detail: fromAny<LogsWsMessage, unknown>({
         type: 'logs',
         entries: [{ m: 'Log message 1' }, { m: 'Log message 2' }]
-      } as unknown as LogsWsMessage
+      })
     }) as CustomEvent<LogsWsMessage>
 
     eventCallback(mockEvent)
@@ -103,14 +104,14 @@ describe('useServerLogs', () => {
     ) => void
 
     const mockEvent = new CustomEvent('logs', {
-      detail: {
+      detail: fromAny<LogsWsMessage, unknown>({
         type: 'logs',
         entries: [
           { m: 'Log message 1 dont remove me' },
           { m: 'remove me' },
           { m: '' }
         ]
-      } as unknown as LogsWsMessage
+      })
     }) as CustomEvent<LogsWsMessage>
 
     eventCallback(mockEvent)

src/composables/useWaveAudioPlayer.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { ref } from 'vue'
 import { afterEach, describe, expect, it, vi } from 'vitest'
 
@@ -80,10 +81,12 @@ describe('useWaveAudioPlayer', () => {
 
     const mockDecodeAudioData = vi.fn(() => Promise.resolve(mockAudioBuffer))
     const mockClose = vi.fn().mockResolvedValue(undefined)
-    globalThis.AudioContext = class {
-      decodeAudioData = mockDecodeAudioData
-      close = mockClose
-    } as unknown as typeof AudioContext
+    globalThis.AudioContext = fromAny<typeof AudioContext, unknown>(
+      class {
+        decodeAudioData = mockDecodeAudioData
+        close = mockClose
+      }
+    )
 
     mockFetchApi.mockResolvedValue({
       ok: true,

src/core/graph/subgraph/matchPromotedInput.test.ts

@@ -1,7 +1,7 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { describe, expect, it } from 'vitest'
 
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
-
 import { matchPromotedInput } from './matchPromotedInput'
 
 type MockInput = {
@@ -31,10 +31,12 @@ describe(matchPromotedInput, () => {
     }
 
     const matched = matchPromotedInput(
-      [aliasInput, exactInput] as unknown as Array<{
-        name: string
-        _widget?: IBaseWidget
-      }>,
+      fromPartial<
+        Array<{
+          name: string
+          _widget?: IBaseWidget
+        }>
+      >([aliasInput, exactInput]),
       targetWidget
     )
 
@@ -48,7 +50,7 @@ describe(matchPromotedInput, () => {
     }
 
     const matched = matchPromotedInput(
-      [aliasInput] as unknown as Array<{ name: string; _widget?: IBaseWidget }>,
+      fromPartial<Array<{ name: string; _widget?: IBaseWidget }>>([aliasInput]),
       targetWidget
     )
 
@@ -65,10 +67,12 @@ describe(matchPromotedInput, () => {
     }
 
     const matched = matchPromotedInput(
-      [firstAliasInput, secondAliasInput] as unknown as Array<{
-        name: string
-        _widget?: IBaseWidget
-      }>,
+      fromPartial<
+        Array<{
+          name: string
+          _widget?: IBaseWidget
+        }>
+      >([firstAliasInput, secondAliasInput]),
       targetWidget
     )
 

src/core/graph/subgraph/promotedWidgetView.test.ts

@@ -1,6 +1,7 @@
 import { createTestingPinia } from '@pinia/testing'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, test, vi } from 'vitest'
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 
 // Barrel import must come first to avoid circular dependency
 // (promotedWidgetView → widgetMap → BaseWidget → LegacyWidget → barrel)
@@ -97,11 +98,12 @@ function promotedWidgets(node: SubgraphNode): PromotedWidgetView[] {
 }
 
 function callSyncPromotions(node: SubgraphNode) {
-  ;(
-    node as unknown as {
+  fromAny<
+    {
       _syncPromotions: () => void
-    }
-  )._syncPromotions()
+    },
+    unknown
+  >(node)._syncPromotions()
 }
 
 describe(createPromotedWidgetView, () => {
@@ -156,7 +158,9 @@ describe(createPromotedWidgetView, () => {
     const [subgraphNode] = setupSubgraph()
     const view = createPromotedWidgetView(subgraphNode, '1', 'myWidget')
     // node is defined via Object.defineProperty at runtime but not on the TS interface
-    expect((view as unknown as Record<string, unknown>).node).toBe(subgraphNode)
+    expect(fromAny<Record<string, unknown>, unknown>(view).node).toBe(
+      subgraphNode
+    )
   })
 
   test('serialize is false', () => {
@@ -289,7 +293,7 @@ describe(createPromotedWidgetView, () => {
       value: 'initial',
       options: {}
     } satisfies Pick<IBaseWidget, 'name' | 'type' | 'value' | 'options'>
-    const fallbackWidget = fallbackWidgetShape as unknown as IBaseWidget
+    const fallbackWidget = fromPartial<IBaseWidget>(fallbackWidgetShape)
     innerNode.widgets = [fallbackWidget]
 
     const widgetValueStore = useWidgetValueStore()
@@ -398,13 +402,13 @@ describe(createPromotedWidgetView, () => {
     subgraphNode.pos = [10, 20]
     const innerNode = firstInnerNode(innerNodes)
     const mouse = vi.fn(() => true)
-    const legacyWidget = {
+    const legacyWidget = fromAny<IBaseWidget, unknown>({
       name: 'legacyMouse',
       type: 'mystery-legacy',
       value: 'val',
       options: {},
       mouse
-    } as unknown as IBaseWidget
+    })
     innerNode.widgets = [legacyWidget]
 
     const view = createPromotedWidgetView(
@@ -1448,17 +1452,20 @@ describe('widgets getter caching', () => {
     subgraphNode.rootGraph.primaryCanvas = fakeCanvas as LGraphCanvas
 
     const reconcileSpy = vi.spyOn(
-      subgraphNode as unknown as {
-        _buildPromotionReconcileState: (
-          entries: Array<{ sourceNodeId: string; sourceWidgetName: string }>,
-          linkedEntries: Array<{
-            inputName: string
-            inputKey: string
-            sourceNodeId: string
-            sourceWidgetName: string
-          }>
-        ) => unknown
-      },
+      fromAny<
+        {
+          _buildPromotionReconcileState: (
+            entries: Array<{ sourceNodeId: string; sourceWidgetName: string }>,
+            linkedEntries: Array<{
+              inputName: string
+              inputKey: string
+              sourceNodeId: string
+              sourceWidgetName: string
+            }>
+          ) => unknown
+        },
+        unknown
+      >(subgraphNode),
       '_buildPromotionReconcileState'
     )
 
@@ -1478,17 +1485,20 @@ describe('widgets getter caching', () => {
     subgraphNode.rootGraph.primaryCanvas = fakeCanvas as LGraphCanvas
 
     const reconcileSpy = vi.spyOn(
-      subgraphNode as unknown as {
-        _buildPromotionReconcileState: (
-          entries: Array<{ sourceNodeId: string; sourceWidgetName: string }>,
-          linkedEntries: Array<{
-            inputName: string
-            inputKey: string
-            sourceNodeId: string
-            sourceWidgetName: string
-          }>
-        ) => unknown
-      },
+      fromAny<
+        {
+          _buildPromotionReconcileState: (
+            entries: Array<{ sourceNodeId: string; sourceWidgetName: string }>,
+            linkedEntries: Array<{
+              inputName: string
+              inputKey: string
+              sourceNodeId: string
+              sourceWidgetName: string
+            }>
+          ) => unknown
+        },
+        unknown
+      >(subgraphNode),
       '_buildPromotionReconcileState'
     )
 
@@ -1522,9 +1532,14 @@ describe('widgets getter caching', () => {
     subgraph.inputNode.slots[0].connect(linkedInputB, linkedNodeB)
 
     const resolveSpy = vi.spyOn(
-      subgraphNode as unknown as {
-        _resolveLinkedPromotionBySubgraphInput: (...args: unknown[]) => unknown
-      },
+      fromAny<
+        {
+          _resolveLinkedPromotionBySubgraphInput: (
+            ...args: unknown[]
+          ) => unknown
+        },
+        unknown
+      >(subgraphNode),
       '_resolveLinkedPromotionBySubgraphInput'
     )
 
@@ -1923,32 +1938,34 @@ function createFakeCanvasContext() {
 
 function createInspectableCanvasContext(fillText = vi.fn()) {
   const fallback = vi.fn()
-  return new Proxy(
-    {
-      fillText,
-      beginPath: vi.fn(),
-      roundRect: vi.fn(),
-      rect: vi.fn(),
-      fill: vi.fn(),
-      stroke: vi.fn(),
-      moveTo: vi.fn(),
-      lineTo: vi.fn(),
-      arc: vi.fn(),
-      measureText: (text: string) => ({ width: text.length * 8 }),
-      fillStyle: '#fff',
-      strokeStyle: '#fff',
-      textAlign: 'left',
-      globalAlpha: 1,
-      lineWidth: 1
-    } as Record<string, unknown>,
-    {
-      get(target, key) {
-        if (typeof key === 'string' && key in target)
-          return target[key as keyof typeof target]
-        return fallback
+  return fromAny<CanvasRenderingContext2D, unknown>(
+    new Proxy(
+      {
+        fillText,
+        beginPath: vi.fn(),
+        roundRect: vi.fn(),
+        rect: vi.fn(),
+        fill: vi.fn(),
+        stroke: vi.fn(),
+        moveTo: vi.fn(),
+        lineTo: vi.fn(),
+        arc: vi.fn(),
+        measureText: (text: string) => ({ width: text.length * 8 }),
+        fillStyle: '#fff',
+        strokeStyle: '#fff',
+        textAlign: 'left',
+        globalAlpha: 1,
+        lineWidth: 1
+      } as Record<string, unknown>,
+      {
+        get(target, key) {
+          if (typeof key === 'string' && key in target)
+            return target[key as keyof typeof target]
+          return fallback
+        }
       }
-    }
-  ) as unknown as CanvasRenderingContext2D
+    )
+  )
 }
 
 function createTwoLevelNestedSubgraph() {

src/core/graph/subgraph/promotionUtils.test.ts

@@ -1,13 +1,14 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
-import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import {
   createTestSubgraph,
   createTestSubgraphNode
 } from '@/lib/litegraph/src/subgraph/__fixtures__/subgraphHelpers'
+import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import { usePromotionStore } from '@/stores/promotionStore'
 
 const updatePreviewsMock = vi.hoisted(() => vi.fn())
@@ -29,7 +30,7 @@ function widget(
     Pick<IBaseWidget, 'name' | 'serialize' | 'type' | 'options'>
   >
 ): IBaseWidget {
-  return { name: 'widget', ...overrides } as unknown as IBaseWidget
+  return fromPartial<IBaseWidget>({ name: 'widget', ...overrides })
 }
 
 describe('isPreviewPseudoWidget', () => {

src/core/graph/subgraph/resolveSubgraphInputLink.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, test, vi } from 'vitest'
 
@@ -101,14 +102,14 @@ describe('resolveSubgraphInputLink', () => {
     vi.spyOn(subgraph, 'getLink').mockImplementation((linkId) => {
       if (typeof linkId !== 'number') return originalGetLink(linkId)
       if (linkId === stale.linkId) {
-        return {
+        return fromPartial<ReturnType<typeof subgraph.getLink>>({
           resolve: () => ({
             inputNode: {
               inputs: undefined,
               getWidgetFromSlot: () => ({ name: 'ignored' })
             }
           })
-        } as unknown as ReturnType<typeof subgraph.getLink>
+        })
       }
 
       return originalGetLink(linkId)

src/core/graph/widgets/matchTypeConfiguring.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, test, vi } from 'vitest'
 
@@ -72,8 +73,8 @@ describe('MatchType during configure', () => {
     const link2Id = switchNode.inputs[1].link!
 
     const outputTypeBefore = switchNode.outputs[0].type
-    ;(
-      app as unknown as { configuringGraphLevel: number }
+    fromAny<{ configuringGraphLevel: number }, unknown>(
+      app
     ).configuringGraphLevel = 1
 
     try {
@@ -92,8 +93,8 @@ describe('MatchType during configure', () => {
       expect(graph.links[link2Id]).toBeDefined()
       expect(switchNode.outputs[0].type).toBe(outputTypeBefore)
     } finally {
-      ;(
-        app as unknown as { configuringGraphLevel: number }
+      fromAny<{ configuringGraphLevel: number }, unknown>(
+        app
       ).configuringGraphLevel = 0
     }
   })

src/lib/litegraph/src/LGraphCanvas.groupSelection.test.ts

@@ -1,7 +1,7 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { CanvasPointerEvent } from '@/lib/litegraph/src/types/events'
-
 import {
   LGraph,
   LGraphCanvas,
@@ -60,7 +60,7 @@ function createCanvas(graph: LGraph): LGraphCanvas {
 
   el.getContext = vi
     .fn()
-    .mockReturnValue(ctx as unknown as CanvasRenderingContext2D)
+    .mockReturnValue(fromAny<CanvasRenderingContext2D, unknown>(ctx))
   el.getBoundingClientRect = vi.fn().mockReturnValue({
     left: 0,
     top: 0,

src/lib/litegraph/src/subgraph/Subgraph.test.ts

@@ -6,12 +6,12 @@
  * and basic I/O management.
  */
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it } from 'vitest'
 
 import type { LGraph } from '@/lib/litegraph/src/litegraph'
 import { createUuidv4, Subgraph } from '@/lib/litegraph/src/litegraph'
-
 import { subgraphTest } from './__fixtures__/subgraphFixtures'
 import {
   assertSubgraphStructure,
@@ -48,7 +48,7 @@ describe('Subgraph Construction', () => {
   it('should require a root graph', () => {
     const subgraphData = createTestSubgraphData()
     const createWithoutRoot = () =>
-      new Subgraph(null as unknown as LGraph, subgraphData)
+      new Subgraph(fromAny<LGraph, unknown>(null), subgraphData)
 
     expect(createWithoutRoot).toThrow('Root graph is required')
   })

src/lib/litegraph/src/subgraph/SubgraphNode.test.ts

@@ -4,13 +4,13 @@
  * Tests for SubgraphNode instances including construction,
  * IO synchronization, and edge cases.
  */
-import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
 
-import type { ExportedSubgraphInstance } from '@/lib/litegraph/src/types/serialisation'
 import { LGraph, LGraphNode, SubgraphNode } from '@/lib/litegraph/src/litegraph'
-
+import type { ExportedSubgraphInstance } from '@/lib/litegraph/src/types/serialisation'
 import { subgraphTest } from './__fixtures__/subgraphFixtures'
 import {
   createTestSubgraph,
@@ -933,14 +933,17 @@ describe('SubgraphNode promotion view keys', () => {
 
     const subgraph = createTestSubgraph()
     const subgraphNode = createTestSubgraphNode(subgraph)
-    const nodeWithKeyBuilder = subgraphNode as unknown as {
-      _makePromotionViewKey: (
-        inputKey: string,
-        interiorNodeId: string,
-        widgetName: string,
-        inputName?: string
-      ) => string
-    }
+    const nodeWithKeyBuilder = fromAny<
+      {
+        _makePromotionViewKey: (
+          inputKey: string,
+          interiorNodeId: string,
+          widgetName: string,
+          inputName?: string
+        ) => string
+      },
+      unknown
+    >(subgraphNode)
 
     const firstKey = nodeWithKeyBuilder._makePromotionViewKey(
       '65',

src/lib/litegraph/src/subgraph/svgBitmapCache.test.ts

@@ -1,3 +1,4 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { describe, expect, it, vi } from 'vitest'
 
 import { createBitmapCache } from './svgBitmapCache'
@@ -25,9 +26,9 @@ describe('createBitmapCache', () => {
       )
   }
 
-  const stubContext = {
+  const stubContext = fromPartial<CanvasRenderingContext2D>({
     drawImage: vi.fn()
-  } as unknown as CanvasRenderingContext2D
+  })
 
   it('returns the SVG when image is not yet complete', () => {
     const svg = mockSvg({ complete: false, naturalWidth: 0 })

src/lib/litegraph/src/utils/textMeasureCache.test.ts

@@ -1,12 +1,13 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { cachedMeasureText, clearTextMeasureCache } from './textMeasureCache'
 
 function createMockCtx(font = '12px sans-serif'): CanvasRenderingContext2D {
-  return {
+  return fromPartial<CanvasRenderingContext2D>({
     font,
     measureText: vi.fn((text: string) => ({ width: text.length * 7 }))
-  } as unknown as CanvasRenderingContext2D
+  })
 }
 
 describe('textMeasureCache', () => {

src/lib/litegraph/src/widgets/BaseWidget.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it } from 'vitest'
 
@@ -167,7 +168,7 @@ describe('BaseWidget store integration', () => {
       const defaultValue = 'You are an expert image-generation engine.'
       const widget = createTestWidget(node, {
         name: 'system_prompt',
-        value: undefined as unknown as number
+        value: fromAny<number, unknown>(undefined)
       })
 
       // Simulate what addDOMWidget does: override value with getter/setter

src/locales/en/nodeDefs.json

@@ -798,7 +798,7 @@
     }
   },
   "CaseConverter": {
-    "display_name": "Case Converter",
+    "display_name": "Text Case Converter",
     "inputs": {
       "string": {
         "name": "string"
@@ -12840,7 +12840,7 @@
     }
   },
   "RegexExtract": {
-    "display_name": "Regex Extract",
+    "display_name": "Text Extract Substring",
     "inputs": {
       "string": {
         "name": "string"
@@ -12871,7 +12871,7 @@
     }
   },
   "RegexMatch": {
-    "display_name": "Regex Match",
+    "display_name": "Text Match",
     "inputs": {
       "string": {
         "name": "string"
@@ -12897,7 +12897,7 @@
     }
   },
   "RegexReplace": {
-    "display_name": "Regex Replace",
+    "display_name": "Text Replace (Regex)",
     "description": "Find and replace text using regex patterns.",
     "inputs": {
       "string": {
@@ -15220,7 +15220,7 @@
     }
   },
   "StringCompare": {
-    "display_name": "Compare",
+    "display_name": "Text Compare",
     "inputs": {
       "string_a": {
         "name": "string_a"
@@ -15242,7 +15242,7 @@
     }
   },
   "StringConcatenate": {
-    "display_name": "Concatenate",
+    "display_name": "Text Concatenate",
     "inputs": {
       "string_a": {
         "name": "string_a"
@@ -15261,7 +15261,7 @@
     }
   },
   "StringContains": {
-    "display_name": "Contains",
+    "display_name": "Text Contains",
     "inputs": {
       "string": {
         "name": "string"
@@ -15281,7 +15281,7 @@
     }
   },
   "StringLength": {
-    "display_name": "Length",
+    "display_name": "Text Length",
     "inputs": {
       "string": {
         "name": "string"
@@ -15295,7 +15295,7 @@
     }
   },
   "StringReplace": {
-    "display_name": "Replace",
+    "display_name": "Text Replace",
     "inputs": {
       "string": {
         "name": "string"
@@ -15314,7 +15314,7 @@
     }
   },
   "StringSubstring": {
-    "display_name": "Substring",
+    "display_name": "Text Substring",
     "inputs": {
       "string": {
         "name": "string"
@@ -15333,7 +15333,7 @@
     }
   },
   "StringTrim": {
-    "display_name": "Trim",
+    "display_name": "Text Trim",
     "inputs": {
       "string": {
         "name": "string"

src/platform/assets/composables/useMediaAssetActions.test.ts

@@ -1,10 +1,10 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
-
 import { useMediaAssetActions } from './useMediaAssetActions'
 
 // Use vi.hoisted to create a mutable reference for isCloud
@@ -77,10 +77,12 @@ vi.mock('@/platform/workflow/core/services/workflowActionsService', () => ({
 
 vi.mock('@/services/litegraphService', () => ({
   useLitegraphService: () => ({
-    addNodeOnGraph: vi.fn().mockReturnValue({
-      widgets: [{ name: 'image', value: '', callback: vi.fn() }],
-      graph: { setDirtyCanvas: vi.fn() }
-    } as unknown as LGraphNode),
+    addNodeOnGraph: vi.fn().mockReturnValue(
+      fromAny<LGraphNode, unknown>({
+        widgets: [{ name: 'image', value: '', callback: vi.fn() }],
+        graph: { setDirtyCanvas: vi.fn() }
+      })
+    ),
     getCanvasCenter: vi.fn().mockReturnValue([100, 100])
   })
 }))

src/platform/missingModel/missingModelScan.test.ts

@@ -1,5 +1,12 @@
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
+import type { LGraph } from '@/lib/litegraph/src/LGraph'
+import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
+import type {
+  IBaseWidget,
+  IComboWidget
+} from '@/lib/litegraph/src/types/widgets'
 import {
   scanAllModelCandidates,
   isModelFileName,
@@ -9,12 +16,6 @@ import {
 } from '@/platform/missingModel/missingModelScan'
 import type { MissingModelCandidate } from '@/platform/missingModel/types'
 import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
-import type { LGraph } from '@/lib/litegraph/src/LGraph'
-import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
-import type {
-  IBaseWidget,
-  IComboWidget
-} from '@/lib/litegraph/src/types/widgets'
 
 vi.mock('@/utils/graphTraversalUtil', () => ({
   collectAllNodes: (graph: { _testNodes: LGraphNode[] }) => graph._testNodes,
@@ -30,32 +31,32 @@ function makeComboWidget(
   value: string | number,
   options: string[] = []
 ): IComboWidget {
-  return {
+  return fromAny<IComboWidget, unknown>({
     type: 'combo',
     name,
     value,
     options: { values: options }
-  } as unknown as IComboWidget
+  })
 }
 
 /** Helper: create an asset widget mock (Cloud combo replacement) */
 function makeAssetWidget(name: string, value: string): IBaseWidget {
-  return {
+  return fromAny<IBaseWidget, unknown>({
     type: 'asset',
     name,
     value,
     options: {}
-  } as unknown as IBaseWidget
+  })
 }
 
 /** Helper: create a non-combo widget mock */
 function makeOtherWidget(name: string, value: unknown): IBaseWidget {
-  return {
+  return fromAny<IBaseWidget, unknown>({
     type: 'number',
     name,
     value,
     options: {}
-  } as unknown as IBaseWidget
+  })
 }
 
 /** Helper: create a mock LGraphNode with configured widgets */
@@ -65,17 +66,17 @@ function makeNode(
   widgets: IBaseWidget[] = [],
   executionId?: string
 ): LGraphNode {
-  return {
+  return fromAny<LGraphNode, unknown>({
     id,
     type,
     widgets,
     _testExecutionId: executionId
-  } as unknown as LGraphNode
+  })
 }
 
 /** Helper: create a mock LGraph containing given nodes */
 function makeGraph(nodes: LGraphNode[]): LGraph {
-  return { _testNodes: nodes } as unknown as LGraph
+  return fromAny<LGraph, unknown>({ _testNodes: nodes })
 }
 
 const noAssetSupport = () => false
@@ -390,13 +391,13 @@ describe('scanAllModelCandidates', () => {
   })
 
   it('skips subgraph container nodes whose promoted widgets are already scanned via interior nodes', () => {
-    const containerNode = {
+    const containerNode = fromAny<LGraphNode, unknown>({
       id: 65,
       type: 'abc-def-uuid',
       widgets: [makeComboWidget('ckpt_name', 'model.safetensors', [])],
       isSubgraphNode: () => true,
       _testExecutionId: '65'
-    } as unknown as LGraphNode
+    })
 
     const interiorNode = makeNode(
       42,
@@ -437,7 +438,7 @@ const alwaysInstalled = async () => true
 describe('enrichWithEmbeddedMetadata', () => {
   it('enriches existing candidate with url and directory from embedded metadata', async () => {
     const candidates = [makeCandidate('model_a.safetensors')]
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
       nodes: [
@@ -467,7 +468,7 @@ describe('enrichWithEmbeddedMetadata', () => {
           hash_type: 'sha256'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const result = await enrichWithEmbeddedMetadata(
       candidates,
@@ -487,7 +488,7 @@ describe('enrichWithEmbeddedMetadata', () => {
         url: 'https://existing.com'
       })
     ]
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
       nodes: [
@@ -515,7 +516,7 @@ describe('enrichWithEmbeddedMetadata', () => {
           directory: 'new_dir'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const result = await enrichWithEmbeddedMetadata(
       candidates,
@@ -530,7 +531,7 @@ describe('enrichWithEmbeddedMetadata', () => {
 
   it('does not mutate the original candidates array', async () => {
     const candidates = [makeCandidate('model_a.safetensors')]
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
       nodes: [
@@ -558,7 +559,7 @@ describe('enrichWithEmbeddedMetadata', () => {
           directory: 'checkpoints'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const originalUrl = candidates[0].url
     await enrichWithEmbeddedMetadata(candidates, graphData, alwaysMissing)
@@ -568,7 +569,7 @@ describe('enrichWithEmbeddedMetadata', () => {
 
   it('adds new candidate for embedded model not found by COMBO scan', async () => {
     const candidates: MissingModelCandidate[] = []
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
       nodes: [
@@ -596,7 +597,7 @@ describe('enrichWithEmbeddedMetadata', () => {
           directory: 'checkpoints'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const result = await enrichWithEmbeddedMetadata(
       candidates,
@@ -611,7 +612,7 @@ describe('enrichWithEmbeddedMetadata', () => {
 
   it('does not add candidate when model is already installed', async () => {
     const candidates: MissingModelCandidate[] = []
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 0,
       last_link_id: 0,
       nodes: [],
@@ -627,7 +628,7 @@ describe('enrichWithEmbeddedMetadata', () => {
           directory: 'checkpoints'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const result = await enrichWithEmbeddedMetadata(
       candidates,
@@ -662,7 +663,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
     // OSS path: candidates start empty, enrichWithEmbeddedMetadata adds
     // missing embedded models so the dialog can show them.
     const candidates: MissingModelCandidate[] = []
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 2,
       last_link_id: 0,
       nodes: [
@@ -706,7 +707,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
           directory: 'loras'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const result = await enrichWithEmbeddedMetadata(
       candidates,
@@ -726,7 +727,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
     // When isAssetSupported is omitted (OSS), unmatched embedded models
     // should have isMissing=true (not undefined), enabling the dialog.
     const candidates: MissingModelCandidate[] = []
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
       nodes: [
@@ -754,7 +755,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
           directory: 'checkpoints'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const result = await enrichWithEmbeddedMetadata(
       candidates,
@@ -769,7 +770,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
 
   it('enrichWithEmbeddedMetadata correctly filters for dialog: only isMissing=true with url', async () => {
     const candidates: MissingModelCandidate[] = []
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
       nodes: [
@@ -802,7 +803,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
           directory: 'checkpoints'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const selectiveInstallCheck = async (name: string) =>
       name === 'installed_model.safetensors'
@@ -821,7 +822,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
 
   it('enrichWithEmbeddedMetadata with isAssetSupported leaves isMissing undefined for asset-supported models (Cloud path)', async () => {
     const candidates: MissingModelCandidate[] = []
-    const graphData = {
+    const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
       nodes: [
@@ -849,7 +850,7 @@ describe('OSS missing model detection (non-Cloud path)', () => {
           directory: 'checkpoints'
         }
       ]
-    } as unknown as ComfyWorkflowJSON
+    })
 
     const result = await enrichWithEmbeddedMetadata(
       candidates,

src/platform/nodeReplacement/cnrIdUtil.test.ts

@@ -1,7 +1,7 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { describe, expect, it } from 'vitest'
 
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
-
 import { getCnrIdFromNode, getCnrIdFromProperties } from './cnrIdUtil'
 
 describe('getCnrIdFromProperties', () => {
@@ -40,28 +40,28 @@ describe('getCnrIdFromProperties', () => {
 
 describe('getCnrIdFromNode', () => {
   it('returns cnr_id from node properties', () => {
-    const node = {
+    const node = fromAny<LGraphNode, unknown>({
       properties: { cnr_id: 'node-pack' }
-    } as unknown as LGraphNode
+    })
     expect(getCnrIdFromNode(node)).toBe('node-pack')
   })
 
   it('returns aux_id when cnr_id is absent', () => {
-    const node = {
+    const node = fromAny<LGraphNode, unknown>({
       properties: { aux_id: 'node-aux-pack' }
-    } as unknown as LGraphNode
+    })
     expect(getCnrIdFromNode(node)).toBe('node-aux-pack')
   })
 
   it('prefers cnr_id over aux_id in node properties', () => {
-    const node = {
+    const node = fromAny<LGraphNode, unknown>({
       properties: { cnr_id: 'primary', aux_id: 'secondary' }
-    } as unknown as LGraphNode
+    })
     expect(getCnrIdFromNode(node)).toBe('primary')
   })
 
   it('returns undefined when node has no cnr_id or aux_id', () => {
-    const node = { properties: {} } as unknown as LGraphNode
+    const node = fromAny<LGraphNode, unknown>({ properties: {} })
     expect(getCnrIdFromNode(node)).toBeUndefined()
   })
 })

src/platform/nodeReplacement/components/SwapNodeGroupRow.test.ts

@@ -1,5 +1,6 @@
-import { mount } from '@vue/test-utils'
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
+import { mount } from '@vue/test-utils'
 import PrimeVue from 'primevue/config'
 import { describe, expect, it, vi } from 'vitest'
 import { createI18n } from 'vue-i18n'
@@ -184,9 +185,9 @@ describe('SwapNodeGroupRow', () => {
       const wrapper = mountRow({
         group: makeGroup({
           // Intentionally omits nodeId to test graceful handling of incomplete node data
-          nodeTypes: [
+          nodeTypes: fromAny<MissingNodeType[], unknown>([
             { type: 'NoIdNode', isReplaceable: true }
-          ] as unknown as MissingNodeType[]
+          ])
         })
       })
       await expand(wrapper)
@@ -234,7 +235,7 @@ describe('SwapNodeGroupRow', () => {
       const wrapper = mountRow({
         group: makeGroup({
           // Intentionally uses a plain string entry to test legacy node type handling
-          nodeTypes: ['StringType'] as unknown as MissingNodeType[]
+          nodeTypes: fromAny<MissingNodeType[], unknown>(['StringType'])
         })
       })
       await wrapper.get('button[aria-label="Expand"]').trigger('click')

src/platform/nodeReplacement/missingNodeScan.test.ts

@@ -1,3 +1,4 @@
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
@@ -58,16 +59,16 @@ function mockNode(
   type: string,
   overrides: Partial<LGraphNode> = {}
 ): LGraphNode {
-  return {
+  return fromAny<LGraphNode, unknown>({
     id,
     type,
     last_serialization: { type },
     ...overrides
-  } as unknown as LGraphNode
+  })
 }
 
 function mockGraph(): LGraph {
-  return {} as unknown as LGraph
+  return fromAny<LGraph, unknown>({})
 }
 
 function getMissingNodesError(
@@ -216,9 +217,9 @@ describe('scanMissingNodes (via rescanAndSurfaceMissingNodes)', () => {
 
   it('uses last_serialization.type over node.type', () => {
     const node = mockNode(1, 'LiveType')
-    node.last_serialization = {
+    node.last_serialization = fromPartial<LGraphNode['last_serialization']>({
       type: 'OriginalType'
-    } as unknown as LGraphNode['last_serialization']
+    })
     vi.mocked(collectAllNodes).mockReturnValue([node])
     vi.mocked(getExecutionIdByNode).mockReturnValue(null)
 

src/platform/nodeReplacement/useNodeReplacement.test.ts

@@ -1,10 +1,11 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { LiteGraph } from '@/lib/litegraph/src/litegraph'
-import type { NodeReplacement } from './types'
 import type { MissingNodeType } from '@/types/comfy'
+import type { NodeReplacement } from './types'
 
 vi.mock('@/lib/litegraph/src/litegraph', () => ({
   LiteGraph: {
@@ -79,13 +80,13 @@ function createMockGraph(
   links: ReturnType<typeof createMockLink>[] = []
 ): LGraph {
   const linksMap = new Map(links.map((l) => [l.id, l]))
-  return {
+  return fromAny<LGraph, unknown>({
     _nodes: nodes,
     _nodes_by_id: Object.fromEntries(nodes.map((n) => [n.id, n])),
     links: linksMap,
     updateExecutionOrder: vi.fn(),
     setDirtyCanvas: vi.fn()
-  } as unknown as LGraph
+  })
 }
 
 function createPlaceholderNode(
@@ -95,7 +96,7 @@ function createPlaceholderNode(
   outputs: { name: string; links: number[] | null }[] = [],
   graph?: LGraph
 ): LGraphNode {
-  return {
+  return fromAny<LGraphNode, unknown>({
     id,
     type,
     pos: [100, 200],
@@ -131,7 +132,7 @@ function createPlaceholderNode(
       outputs: outputs.map((o) => ({ ...o, type: 'IMAGE' })),
       widgets_values: []
     }))
-  } as unknown as LGraphNode
+  })
 }
 
 function createNewNode(
@@ -139,7 +140,7 @@ function createNewNode(
   outputs: { name: string; links: number[] | null }[] = [],
   widgets: { name: string; value: unknown }[] = []
 ): LGraphNode {
-  return {
+  return fromAny<LGraphNode, unknown>({
     id: 0,
     type: '',
     pos: [0, 0],
@@ -153,7 +154,7 @@ function createNewNode(
     widgets: widgets.map((w) => ({ ...w, type: 'combo', options: {} })),
     configure: vi.fn(),
     serialize: vi.fn()
-  } as unknown as LGraphNode
+  })
 }
 
 function makeMissingNodeType(
@@ -756,8 +757,10 @@ describe('useNodeReplacement', () => {
 
     it('should exclude nodes without last_serialization', () => {
       const freshNode = createPlaceholderNode(1, 'OldNode')
-      freshNode.last_serialization =
-        undefined as unknown as LGraphNode['last_serialization']
+      freshNode.last_serialization = fromAny<
+        LGraphNode['last_serialization'],
+        unknown
+      >(undefined)
       const graph = createMockGraph([freshNode])
       Object.assign(app, { rootGraph: graph })
 
@@ -780,7 +783,7 @@ describe('useNodeReplacement', () => {
 
     it('should fall back to node.type when last_serialization.type is undefined', () => {
       const node = createPlaceholderNode(1, 'FallbackType')
-      node.last_serialization!.type = undefined as unknown as string
+      node.last_serialization!.type = fromAny<string, unknown>(undefined)
       node.type = 'FallbackType'
       const graph = createMockGraph([node])
       Object.assign(app, { rootGraph: graph })
@@ -809,7 +812,7 @@ describe('useNodeReplacement', () => {
       // targetTypes still holds the original unsanitized name "OldNode&Special",
       // so the predicate must fall back to checking sanitizeNodeName(originalType).
       const node = createPlaceholderNode(1, 'OldNodeSpecial')
-      node.last_serialization!.type = undefined as unknown as string
+      node.last_serialization!.type = fromAny<string, unknown>(undefined)
       // Simulate what sanitizeNodeName does to '&' in the live type
       node.type = 'OldNodeSpecial' // '&' already stripped by sanitizeNodeName
       const graph = createMockGraph([node])

src/platform/workflow/sharing/components/OpenSharedWorkflowDialogContent.test.ts

@@ -1,9 +1,10 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { flushPromises, mount } from '@vue/test-utils'
-import { createI18n } from 'vue-i18n'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { createI18n } from 'vue-i18n'
 
-import type { SharedWorkflowPayload } from '@/platform/workflow/sharing/types/shareTypes'
 import OpenSharedWorkflowDialogContent from '@/platform/workflow/sharing/components/OpenSharedWorkflowDialogContent.vue'
+import type { SharedWorkflowPayload } from '@/platform/workflow/sharing/types/shareTypes'
 
 const mockGetSharedWorkflow = vi.fn()
 
@@ -51,9 +52,9 @@ function makePayload(
     name: 'Test Workflow',
     listed: true,
     publishedAt: new Date('2026-02-20T00:00:00Z'),
-    workflowJson: {
+    workflowJson: fromPartial<SharedWorkflowPayload['workflowJson']>({
       nodes: []
-    } as unknown as SharedWorkflowPayload['workflowJson'],
+    }),
     assets: [],
     ...overrides
   }

src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.test.ts

@@ -1,7 +1,8 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
-import type { SharedWorkflowPayload } from '@/platform/workflow/sharing/types/shareTypes'
 import { useSharedWorkflowUrlLoader } from '@/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader'
+import type { SharedWorkflowPayload } from '@/platform/workflow/sharing/types/shareTypes'
 
 const preservedQueryMocks = vi.hoisted(() => ({
   clearPreservedQuery: vi.fn(),
@@ -107,9 +108,9 @@ function makePayload(
     name: 'Test Workflow',
     listed: true,
     publishedAt: new Date('2026-02-20T00:00:00Z'),
-    workflowJson: {
+    workflowJson: fromPartial<SharedWorkflowPayload['workflowJson']>({
       nodes: []
-    } as unknown as SharedWorkflowPayload['workflowJson'],
+    }),
     assets: [],
     ...overrides
   }

src/platform/workflow/validation/schemas/workflowSchema.test.ts

@@ -1,3 +1,4 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import fs from 'fs'
 import { describe, expect, it } from 'vitest'
 
@@ -295,29 +296,33 @@ describe('flattenWorkflowNodes', () => {
   })
 
   it('includes subgraph nodes with prefixed IDs', () => {
-    const result = flattenWorkflowNodes({
-      nodes: [node(5, 'def-A')],
-      definitions: {
-        subgraphs: [
-          subgraphDef('def-A', [node(10, 'Inner'), node(20, 'Inner2')])
-        ]
-      }
-    } as unknown as ComfyWorkflowJSON)
+    const result = flattenWorkflowNodes(
+      fromPartial<ComfyWorkflowJSON>({
+        nodes: [node(5, 'def-A')],
+        definitions: {
+          subgraphs: [
+            subgraphDef('def-A', [node(10, 'Inner'), node(20, 'Inner2')])
+          ]
+        }
+      })
+    )
 
     expect(result).toHaveLength(3) // 1 root + 2 subgraph
     expect(result.map((n) => n.id)).toEqual([5, '5:10', '5:20'])
   })
 
   it('prefixes nested subgraph nodes with full execution path', () => {
-    const result = flattenWorkflowNodes({
-      nodes: [node(5, 'def-A')],
-      definitions: {
-        subgraphs: [
-          subgraphDef('def-A', [node(10, 'def-B')]),
-          subgraphDef('def-B', [node(3, 'Leaf')])
-        ]
-      }
-    } as unknown as ComfyWorkflowJSON)
+    const result = flattenWorkflowNodes(
+      fromPartial<ComfyWorkflowJSON>({
+        nodes: [node(5, 'def-A')],
+        definitions: {
+          subgraphs: [
+            subgraphDef('def-A', [node(10, 'def-B')]),
+            subgraphDef('def-B', [node(3, 'Leaf')])
+          ]
+        }
+      })
+    )
 
     // root:5, def-A inner: 5:10, def-B inner: 5:10:3
     expect(result.map((n) => n.id)).toEqual([5, '5:10', '5:10:3'])

src/platform/workspace/composables/useCreateWorkspaceUrlLoader.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { useCreateWorkspaceUrlLoader } from './useCreateWorkspaceUrlLoader'
@@ -119,7 +120,7 @@ describe('useCreateWorkspaceUrlLoader', () => {
 
     it('ignores non-string param', async () => {
       mockRouteQuery.value = {
-        create_workspace: ['array'] as unknown as string
+        create_workspace: fromAny<string, unknown>(['array'])
       }
 
       const { loadCreateWorkspaceFromUrl } = useCreateWorkspaceUrlLoader()

src/platform/workspace/composables/useInviteUrlLoader.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { useInviteUrlLoader } from './useInviteUrlLoader'
@@ -224,7 +225,9 @@ describe('useInviteUrlLoader', () => {
     })
 
     it('ignores non-string invite param', async () => {
-      mockRouteQuery.value = { invite: ['array', 'value'] as unknown as string }
+      mockRouteQuery.value = {
+        invite: fromAny<string, unknown>(['array', 'value'])
+      }
 
       const { loadInviteFromUrl } = useInviteUrlLoader()
       await loadInviteFromUrl()

src/platform/workspace/stores/workspaceAuthStore.ts

@@ -343,10 +343,6 @@ export const useWorkspaceAuthStore = defineStore('workspaceAuth', () => {
     }
   }
 
-  function getWorkspaceToken(): string | undefined {
-    return workspaceToken.value ?? undefined
-  }
-
   function clearWorkspaceContext(): void {
     // Increment request ID to invalidate any in-flight stale refresh operations
     refreshRequestId++
@@ -374,7 +370,6 @@ export const useWorkspaceAuthStore = defineStore('workspaceAuth', () => {
     switchWorkspace,
     refreshToken,
     getWorkspaceAuthHeader,
-    getWorkspaceToken,
     clearWorkspaceContext
   }
 })

src/renderer/core/canvas/useAutoPan.test.ts

@@ -1,7 +1,7 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { DragAndScale } from '@/lib/litegraph/src/DragAndScale'
-
 import {
   AutoPanController,
   calculateEdgePanSpeed
@@ -74,7 +74,7 @@ describe('AutoPanController', () => {
   beforeEach(() => {
     vi.useFakeTimers()
 
-    mockCanvas = {
+    mockCanvas = fromPartial<HTMLCanvasElement>({
       getBoundingClientRect: () => ({
         left: 0,
         top: 0,
@@ -86,12 +86,9 @@ describe('AutoPanController', () => {
         y: 0,
         toJSON: () => {}
       })
-    } as unknown as HTMLCanvasElement
+    })
 
-    mockDs = {
-      offset: [0, 0],
-      scale: 1
-    } as unknown as DragAndScale
+    mockDs = fromPartial<DragAndScale>({ offset: [0, 0], scale: 1 })
 
     onPanMock = vi.fn<(dx: number, dy: number) => void>()
     controller = new AutoPanController({

src/renderer/extensions/linearMode/flattenNodeOutput.test.ts

@@ -1,3 +1,4 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { describe, expect, it } from 'vitest'
 
 import { flattenNodeOutput } from '@/renderer/extensions/linearMode/flattenNodeOutput'
@@ -84,10 +85,12 @@ describe(flattenNodeOutput, () => {
   })
 
   it('flattens non-standard output keys with ResultItem-like values', () => {
-    const output = makeOutput({
-      a_images: [{ filename: 'before.png', subfolder: '', type: 'output' }],
-      b_images: [{ filename: 'after.png', subfolder: '', type: 'output' }]
-    } as unknown as Partial<NodeExecutionOutput>)
+    const output = makeOutput(
+      fromPartial<NodeExecutionOutput>({
+        a_images: [{ filename: 'before.png', subfolder: '', type: 'output' }],
+        b_images: [{ filename: 'after.png', subfolder: '', type: 'output' }]
+      })
+    )
 
     const result = flattenNodeOutput(['10', output])
 
@@ -109,10 +112,10 @@ describe(flattenNodeOutput, () => {
   })
 
   it('excludes non-ResultItem array items', () => {
-    const output = {
+    const output = fromPartial<NodeExecutionOutput>({
       images: [{ filename: 'img.png', subfolder: '', type: 'output' }],
       custom_data: [{ randomKey: 123 }]
-    } as unknown as NodeExecutionOutput
+    })
 
     const result = flattenNodeOutput(['1', output])
 
@@ -121,12 +124,12 @@ describe(flattenNodeOutput, () => {
   })
 
   it('accepts items with filename but no subfolder', () => {
-    const output = {
+    const output = fromPartial<NodeExecutionOutput>({
       images: [
         { filename: 'valid.png', subfolder: '', type: 'output' },
         { filename: 'no-subfolder.png' }
       ]
-    } as unknown as NodeExecutionOutput
+    })
 
     const result = flattenNodeOutput(['1', output])
 
@@ -137,12 +140,12 @@ describe(flattenNodeOutput, () => {
   })
 
   it('excludes items missing filename', () => {
-    const output = {
+    const output = fromPartial<NodeExecutionOutput>({
       images: [
         { filename: 'valid.png', subfolder: '', type: 'output' },
         { subfolder: '', type: 'output' }
       ]
-    } as unknown as NodeExecutionOutput
+    })
 
     const result = flattenNodeOutput(['1', output])
 

src/renderer/extensions/vueNodes/components/NodeWidgets.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { mount } from '@vue/test-utils'
 import { setActivePinia } from 'pinia'
 import { nextTick } from 'vue'
@@ -8,11 +9,10 @@ import type {
   SafeWidgetData,
   VueNodeData
 } from '@/composables/graph/useGraphNodeManager'
+import NodeWidgets from '@/renderer/extensions/vueNodes/components/NodeWidgets.vue'
 import { usePromotionStore } from '@/stores/promotionStore'
 import { useWidgetValueStore } from '@/stores/widgetValueStore'
 
-import NodeWidgets from '@/renderer/extensions/vueNodes/components/NodeWidgets.vue'
-
 vi.mock('@/renderer/core/canvas/canvasStore', () => ({
   useCanvasStore: () => ({
     canvas: {
@@ -79,8 +79,8 @@ describe('NodeWidgets', () => {
   }
 
   const getBorderStyles = (wrapper: ReturnType<typeof mount>) =>
-    (
-      wrapper.vm as unknown as { processedWidgets: unknown[] }
+    fromAny<{ processedWidgets: unknown[] }, unknown>(
+      wrapper.vm
     ).processedWidgets.map(
       (entry) =>
         (

src/renderer/extensions/vueNodes/composables/useSlotElementTracking.test.ts

@@ -19,11 +19,27 @@ import {
 } from './useSlotElementTracking'
 
 const mockGraph = vi.hoisted(() => ({ _nodes: [] as unknown[] }))
+const mockCanvasState = vi.hoisted(() => ({
+  canvas: {} as object | null
+}))
+const mockClientPosToCanvasPos = vi.hoisted(() =>
+  vi.fn(([x, y]: [number, number]) => [x * 0.5, y * 0.5] as [number, number])
+)
 
 vi.mock('@/scripts/app', () => ({
   app: { canvas: { graph: mockGraph, setDirty: vi.fn() } }
 }))
 
+vi.mock('@/renderer/core/canvas/canvasStore', () => ({
+  useCanvasStore: () => mockCanvasState
+}))
+
+vi.mock('@/composables/element/useCanvasPositionConversion', () => ({
+  useSharedCanvasPositionConversion: () => ({
+    clientPosToCanvasPos: mockClientPosToCanvasPos
+  })
+}))
+
 const NODE_ID = 'test-node'
 const SLOT_INDEX = 0
 
@@ -45,9 +61,10 @@ function createWrapperComponent(type: 'input' | 'output') {
   })
 }
 
-function createSlotElement(): HTMLElement {
+function createSlotElement(collapsed = false): HTMLElement {
   const container = document.createElement('div')
   container.dataset.nodeId = NODE_ID
+  if (collapsed) container.dataset.collapsed = ''
   container.getBoundingClientRect = () =>
     ({
       left: 0,
@@ -113,6 +130,8 @@ describe('useSlotElementTracking', () => {
       actor: 'test'
     })
     mockGraph._nodes = [{ id: 1 }]
+    mockCanvasState.canvas = {}
+    mockClientPosToCanvasPos.mockClear()
   })
 
   it.each([
@@ -251,4 +270,57 @@ describe('useSlotElementTracking', () => {
 
     expect(batchUpdateSpy).not.toHaveBeenCalled()
   })
+
+  describe('collapsed node slot sync', () => {
+    function registerCollapsedSlot() {
+      const slotKey = getSlotKey(NODE_ID, SLOT_INDEX, true)
+      const slotEl = createSlotElement(true)
+
+      const registryStore = useNodeSlotRegistryStore()
+      const node = registryStore.ensureNode(NODE_ID)
+      node.slots.set(slotKey, {
+        el: slotEl,
+        index: SLOT_INDEX,
+        type: 'input',
+        cachedOffset: { x: 50, y: 60 }
+      })
+
+      return { slotKey, node }
+    }
+
+    it('uses clientPosToCanvasPos for collapsed nodes', () => {
+      const { slotKey } = registerCollapsedSlot()
+
+      syncNodeSlotLayoutsFromDOM(NODE_ID)
+
+      // Slot element center: (10 + 10/2, 30 + 10/2) = (15, 35)
+      const screenCenter: [number, number] = [15, 35]
+      expect(mockClientPosToCanvasPos).toHaveBeenCalledWith(screenCenter)
+
+      // Mock returns x*0.5, y*0.5
+      const layout = layoutStore.getSlotLayout(slotKey)
+      expect(layout).not.toBeNull()
+      expect(layout!.position.x).toBe(screenCenter[0] * 0.5)
+      expect(layout!.position.y).toBe(screenCenter[1] * 0.5)
+    })
+
+    it('clears cachedOffset for collapsed nodes', () => {
+      const { slotKey, node } = registerCollapsedSlot()
+      const entry = node.slots.get(slotKey)!
+      expect(entry.cachedOffset).toBeDefined()
+
+      syncNodeSlotLayoutsFromDOM(NODE_ID)
+
+      expect(entry.cachedOffset).toBeUndefined()
+    })
+
+    it('defers sync when canvas is not initialized', () => {
+      mockCanvasState.canvas = null
+      registerCollapsedSlot()
+
+      syncNodeSlotLayoutsFromDOM(NODE_ID)
+
+      expect(mockClientPosToCanvasPos).not.toHaveBeenCalled()
+    })
+  })
 })

src/renderer/extensions/vueNodes/composables/useSlotElementTracking.ts

@@ -8,7 +8,9 @@
 import { onMounted, onUnmounted, watch } from 'vue'
 import type { Ref } from 'vue'
 
+import { useSharedCanvasPositionConversion } from '@/composables/element/useCanvasPositionConversion'
 import { LiteGraph } from '@/lib/litegraph/src/litegraph'
+import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { getSlotKey } from '@/renderer/core/layout/slots/slotIdentifier'
 import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
 import { app } from '@/scripts/app'
@@ -134,11 +136,26 @@ export function syncNodeSlotLayoutsFromDOM(nodeId: string) {
     .value?.el.closest('[data-node-id]')
   const nodeEl = closestNode instanceof HTMLElement ? closestNode : null
   const nodeRect = nodeEl?.getBoundingClientRect()
+
+  // Collapsed nodes preserve expanded size in layoutStore, so DOM-relative
+  // scale derivation breaks. Fall back to clientPosToCanvasPos instead.
+  const isCollapsed = nodeEl?.dataset.collapsed != null
   const effectiveScale =
-    nodeRect && nodeLayout.size.width > 0
+    !isCollapsed && nodeRect && nodeLayout.size.width > 0
       ? nodeRect.width / nodeLayout.size.width
       : 0
 
+  const canvasStore = useCanvasStore()
+  const conv =
+    isCollapsed && canvasStore.canvas
+      ? useSharedCanvasPositionConversion()
+      : null
+
+  if (isCollapsed && !conv) {
+    scheduleSlotLayoutSync(nodeId)
+    return
+  }
+
   const batch: Array<{ key: string; layout: SlotLayout }> = []
 
   for (const [slotKey, entry] of node.slots) {
@@ -155,22 +172,30 @@ export function syncNodeSlotLayoutsFromDOM(nodeId: string) {
       rect.top + rect.height / 2
     ]
 
-    if (!nodeRect || effectiveScale <= 0) continue
+    let centerCanvas: { x: number; y: number }
 
-    // DOM-relative measurement: compute offset from the node element's
-    // top-left corner in canvas units. The node element is rendered at
-    // (position.x, position.y - NODE_TITLE_HEIGHT), so the Y offset
-    // must subtract NODE_TITLE_HEIGHT to be relative to position.y.
-    entry.cachedOffset = {
-      x: (screenCenter[0] - nodeRect.left) / effectiveScale,
-      y:
-        (screenCenter[1] - nodeRect.top) / effectiveScale -
-        LiteGraph.NODE_TITLE_HEIGHT
-    }
+    if (conv) {
+      const [cx, cy] = conv.clientPosToCanvasPos(screenCenter)
+      centerCanvas = { x: cx, y: cy }
+      entry.cachedOffset = undefined
+    } else {
+      if (!nodeRect || effectiveScale <= 0) continue
 
-    const centerCanvas = {
-      x: nodeLayout.position.x + entry.cachedOffset.x,
-      y: nodeLayout.position.y + entry.cachedOffset.y
+      // DOM-relative measurement: compute offset from the node element's
+      // top-left corner in canvas units. The node element is rendered at
+      // (position.x, position.y - NODE_TITLE_HEIGHT), so the Y offset
+      // must subtract NODE_TITLE_HEIGHT to be relative to position.y.
+      entry.cachedOffset = {
+        x: (screenCenter[0] - nodeRect.left) / effectiveScale,
+        y:
+          (screenCenter[1] - nodeRect.top) / effectiveScale -
+          LiteGraph.NODE_TITLE_HEIGHT
+      }
+
+      centerCanvas = {
+        x: nodeLayout.position.x + entry.cachedOffset.x,
+        y: nodeLayout.position.y + entry.cachedOffset.y
+      }
     }
 
     const nextLayout = createSlotLayout({

src/renderer/extensions/vueNodes/composables/useSlotLinkInteraction.autoPan.test.ts

@@ -1,4 +1,5 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { fromPartial } from '@total-typescript/shoehorn'
 
 const {
   capturedOnPan,
@@ -205,7 +206,7 @@ function pointerEvent(
   clientY: number,
   pointerId = 1
 ): PointerEvent {
-  return {
+  return fromPartial<PointerEvent>({
     clientX,
     clientY,
     button: 0,
@@ -217,7 +218,7 @@ function pointerEvent(
     target: document.createElement('div'),
     preventDefault: vi.fn(),
     stopPropagation: vi.fn()
-  } as unknown as PointerEvent
+  })
 }
 
 function startDrag() {

src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.ts

@@ -15,8 +15,8 @@ import { useDocumentVisibility } from '@vueuse/core'
 
 import { useSharedCanvasPositionConversion } from '@/composables/element/useCanvasPositionConversion'
 import { LiteGraph } from '@/lib/litegraph/src/litegraph'
-import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
 import type { Bounds, NodeId } from '@/renderer/core/layout/types'
 import { LayoutSource } from '@/renderer/core/layout/types'
 import {

src/renderer/extensions/vueNodes/layout/ensureCorrectLayoutScale.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraph, LGraphExtra } from '@/lib/litegraph/src/LGraph'
@@ -35,7 +36,7 @@ function createMockGraph(
 ): Partial<LGraph> {
   const graph: Partial<LGraph> = {
     id: crypto.randomUUID(),
-    nodes: nodes as unknown as LGraph['nodes'],
+    nodes: fromAny<LGraph['nodes'], unknown>(nodes),
     groups: [],
     reroutes: new Map() as LGraph['reroutes'],
     extra

src/renderer/extensions/vueNodes/layout/useNodeDrag.test.ts

@@ -1,12 +1,20 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { ref } from 'vue'
 import type { Ref } from 'vue'
+
 import type { NodeLayout } from '@/renderer/core/layout/types'
 
+// TODO: Simplify test setup — use real layoutStore + createTestingPinia instead
+// of manually mocking every dependency. See https://github.com/Comfy-Org/ComfyUI_frontend/issues/10765
 const testState = vi.hoisted(() => {
+  // Imports are unavailable inside vi.hoisted() so shoehorn's fromAny cannot
+  // be used here. This local identity function serves the same purpose
+  // (runtime no-op cast) until the test is rewritten to use real stores.
+  const placeholder = <T>(v: unknown): T => v as T
   return {
-    selectedNodeIds: null as unknown as Ref<Set<string>>,
-    selectedItems: null as unknown as Ref<unknown[]>,
+    selectedNodeIds: placeholder<Ref<Set<string>>>(null),
+    selectedItems: placeholder<Ref<unknown[]>>(null),
     nodeLayouts: new Map<string, Pick<NodeLayout, 'position' | 'size'>>(),
     mutationFns: {
       setSource: vi.fn(),
@@ -114,12 +122,7 @@ function pointerEvent(clientX: number, clientY: number): PointerEvent {
   const target = document.createElement('div')
   target.hasPointerCapture = vi.fn(() => false)
   target.setPointerCapture = vi.fn()
-  return {
-    clientX,
-    clientY,
-    target,
-    pointerId: 1
-  } as unknown as PointerEvent
+  return fromPartial<PointerEvent>({ clientX, clientY, target, pointerId: 1 })
 }
 
 describe('useNodeDrag', () => {

src/renderer/extensions/vueNodes/widgets/components/DisplayCarousel.test.ts

@@ -1,11 +1,11 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { mount } from '@vue/test-utils'
 import { describe, expect, it, vi } from 'vitest'
 import { nextTick, ref } from 'vue'
 import { createI18n } from 'vue-i18n'
 
 import type { SimplifiedWidget } from '@/types/simplifiedWidget'
-
 import DisplayCarousel from './DisplayCarousel.vue'
 import type { GalleryImage, GalleryValue } from './DisplayCarousel.vue'
 import { createMockWidget } from './widgetTestUtils'
@@ -124,7 +124,10 @@ describe('DisplayCarousel Single Mode', () => {
 
     it('handles null value gracefully', () => {
       const widget = createGalleriaWidget([])
-      const wrapper = mountComponent(widget, null as unknown as GalleryValue)
+      const wrapper = mountComponent(
+        widget,
+        fromAny<GalleryValue, unknown>(null)
+      )
 
       expect(wrapper.find('img').exists()).toBe(false)
     })
@@ -133,7 +136,7 @@ describe('DisplayCarousel Single Mode', () => {
       const widget = createGalleriaWidget([])
       const wrapper = mountComponent(
         widget,
-        undefined as unknown as GalleryValue
+        fromAny<GalleryValue, unknown>(undefined)
       )
 
       expect(wrapper.find('img').exists()).toBe(false)
@@ -338,7 +341,7 @@ describe('DisplayCarousel Grid Mode', () => {
     )
   })
 
-  it('switches back to single mode via toggle button', async () => {
+  it('grid mode has no overlay icons', async () => {
     const wrapper = createGalleriaWrapper([...TEST_IMAGES_SMALL])
 
     // Switch to grid via focus on image container
@@ -347,19 +350,69 @@ describe('DisplayCarousel Grid Mode', () => {
     await wrapper.find('[aria-label="Switch to grid view"]').trigger('click')
     await nextTick()
 
-    // Focus the grid container to reveal toggle
+    // Grid mode should have no toggle/back button
+    expect(wrapper.find('[aria-label="Switch to single view"]').exists()).toBe(
+      false
+    )
+    expect(wrapper.find('[aria-label="Switch to grid view"]').exists()).toBe(
+      false
+    )
+  })
+
+  it('always uses undo-2 icon for grid toggle button', async () => {
+    const wrapper = createGalleriaWrapper([...TEST_IMAGES_SMALL])
+
+    // Show controls
     await findImageContainer(wrapper).trigger('focusin')
     await nextTick()
 
-    // Switch back to single
-    const singleToggle = wrapper.find('[aria-label="Switch to single view"]')
-    expect(singleToggle.exists()).toBe(true)
+    const toggleBtn = wrapper.find('[aria-label="Switch to grid view"]')
+    expect(toggleBtn.find('i').classes()).toContain('icon-[lucide--undo-2]')
 
-    await singleToggle.trigger('click')
+    // Switch to grid and back
+    await toggleBtn.trigger('click')
     await nextTick()
 
-    // Should be back in single mode with main image
-    expect(wrapper.find('[aria-label="Previous image"]').exists()).toBe(true)
+    const gridButtons = wrapper
+      .findAll('button')
+      .filter((btn) => btn.find('img').exists())
+    await gridButtons[0].trigger('click')
+    await nextTick()
+
+    await findImageContainer(wrapper).trigger('focusin')
+    await nextTick()
+
+    // Icon should still be undo-2
+    const toggleBtnAfter = wrapper.find('[aria-label="Switch to grid view"]')
+    expect(toggleBtnAfter.find('i').classes()).toContain(
+      'icon-[lucide--undo-2]'
+    )
+  })
+
+  it('shows grid button in single mode after selecting from grid', async () => {
+    const wrapper = createGalleriaWrapper([...TEST_IMAGES_SMALL])
+
+    // Switch to grid
+    await findImageContainer(wrapper).trigger('focusin')
+    await nextTick()
+    await wrapper.find('[aria-label="Switch to grid view"]').trigger('click')
+    await nextTick()
+
+    // Click first grid image to go back to single mode
+    const gridButtons = wrapper
+      .findAll('button')
+      .filter((btn) => btn.find('img').exists())
+    await gridButtons[0].trigger('click')
+    await nextTick()
+
+    // Hover to reveal controls
+    await findImageContainer(wrapper).trigger('focusin')
+    await nextTick()
+
+    // Should still show grid view button (same icon always)
+    expect(wrapper.find('[aria-label="Switch to grid view"]').exists()).toBe(
+      true
+    )
   })
 
   it('clicking grid image switches to single mode focused on that image', async () => {
@@ -401,8 +454,8 @@ describe('DisplayCarousel Grid Mode', () => {
     await wrapper.setProps({ modelValue: [TEST_IMAGES_SMALL[0]] })
     await nextTick()
 
-    // Should revert to single mode (no grid toggle visible)
-    expect(wrapper.find('[aria-label="Switch to single view"]').exists()).toBe(
+    // Should revert to single mode (single image, no grid button)
+    expect(wrapper.find('[aria-label="Switch to grid view"]').exists()).toBe(
       false
     )
   })

src/renderer/extensions/vueNodes/widgets/components/DisplayCarousel.vue

@@ -36,7 +36,7 @@
             :aria-label="t('g.switchToGridView')"
             @click="switchToGrid"
           >
-            <i class="icon-[lucide--layout-grid] size-4" />
+            <i class="icon-[lucide--undo-2] size-4" />
           </button>
 
           <!-- Action Buttons (hover, top-right) -->
@@ -142,41 +142,19 @@
           ref="gridContainerEl"
           class="relative h-72 overflow-x-hidden overflow-y-auto rounded-sm bg-component-node-background"
           tabindex="0"
-          @mouseenter="isHovered = true"
-          @mouseleave="isHovered = false"
-          @focusin="isFocused = true"
-          @focusout="handleFocusOut"
         >
-          <!-- Toggle to Single (hover, top-left) -->
-          <button
-            v-if="showControls"
-            :class="toggleButtonClass"
-            class="absolute top-2 left-2 z-10"
-            :aria-label="t('g.switchToSingleView')"
-            @click="switchToSingle"
-          >
-            <i class="icon-[lucide--square] size-4" />
-          </button>
-
           <div class="flex flex-wrap content-start gap-1">
             <button
               v-for="(item, index) in galleryImages"
               :key="getItemSrc(item)"
               class="size-14 shrink-0 cursor-pointer overflow-hidden border-0 p-0"
               :aria-label="getItemAlt(item, index)"
-              @mouseenter="hoveredGridIndex = index"
-              @mouseleave="hoveredGridIndex = -1"
               @click="selectFromGrid(index)"
             >
               <img
                 :src="getItemThumbnail(item)"
                 :alt="getItemAlt(item, index)"
-                :class="
-                  cn(
-                    'size-full object-cover transition-opacity',
-                    hoveredGridIndex === index && 'opacity-50'
-                  )
-                "
+                class="size-full object-cover"
               />
             </button>
           </div>
@@ -229,7 +207,6 @@ const activeIndex = ref(0)
 const displayMode = ref<DisplayMode>('single')
 const isHovered = ref(false)
 const isFocused = ref(false)
-const hoveredGridIndex = ref(-1)
 const imageDimensions = ref<string | null>(null)
 const thumbnailRefs = ref<(HTMLElement | null)[]>([])
 const imageContainerEl = ref<HTMLDivElement>()
@@ -359,11 +336,6 @@ function switchToGrid() {
   displayMode.value = 'grid'
 }
 
-function switchToSingle() {
-  isHovered.value = false
-  displayMode.value = 'single'
-}
-
 function selectFromGrid(index: number) {
   activeIndex.value = index
   imageDimensions.value = null

src/renderer/extensions/vueNodes/widgets/components/WidgetSelectDropdown.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { mount } from '@vue/test-utils'
 import type { VueWrapper } from '@vue/test-utils'
 import PrimeVue from 'primevue/config'
@@ -9,10 +10,9 @@ import { createI18n } from 'vue-i18n'
 
 import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
 import type { FormDropdownItem } from '@/renderer/extensions/vueNodes/widgets/components/form/dropdown/types'
+import WidgetSelectDropdown from '@/renderer/extensions/vueNodes/widgets/components/WidgetSelectDropdown.vue'
 import type { ComboInputSpec } from '@/schemas/nodeDef/nodeDefSchemaV2'
 import type { SimplifiedWidget } from '@/types/simplifiedWidget'
-
-import WidgetSelectDropdown from '@/renderer/extensions/vueNodes/widgets/components/WidgetSelectDropdown.vue'
 import { createMockWidget } from './widgetTestUtils'
 
 const mockCheckState = vi.hoisted(() => vi.fn())
@@ -121,18 +121,20 @@ describe('WidgetSelectDropdown custom label mapping', () => {
     modelValue: string | undefined,
     assetKind: 'image' | 'video' | 'audio' = 'image'
   ): VueWrapper<WidgetSelectDropdownInstance> => {
-    return mount(WidgetSelectDropdown, {
-      props: {
-        widget,
-        modelValue,
-        assetKind,
-        allowUpload: true,
-        uploadFolder: 'input'
-      },
-      global: {
-        plugins: [PrimeVue, createTestingPinia(), i18n]
-      }
-    }) as unknown as VueWrapper<WidgetSelectDropdownInstance>
+    return fromAny<VueWrapper<WidgetSelectDropdownInstance>, unknown>(
+      mount(WidgetSelectDropdown, {
+        props: {
+          widget,
+          modelValue,
+          assetKind,
+          allowUpload: true,
+          uploadFolder: 'input'
+        },
+        global: {
+          plugins: [PrimeVue, createTestingPinia(), i18n]
+        }
+      })
+    )
   }
 
   describe('when custom labels are not provided', () => {
@@ -258,7 +260,7 @@ describe('WidgetSelectDropdown custom label mapping', () => {
     it('falls back to original value when label mapping returns undefined', () => {
       const getOptionLabel = vi.fn((value?: string | null) => {
         if (value === 'hash789.png') {
-          return undefined as unknown as string
+          return fromAny<string, unknown>(undefined)
         }
         return `Labeled: ${value}`
       })
@@ -365,7 +367,7 @@ describe('WidgetSelectDropdown custom label mapping', () => {
 
     it('does not create a fallback item when modelValue is undefined', () => {
       const widget = createSelectDropdownWidget(
-        undefined as unknown as string,
+        fromAny<string, unknown>(undefined),
         {
           values: ['img_001.png', 'photo_abc.jpg']
         }
@@ -415,18 +417,20 @@ describe('WidgetSelectDropdown cloud asset mode (COM-14333)', () => {
     widget: SimplifiedWidget<string | undefined>,
     modelValue: string | undefined
   ): VueWrapper<CloudModeInstance> => {
-    return mount(WidgetSelectDropdown, {
-      props: {
-        widget,
-        modelValue,
-        assetKind: 'model',
-        isAssetMode: true,
-        nodeType: 'CheckpointLoaderSimple'
-      },
-      global: {
-        plugins: [PrimeVue, createTestingPinia(), i18n]
-      }
-    }) as unknown as VueWrapper<CloudModeInstance>
+    return fromAny<VueWrapper<CloudModeInstance>, unknown>(
+      mount(WidgetSelectDropdown, {
+        props: {
+          widget,
+          modelValue,
+          assetKind: 'model',
+          isAssetMode: true,
+          nodeType: 'CheckpointLoaderSimple'
+        },
+        global: {
+          plugins: [PrimeVue, createTestingPinia(), i18n]
+        }
+      })
+    )
   }
 
   beforeEach(() => {
@@ -549,10 +553,12 @@ describe('WidgetSelectDropdown multi-output jobs', () => {
     widget: SimplifiedWidget<string | undefined>,
     modelValue: string | undefined
   ): VueWrapper<MultiOutputInstance> {
-    return mount(WidgetSelectDropdown, {
-      props: { widget, modelValue, assetKind: 'image' as const },
-      global: { plugins: [PrimeVue, createTestingPinia(), i18n] }
-    }) as unknown as VueWrapper<MultiOutputInstance>
+    return fromAny<VueWrapper<MultiOutputInstance>, unknown>(
+      mount(WidgetSelectDropdown, {
+        props: { widget, modelValue, assetKind: 'image' as const },
+        global: { plugins: [PrimeVue, createTestingPinia(), i18n] }
+      })
+    )
   }
 
   const defaultWidget = () =>
@@ -744,18 +750,20 @@ describe('WidgetSelectDropdown undo tracking', () => {
     widget: SimplifiedWidget<string | undefined>,
     modelValue: string | undefined
   ): VueWrapper<UndoTrackingInstance> => {
-    return mount(WidgetSelectDropdown, {
-      props: {
-        widget,
-        modelValue,
-        assetKind: 'image',
-        allowUpload: true,
-        uploadFolder: 'input'
-      },
-      global: {
-        plugins: [PrimeVue, createTestingPinia(), i18n]
-      }
-    }) as unknown as VueWrapper<UndoTrackingInstance>
+    return fromAny<VueWrapper<UndoTrackingInstance>, unknown>(
+      mount(WidgetSelectDropdown, {
+        props: {
+          widget,
+          modelValue,
+          assetKind: 'image',
+          allowUpload: true,
+          uploadFolder: 'input'
+        },
+        global: {
+          plugins: [PrimeVue, createTestingPinia(), i18n]
+        }
+      })
+    )
   }
 
   beforeEach(() => {

src/renderer/glsl/useGLSLPreview.test.ts

@@ -1,13 +1,17 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { createPinia, setActivePinia } from 'pinia'
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import { nextTick, reactive, ref, shallowRef } from 'vue'
+import type { MaybeRefOrGetter } from 'vue'
 
+import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
+import type { GLSLRendererConfig } from '@/renderer/glsl/useGLSLRenderer'
 import { useGLSLPreview } from '@/renderer/glsl/useGLSLPreview'
 import { useWidgetValueStore } from '@/stores/widgetValueStore'
 
-import type { GLSLRendererConfig } from '@/renderer/glsl/useGLSLRenderer'
-import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
-import type { MaybeRefOrGetter } from 'vue'
+type WidgetValueStoreStub = {
+  _widgetMap: Map<string, { value: unknown }>
+}
 
 const mockRendererFactory = vi.hoisted(() => {
   const init = vi.fn(() => true)
@@ -99,7 +103,7 @@ vi.mock('@/utils/objectUrlUtil', () => ({
 
 function createMockNode(overrides: Record<string, unknown> = {}): LGraphNode {
   const graph = { id: 'test-graph-id', rootGraph: { id: 'test-graph-id' } }
-  return {
+  return fromAny<LGraphNode, unknown>({
     id: 1,
     type: 'GLSLShader',
     inputs: [],
@@ -107,7 +111,7 @@ function createMockNode(overrides: Record<string, unknown> = {}): LGraphNode {
     getInputNode: vi.fn(() => null),
     isSubgraphNode: () => false,
     ...overrides
-  } as unknown as LGraphNode
+  })
 }
 
 function wrapNode(
@@ -177,9 +181,9 @@ describe('useGLSLPreview', () => {
       mockNodeOutputs[String(node.id)] = {
         images: [{ filename: 'test.png', subfolder: '', type: 'temp' }]
       }
-      const store = useWidgetValueStore() as unknown as {
-        _widgetMap: Map<string, { value: unknown }>
-      }
+      const store = fromAny<WidgetValueStoreStub, unknown>(
+        useWidgetValueStore()
+      )
       store._widgetMap.set('fragment_shader', {
         value: 'void main() {}'
       })
@@ -241,9 +245,9 @@ describe('useGLSLPreview', () => {
       mockNodeOutputs[String(node.id)] = {
         images: [{ filename: 'test.png', subfolder: '', type: 'temp' }]
       }
-      const store = useWidgetValueStore() as unknown as {
-        _widgetMap: Map<string, { value: unknown }>
-      }
+      const store = fromAny<WidgetValueStoreStub, unknown>(
+        useWidgetValueStore()
+      )
       store._widgetMap.set('fragment_shader', {
         value: 'void main() {}'
       })
@@ -299,9 +303,9 @@ describe('useGLSLPreview', () => {
     })
 
     it('skips render when shader source is unavailable', async () => {
-      const store = useWidgetValueStore() as unknown as {
-        _widgetMap: Map<string, { value: unknown }>
-      }
+      const store = fromAny<WidgetValueStoreStub, unknown>(
+        useWidgetValueStore()
+      )
       store._widgetMap.delete('fragment_shader')
 
       const node = createMockNode()

src/stores/__tests__/authTokenPriority.test.ts

@@ -1,211 +0,0 @@
-import type { User } from 'firebase/auth'
-import * as firebaseAuth from 'firebase/auth'
-import { setActivePinia } from 'pinia'
-import type { Mock } from 'vitest'
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-import * as vuefire from 'vuefire'
-
-import { useAuthStore } from '@/stores/authStore'
-import { createTestingPinia } from '@pinia/testing'
-
-const { mockFeatureFlags } = vi.hoisted(() => ({
-  mockFeatureFlags: {
-    teamWorkspacesEnabled: false
-  }
-}))
-
-const { mockDistributionTypes } = vi.hoisted(() => ({
-  mockDistributionTypes: {
-    isCloud: true,
-    isDesktop: true
-  }
-}))
-
-const mockWorkspaceAuthHeader = vi.fn().mockReturnValue(null)
-const mockGetWorkspaceToken = vi.fn().mockReturnValue(undefined)
-const mockClearWorkspaceContext = vi.fn()
-
-vi.mock('@/platform/workspace/stores/workspaceAuthStore', () => ({
-  useWorkspaceAuthStore: () => ({
-    getWorkspaceAuthHeader: mockWorkspaceAuthHeader,
-    getWorkspaceToken: mockGetWorkspaceToken,
-    clearWorkspaceContext: mockClearWorkspaceContext
-  })
-}))
-
-vi.mock('@/composables/useFeatureFlags', () => ({
-  useFeatureFlags: () => ({
-    flags: mockFeatureFlags
-  })
-}))
-
-vi.mock('vuefire', () => ({
-  useFirebaseAuth: vi.fn()
-}))
-
-vi.mock('vue-i18n', () => ({
-  useI18n: () => ({ t: (key: string) => key }),
-  createI18n: () => ({ global: { t: (key: string) => key } })
-}))
-
-vi.mock('firebase/auth', async (importOriginal) => {
-  const actual = await importOriginal<typeof firebaseAuth>()
-  return {
-    ...actual,
-    signInWithEmailAndPassword: vi.fn(),
-    createUserWithEmailAndPassword: vi.fn(),
-    signOut: vi.fn(),
-    onAuthStateChanged: vi.fn(),
-    onIdTokenChanged: vi.fn(),
-    signInWithPopup: vi.fn(),
-    GoogleAuthProvider: class {
-      addScope = vi.fn()
-      setCustomParameters = vi.fn()
-    },
-    GithubAuthProvider: class {
-      addScope = vi.fn()
-      setCustomParameters = vi.fn()
-    },
-    getAdditionalUserInfo: vi.fn(),
-    setPersistence: vi.fn().mockResolvedValue(undefined)
-  }
-})
-
-vi.mock('@/platform/telemetry', () => ({
-  useTelemetry: () => ({ trackAuth: vi.fn() })
-}))
-
-vi.mock('@/stores/toastStore', () => ({
-  useToastStore: () => ({ add: vi.fn() })
-}))
-
-vi.mock('@/services/dialogService')
-vi.mock('@/platform/distribution/types', () => mockDistributionTypes)
-
-const mockApiKeyGetAuthHeader = vi.fn().mockReturnValue(null)
-vi.mock('@/stores/apiKeyAuthStore', () => ({
-  useApiKeyAuthStore: () => ({
-    getAuthHeader: mockApiKeyGetAuthHeader,
-    getApiKey: vi.fn(),
-    currentUser: null,
-    isAuthenticated: false,
-    storeApiKey: vi.fn(),
-    clearStoredApiKey: vi.fn()
-  })
-}))
-
-type MockUser = Omit<User, 'getIdToken'> & { getIdToken: Mock }
-
-describe('auth token priority chain', () => {
-  let store: ReturnType<typeof useAuthStore>
-  let authStateCallback: (user: User | null) => void
-
-  const mockAuth: Record<string, unknown> = {}
-
-  const mockUser: MockUser = {
-    uid: 'test-user-id',
-    email: 'test@example.com',
-    getIdToken: vi.fn().mockResolvedValue('firebase-token')
-  } as Partial<User> as MockUser
-
-  beforeEach(() => {
-    vi.resetAllMocks()
-
-    mockFeatureFlags.teamWorkspacesEnabled = false
-    mockWorkspaceAuthHeader.mockReturnValue(null)
-    mockGetWorkspaceToken.mockReturnValue(undefined)
-    mockApiKeyGetAuthHeader.mockReturnValue(null)
-    mockUser.getIdToken.mockResolvedValue('firebase-token')
-
-    vi.mocked(vuefire.useFirebaseAuth).mockReturnValue(
-      mockAuth as unknown as ReturnType<typeof vuefire.useFirebaseAuth>
-    )
-
-    vi.mocked(firebaseAuth.onAuthStateChanged).mockImplementation(
-      (_, callback) => {
-        authStateCallback = callback as (user: User | null) => void
-        ;(callback as (user: User | null) => void)(mockUser)
-        return vi.fn()
-      }
-    )
-
-    setActivePinia(createTestingPinia({ stubActions: false }))
-    store = useAuthStore()
-  })
-
-  describe('getAuthHeader priority', () => {
-    it('returns workspace auth header when workspace is active and feature enabled', async () => {
-      mockFeatureFlags.teamWorkspacesEnabled = true
-      mockWorkspaceAuthHeader.mockReturnValue({
-        Authorization: 'Bearer workspace-token'
-      })
-
-      const header = await store.getAuthHeader()
-
-      expect(header).toEqual({
-        Authorization: 'Bearer workspace-token'
-      })
-    })
-
-    it('returns Firebase token when workspace is not active but user is authenticated', async () => {
-      mockFeatureFlags.teamWorkspacesEnabled = true
-      mockWorkspaceAuthHeader.mockReturnValue(null)
-
-      const header = await store.getAuthHeader()
-
-      expect(header).toEqual({
-        Authorization: 'Bearer firebase-token'
-      })
-    })
-
-    it('returns API key when neither workspace nor Firebase are available', async () => {
-      authStateCallback(null)
-      mockApiKeyGetAuthHeader.mockReturnValue({ 'X-API-KEY': 'test-key' })
-
-      const header = await store.getAuthHeader()
-
-      expect(header).toEqual({ 'X-API-KEY': 'test-key' })
-    })
-
-    it('returns null when no auth method is available', async () => {
-      authStateCallback(null)
-
-      const header = await store.getAuthHeader()
-
-      expect(header).toBeNull()
-    })
-
-    it('skips workspace header when team_workspaces feature is disabled', async () => {
-      mockFeatureFlags.teamWorkspacesEnabled = false
-      mockWorkspaceAuthHeader.mockReturnValue({
-        Authorization: 'Bearer workspace-token'
-      })
-
-      const header = await store.getAuthHeader()
-
-      expect(header).toEqual({
-        Authorization: 'Bearer firebase-token'
-      })
-    })
-  })
-
-  describe('getAuthToken priority', () => {
-    it('returns workspace token when workspace is active and feature enabled', async () => {
-      mockFeatureFlags.teamWorkspacesEnabled = true
-      mockGetWorkspaceToken.mockReturnValue('workspace-raw-token')
-
-      const token = await store.getAuthToken()
-
-      expect(token).toBe('workspace-raw-token')
-    })
-
-    it('returns Firebase token when workspace token is not available', async () => {
-      mockFeatureFlags.teamWorkspacesEnabled = true
-      mockGetWorkspaceToken.mockReturnValue(undefined)
-
-      const token = await store.getAuthToken()
-
-      expect(token).toBe('firebase-token')
-    })
-  })
-})

src/stores/appModeStore.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { nextTick } from 'vue'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
@@ -195,25 +196,27 @@ describe('appModeStore', () => {
       outputs: number[]
     ) {
       const workflow = createBuilderWorkflow('app')
-      workflow.changeTracker = createMockChangeTracker({
-        activeState: {
-          last_node_id: 0,
-          last_link_id: 0,
-          nodes: [],
-          links: [],
-          groups: [],
-          config: {},
-          version: 0.4,
-          extra: { linearData: { inputs, outputs } }
-        }
-      } as unknown as Partial<ChangeTracker>)
+      workflow.changeTracker = createMockChangeTracker(
+        fromPartial<Partial<ChangeTracker>>({
+          activeState: {
+            last_node_id: 0,
+            last_link_id: 0,
+            nodes: [],
+            links: [],
+            groups: [],
+            config: {},
+            version: 0.4,
+            extra: { linearData: { inputs, outputs } }
+          }
+        })
+      )
       return workflow
     }
 
     it('removes inputs referencing deleted nodes on load', async () => {
       const node1 = mockNode(1)
       mockResolveNode.mockImplementation((id) =>
-        id == 1 ? (node1 as unknown as LGraphNode) : undefined
+        id == 1 ? fromAny<LGraphNode, unknown>(node1) : undefined
       )
 
       store.loadSelections({
@@ -229,7 +232,7 @@ describe('appModeStore', () => {
     it('keeps inputs for existing nodes even if widget is missing', async () => {
       const node1 = mockNode(1)
       mockResolveNode.mockImplementation((id) =>
-        id == 1 ? (node1 as unknown as LGraphNode) : undefined
+        id == 1 ? fromAny<LGraphNode, unknown>(node1) : undefined
       )
 
       store.loadSelections({
@@ -248,7 +251,7 @@ describe('appModeStore', () => {
     it('removes outputs referencing deleted nodes on load', async () => {
       const node1 = mockNode(1)
       mockResolveNode.mockImplementation((id) =>
-        id == 1 ? (node1 as unknown as LGraphNode) : undefined
+        id == 1 ? fromAny<LGraphNode, unknown>(node1) : undefined
       )
 
       store.loadSelections({ outputs: [1, 99] })
@@ -271,7 +274,7 @@ describe('appModeStore', () => {
 
       // After graph configures, nodes become resolvable
       mockResolveNode.mockImplementation((id) =>
-        id == 1 ? (node1 as unknown as LGraphNode) : undefined
+        id == 1 ? fromAny<LGraphNode, unknown>(node1) : undefined
       )
       ;(app.rootGraph.events as EventTarget).dispatchEvent(
         new Event('configured')

src/stores/authStore.ts

@@ -22,10 +22,10 @@ import { useFirebaseAuth } from 'vuefire'
 
 import { getComfyApiBaseUrl } from '@/config/comfyApi'
 import { t } from '@/i18n'
+import { WORKSPACE_STORAGE_KEYS } from '@/platform/workspace/workspaceConstants'
 import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import { useDialogService } from '@/services/dialogService'
-import { useWorkspaceAuthStore } from '@/platform/workspace/stores/workspaceAuthStore'
 import { useApiKeyAuthStore } from '@/stores/apiKeyAuthStore'
 import type { AuthHeader } from '@/types/authTypes'
 import type { operations } from '@/types/comfyRegistryTypes'
@@ -110,7 +110,15 @@ export const useAuthStore = defineStore('auth', () => {
     isInitialized.value = true
     if (user === null) {
       lastTokenUserId.value = null
-      useWorkspaceAuthStore().clearWorkspaceContext()
+
+      // Clear workspace sessionStorage on logout to prevent stale tokens
+      try {
+        sessionStorage.removeItem(WORKSPACE_STORAGE_KEYS.CURRENT_WORKSPACE)
+        sessionStorage.removeItem(WORKSPACE_STORAGE_KEYS.TOKEN)
+        sessionStorage.removeItem(WORKSPACE_STORAGE_KEYS.EXPIRES_AT)
+      } catch {
+        // Ignore sessionStorage errors (e.g., in private browsing mode)
+      }
     }
 
     // Reset balance when auth state changes
@@ -167,8 +175,21 @@ export const useAuthStore = defineStore('auth', () => {
    */
   const getAuthHeader = async (): Promise<AuthHeader | null> => {
     if (flags.teamWorkspacesEnabled) {
-      const wsHeader = useWorkspaceAuthStore().getWorkspaceAuthHeader()
-      if (wsHeader) return wsHeader
+      const workspaceToken = sessionStorage.getItem(
+        WORKSPACE_STORAGE_KEYS.TOKEN
+      )
+      const expiresAt = sessionStorage.getItem(
+        WORKSPACE_STORAGE_KEYS.EXPIRES_AT
+      )
+
+      if (workspaceToken && expiresAt) {
+        const expiryTime = parseInt(expiresAt, 10)
+        if (Date.now() < expiryTime) {
+          return {
+            Authorization: `Bearer ${workspaceToken}`
+          }
+        }
+      }
     }
 
     const token = await getIdToken()
@@ -197,8 +218,19 @@ export const useAuthStore = defineStore('auth', () => {
    */
   const getAuthToken = async (): Promise<string | undefined> => {
     if (flags.teamWorkspacesEnabled) {
-      const wsToken = useWorkspaceAuthStore().getWorkspaceToken()
-      if (wsToken) return wsToken
+      const workspaceToken = sessionStorage.getItem(
+        WORKSPACE_STORAGE_KEYS.TOKEN
+      )
+      const expiresAt = sessionStorage.getItem(
+        WORKSPACE_STORAGE_KEYS.EXPIRES_AT
+      )
+
+      if (workspaceToken && expiresAt) {
+        const expiryTime = parseInt(expiresAt, 10)
+        if (Date.now() < expiryTime) {
+          return workspaceToken
+        }
+      }
     }
 
     return await getIdToken()

src/stores/executionErrorStore.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
@@ -391,9 +392,9 @@ describe('clearAllErrors', () => {
         class_type: 'Test'
       }
     }
-    missingNodesStore.setMissingNodeTypes([
-      { type: 'MissingNode', hint: '' }
-    ] as unknown as MissingNodeType[])
+    missingNodesStore.setMissingNodeTypes(
+      fromAny<MissingNodeType[], unknown>([{ type: 'MissingNode', hint: '' }])
+    )
     executionErrorStore.showErrorOverlay()
 
     executionErrorStore.clearAllErrors()

src/stores/nodeOutputStore.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromAny } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
@@ -31,11 +32,11 @@ vi.mock('@/scripts/app', () => ({
 }))
 
 const createMockNode = (overrides: Record<string, unknown> = {}): LGraphNode =>
-  ({
+  fromAny<LGraphNode, unknown>({
     id: 1,
     type: 'TestNode',
     ...overrides
-  }) as Partial<LGraphNode> as LGraphNode
+  })
 
 const createMockOutputs = (
   images?: ExecutedWsMessage['output']['images']
@@ -623,7 +624,7 @@ describe('nodeOutputStore setNodeOutputs (widget path)', () => {
   it('should return early for null node', () => {
     const store = useNodeOutputStore()
 
-    store.setNodeOutputs(null as unknown as LGraphNode, 'test.png')
+    store.setNodeOutputs(fromAny<LGraphNode, unknown>(null), 'test.png')
 
     expect(Object.keys(store.nodeOutputs)).toHaveLength(0)
   })

src/stores/queueStore.loadWorkflow.test.ts

@@ -1,4 +1,5 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
@@ -8,8 +9,8 @@ import type {
 } from '@/platform/remote/comfyui/jobs/jobTypes'
 import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
 import type { ComfyApp } from '@/scripts/app'
-import { TaskItemImpl } from '@/stores/queueStore'
 import * as jobOutputCache from '@/services/jobOutputCache'
+import { TaskItemImpl } from '@/stores/queueStore'
 
 vi.mock('@/services/extensionService', () => ({
   useExtensionService: vi.fn(() => ({
@@ -76,13 +77,13 @@ describe('TaskItemImpl.loadWorkflow - workflow fetching', () => {
     vi.clearAllMocks()
 
     mockFetchApi = vi.fn()
-    mockApp = {
+    mockApp = fromPartial<ComfyApp>({
       loadGraphData: vi.fn(),
       nodeOutputs: {},
       api: {
         fetchApi: mockFetchApi
       }
-    } as unknown as ComfyApp
+    })
   })
 
   it('should fetch workflow from API for history tasks', async () => {

src/stores/resultItemParsing.test.ts

@@ -1,3 +1,4 @@
+import { fromPartial } from '@total-typescript/shoehorn'
 import { describe, expect, it } from 'vitest'
 
 import type { NodeExecutionOutput } from '@/schemas/apiSchema'
@@ -108,10 +109,10 @@ describe(parseNodeOutput, () => {
   })
 
   it('excludes non-ResultItem array items', () => {
-    const output = {
+    const output = fromPartial<NodeExecutionOutput>({
       images: [{ filename: 'img.png', subfolder: '', type: 'output' }],
       custom_data: [{ randomKey: 123 }]
-    } as unknown as NodeExecutionOutput
+    })
 
     const result = parseNodeOutput('1', output)
 
@@ -120,12 +121,12 @@ describe(parseNodeOutput, () => {
   })
 
   it('accepts items with filename but no subfolder', () => {
-    const output = {
+    const output = fromPartial<NodeExecutionOutput>({
       images: [
         { filename: 'valid.png', subfolder: '', type: 'output' },
         { filename: 'no-subfolder.png' }
       ]
-    } as unknown as NodeExecutionOutput
+    })
 
     const result = parseNodeOutput('1', output)
 
@@ -136,12 +137,12 @@ describe(parseNodeOutput, () => {
   })
 
   it('excludes items missing filename', () => {
-    const output = {
+    const output = fromPartial<NodeExecutionOutput>({
       images: [
         { filename: 'valid.png', subfolder: '', type: 'output' },
         { subfolder: '', type: 'output' }
       ]
-    } as unknown as NodeExecutionOutput
+    })
 
     const result = parseNodeOutput('1', output)
 

src/stores/subgraphNavigationStore.test.ts

@@ -1,15 +1,15 @@
 import { createTestingPinia } from '@pinia/testing'
+import { fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { nextTick } from 'vue'
 
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
+import type { Subgraph } from '@/lib/litegraph/src/LGraph'
 import type { ComfyWorkflow } from '@/platform/workflow/management/stores/workflowStore'
+import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import { app } from '@/scripts/app'
 import { useSubgraphNavigationStore } from '@/stores/subgraphNavigationStore'
 
-import type { Subgraph } from '@/lib/litegraph/src/LGraph'
-
 type MockSubgraph = Pick<Subgraph, 'id' | 'rootGraph' | '_nodes' | 'nodes'>
 
 function createMockSubgraph(id: string, rootGraph = app.rootGraph): Subgraph {
@@ -20,7 +20,7 @@ function createMockSubgraph(id: string, rootGraph = app.rootGraph): Subgraph {
     nodes: []
   } satisfies MockSubgraph
 
-  return mockSubgraph as unknown as Subgraph
+  return fromPartial<Subgraph>(mockSubgraph)
 }
 
 vi.mock('@/scripts/app', () => {

src/stores/subgraphStore.test.ts

@@ -1,22 +1,21 @@
+import { createTestingPinia } from '@pinia/testing'
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
-import type { ComfyNodeDef as ComfyNodeDefV1 } from '@/schemas/nodeDefSchema'
-import type { GlobalSubgraphData } from '@/scripts/api'
-import type { ExportedSubgraph } from '@/lib/litegraph/src/types/serialisation'
-import { TemplateIncludeOnDistributionEnum } from '@/platform/workflow/templates/types/template'
-import { api } from '@/scripts/api'
-import { app as comfyApp } from '@/scripts/app'
-import { useNodeDefStore } from '@/stores/nodeDefStore'
-import { useSubgraphStore } from '@/stores/subgraphStore'
-
-import { useLitegraphService } from '@/services/litegraphService'
-
 import {
   createTestSubgraph,
   createTestSubgraphNode
 } from '@/lib/litegraph/src/subgraph/__fixtures__/subgraphHelpers'
-import { createTestingPinia } from '@pinia/testing'
+import type { ExportedSubgraph } from '@/lib/litegraph/src/types/serialisation'
+import { TemplateIncludeOnDistributionEnum } from '@/platform/workflow/templates/types/template'
+import type { ComfyNodeDef as ComfyNodeDefV1 } from '@/schemas/nodeDefSchema'
+import type { GlobalSubgraphData } from '@/scripts/api'
+import { api } from '@/scripts/api'
+import { app as comfyApp } from '@/scripts/app'
+import { useLitegraphService } from '@/services/litegraphService'
+import { useNodeDefStore } from '@/stores/nodeDefStore'
+import { useSubgraphStore } from '@/stores/subgraphStore'
 
 const mockDistributionTypes = vi.hoisted(() => ({
   isCloud: false,
@@ -108,12 +107,12 @@ describe('useSubgraphStore', () => {
     graph.add(subgraphNode)
     vi.mocked(comfyApp.canvas).selectedItems = new Set([subgraphNode])
     vi.mocked(comfyApp.canvas)._serializeItems = vi.fn(() => {
-      const serializedSubgraph = {
+      const serializedSubgraph = fromPartial<ExportedSubgraph>({
         ...subgraph.serialize(),
         links: [],
         groups: [],
         version: 1
-      } as Partial<ExportedSubgraph> as ExportedSubgraph
+      })
       return {
         nodes: [subgraphNode.serialize()],
         subgraphs: [serializedSubgraph]
@@ -264,7 +263,9 @@ describe('useSubgraphStore', () => {
         failing_blueprint: {
           name: 'Failing Blueprint',
           info: { node_pack: 'test_pack' },
-          data: Promise.reject(new Error('Network error')) as unknown as string
+          data: fromAny<string, unknown>(
+            Promise.reject(new Error('Network error'))
+          )
         }
       }
     )
@@ -389,12 +390,12 @@ describe('useSubgraphStore', () => {
 
       vi.mocked(comfyApp.canvas).selectedItems = new Set([subgraphNode])
       vi.mocked(comfyApp.canvas)._serializeItems = vi.fn(() => {
-        const serializedSubgraph = {
+        const serializedSubgraph = fromPartial<ExportedSubgraph>({
           ...subgraph.serialize(),
           links: [],
           groups: [],
           version: 1
-        } as Partial<ExportedSubgraph> as ExportedSubgraph
+        })
         return {
           nodes: [subgraphNode.serialize()],
           subgraphs: [serializedSubgraph]

src/utils/nodeDefUtil.test.ts

@@ -1,3 +1,4 @@
+import { fromAny } from '@total-typescript/shoehorn'
 import { describe, expect, it } from 'vitest'
 
 import type {
@@ -175,7 +176,10 @@ describe('nodeDefUtil', () => {
         const spec1: IntInputSpec = ['INT', { min: 0, max: 10 }]
         const spec2: ComboInputSpecV2 = ['COMBO', { options: ['A', 'B'] }]
 
-        const result = mergeInputSpec(spec1, spec2 as unknown as IntInputSpec)
+        const result = mergeInputSpec(
+          spec1,
+          fromAny<IntInputSpec, unknown>(spec2)
+        )
 
         expect(result).toBeNull()
       })

src/utils/widgetUtil.test.ts

@@ -1,10 +1,10 @@
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
 import type { INodeInputSlot } from '@/lib/litegraph/src/interfaces'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import type { InputSpec } from '@/schemas/nodeDef/nodeDefSchemaV2'
-
 import { getWidgetDefaultValue, renameWidget } from '@/utils/widgetUtil'
 
 vi.mock('@/core/graph/subgraph/resolvePromotedWidgetSource', () => ({
@@ -50,14 +50,14 @@ describe('getWidgetDefaultValue', () => {
 })
 
 function makeWidget(overrides: Record<string, unknown> = {}): IBaseWidget {
-  return {
+  return fromPartial<IBaseWidget>({
     name: 'myWidget',
     type: 'number',
     value: 0,
     label: undefined,
     options: {},
     ...overrides
-  } as unknown as IBaseWidget
+  })
 }
 
 function makeNode({
@@ -67,11 +67,11 @@ function makeNode({
   isSubgraph?: boolean
   inputs?: INodeInputSlot[]
 } = {}): LGraphNode {
-  return {
+  return fromAny<LGraphNode, unknown>({
     id: 1,
     inputs,
     isSubgraphNode: () => isSubgraph
-  } as unknown as LGraphNode
+  })
 }
 
 describe('renameWidget', () => {
@@ -131,11 +131,11 @@ describe('renameWidget', () => {
   it('updates _subgraphSlot.label when input has a subgraph slot', () => {
     const widget = makeWidget({ name: 'seed' })
     const subgraphSlot = { label: undefined as string | undefined }
-    const input = {
+    const input = fromAny<INodeInputSlot, unknown>({
       name: 'seed',
       widget: { name: 'seed' },
       _subgraphSlot: subgraphSlot
-    } as unknown as INodeInputSlot
+    })
     const node = makeNode({ inputs: [input] })
 
     renameWidget(widget, node, 'New Label')

src/workbench/extensions/manager/utils/graphHasMissingNodes.test.ts

@@ -1,3 +1,4 @@
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
 import { describe, expect, it } from 'vitest'
 
 import type {
@@ -5,12 +6,12 @@ import type {
   LGraphNode,
   Subgraph
 } from '@/lib/litegraph/src/litegraph'
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
 import {
   collectMissingNodes,
   graphHasMissingNodes
 } from '@/workbench/extensions/manager/utils/graphHasMissingNodes'
 import type { NodeDefLookup } from '@/workbench/extensions/manager/utils/graphHasMissingNodes'
-import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
 
 type NodeDefs = NodeDefLookup
 
@@ -18,23 +19,23 @@ let nodeIdCounter = 0
 const mockNodeDef = {} as ComfyNodeDefImpl
 
 const createGraph = (nodes: LGraphNode[] = []): LGraph => {
-  return { nodes } as Partial<LGraph> as LGraph
+  return fromPartial<LGraph>({ nodes })
 }
 
 const createSubgraph = (nodes: LGraphNode[]): Subgraph => {
-  return { nodes } as Partial<Subgraph> as Subgraph
+  return fromPartial<Subgraph>({ nodes })
 }
 
 const createNode = (
   type?: string,
   subgraphNodes?: LGraphNode[]
 ): LGraphNode => {
-  return {
+  return fromAny<LGraphNode, unknown>({
     id: nodeIdCounter++,
     type,
     isSubgraphNode: subgraphNodes ? () => true : undefined,
     subgraph: subgraphNodes ? createSubgraph(subgraphNodes) : undefined
-  } as unknown as LGraphNode
+  })
 }
 
 describe('graphHasMissingNodes', () => {