Merge branch 'main' into glary/widget-control-mode-e2e-tests

# Conflicts:
#	browser_tests/tests/subgraph/subgraphPromotion.spec.ts
#	tools/devtools/nodes/inputs.py

.oxlintrc.json

@@ -28,7 +28,6 @@
   ],
   "rules": {
     "no-async-promise-executor": "off",
-    "func-style": ["error", "declaration"],
     "no-console": [
       "error",
       {
@@ -125,12 +124,6 @@
         "no-console": "allow"
       }
     },
-    {
-      "files": ["src/lib/litegraph/**"],
-      "rules": {
-        "func-style": "off"
-      }
-    },
     {
       "files": ["browser_tests/**/*.ts"],
       "jsPlugins": ["eslint-plugin-playwright"],

.storybook/preview.ts

@@ -47,7 +47,7 @@ setup((app) => {
 })
 
 // Theme and dialog decorator
-export function withTheme(Story: StoryFn, context: StoryContext) {
+export const withTheme = (Story: StoryFn, context: StoryContext) => {
   const theme = context.globals.theme || 'light'
 
   // Apply theme class to document root

apps/desktop-ui/.storybook/preview.ts

@@ -40,7 +40,7 @@ setup((app) => {
   app.use(ToastService)
 })
 
-export function withTheme(Story: StoryFn, context: StoryContext) {
+export const withTheme = (Story: StoryFn, context: StoryContext) => {
   const theme = context.globals.theme || 'light'
   if (theme === 'dark') {
     document.documentElement.classList.add('dark-theme')

apps/desktop-ui/src/components/bottomPanel/tabs/terminal/BaseTerminal.vue

@@ -58,7 +58,7 @@ const tooltipText = computed(() => {
     : t('serverStart.copyAllTooltip')
 })
 
-async function handleCopy() {
+const handleCopy = async () => {
   const existingSelection = terminal.getSelection()
   const shouldSelectAll = !existingSelection
   if (shouldSelectAll) terminal.selectAll()
@@ -76,7 +76,7 @@ async function handleCopy() {
   }
 }
 
-function showContextMenu(event: MouseEvent) {
+const showContextMenu = (event: MouseEvent) => {
   event.preventDefault()
   electronAPI()?.showContextMenu({ type: 'text' })
 }

apps/desktop-ui/src/components/common/UrlInput.vue

@@ -44,9 +44,8 @@ const emit = defineEmits<{
 
 const validationState = ref<ValidationState>(ValidationState.IDLE)
 
-function cleanInput(value: string): string {
-  return value ? value.replace(/\s+/g, '') : ''
-}
+const cleanInput = (value: string): string =>
+  value ? value.replace(/\s+/g, '') : ''
 
 // Add internal value state
 const internalValue = ref(cleanInput(props.modelValue))
@@ -69,14 +68,14 @@ onMounted(async () => {
   await validateUrl(props.modelValue)
 })
 
-function handleInput(value: string | undefined) {
+const handleInput = (value: string | undefined) => {
   // Update internal value without emitting
   internalValue.value = cleanInput(value ?? '')
   // Reset validation state when user types
   validationState.value = ValidationState.IDLE
 }
 
-async function handleBlur() {
+const handleBlur = async () => {
   const input = cleanInput(internalValue.value)
 
   let normalizedUrl = input
@@ -92,7 +91,7 @@ async function handleBlur() {
 }
 
 // Default validation implementation
-async function defaultValidateUrl(url: string): Promise<boolean> {
+const defaultValidateUrl = async (url: string): Promise<boolean> => {
   if (!isValidUrl(url)) return false
   try {
     return await checkUrlReachable(url)
@@ -101,7 +100,7 @@ async function defaultValidateUrl(url: string): Promise<boolean> {
   }
 }
 
-async function validateUrl(value: string) {
+const validateUrl = async (value: string) => {
   if (validationState.value === ValidationState.LOADING) return
 
   const url = cleanInput(value)

apps/desktop-ui/src/components/install/DesktopSettingsConfiguration.vue

@@ -127,7 +127,7 @@ const showDialog = ref(false)
 const autoUpdate = defineModel<boolean>('autoUpdate', { required: true })
 const allowMetrics = defineModel<boolean>('allowMetrics', { required: true })
 
-function showMetricsInfo() {
+const showMetricsInfo = () => {
   showDialog.value = true
 }
 </script>

apps/desktop-ui/src/components/install/InstallLocationPicker.vue

@@ -182,12 +182,10 @@ function getTorchMirrorItem(device: TorchDeviceType): UVMirror {
 }
 
 const userIsInChina = ref(false)
-function useFallbackMirror(mirror: UVMirror) {
-  return {
-    ...mirror,
-    mirror: mirror.fallbackMirror
-  }
-}
+const useFallbackMirror = (mirror: UVMirror) => ({
+  ...mirror,
+  mirror: mirror.fallbackMirror
+})
 
 const mirrors = computed<[UVMirror, ModelRef<string>][]>(() =>
   (
@@ -214,7 +212,7 @@ onMounted(async () => {
   userIsInChina.value = await isInChina()
 })
 
-async function validatePath(path: string | undefined) {
+const validatePath = async (path: string | undefined) => {
   try {
     pathError.value = ''
     pathExists.value = false
@@ -248,7 +246,7 @@ async function validatePath(path: string | undefined) {
   }
 }
 
-async function browsePath() {
+const browsePath = async () => {
   try {
     const result = await electron.showDirectoryPicker()
     if (result) {
@@ -260,7 +258,7 @@ async function browsePath() {
   }
 }
 
-async function onFocus() {
+const onFocus = async () => {
   if (!inputTouched.value) {
     inputTouched.value = true
     return

apps/desktop-ui/src/components/install/MigrationPicker.vue

@@ -92,7 +92,7 @@ const isValidSource = computed(
   () => sourcePath.value !== '' && pathError.value === ''
 )
 
-async function validateSource(sourcePath: string | undefined) {
+const validateSource = async (sourcePath: string | undefined) => {
   if (!sourcePath) {
     pathError.value = ''
     return
@@ -109,7 +109,7 @@ async function validateSource(sourcePath: string | undefined) {
   }
 }
 
-async function browsePath() {
+const browsePath = async () => {
   try {
     const result = await electron.showDirectoryPicker()
     if (result) {

apps/desktop-ui/src/components/maintenance/TaskListItem.vue

@@ -82,7 +82,7 @@ const isExecuting = useMinLoadingDurationRef(reactiveExecuting, 250)
 // Popover
 const infoPopover = ref<InstanceType<typeof Popover> | null>(null)
 
-function toggle(event: Event) {
+const toggle = (event: Event) => {
   infoPopover.value?.toggle(event)
 }
 </script>

apps/desktop-ui/src/components/maintenance/TaskListPanel.vue

@@ -67,7 +67,7 @@ defineProps<{
   filter: MaintenanceFilter
 }>()
 
-async function executeTask(task: MaintenanceTask) {
+const executeTask = async (task: MaintenanceTask) => {
   let message: string | undefined
 
   try {
@@ -87,7 +87,7 @@ async function executeTask(task: MaintenanceTask) {
 }
 
 // Commands
-async function confirmButton(event: MouseEvent, task: MaintenanceTask) {
+const confirmButton = async (event: MouseEvent, task: MaintenanceTask) => {
   if (!task.requireConfirm) {
     await executeTask(task)
     return

apps/desktop-ui/src/components/maintenance/TerminalOutputDrawer.vue

@@ -34,10 +34,10 @@ const buffer = useTerminalBuffer()
 let xterm: Terminal | null = null
 
 // Created and destroyed with the Drawer - contents copied from hidden buffer
-function terminalCreated(
+const terminalCreated = (
   { terminal, useAutoSize }: ReturnType<typeof useTerminal>,
   root: Ref<HTMLElement | undefined>
-) {
+) => {
   xterm = terminal
   useAutoSize({ root, autoRows: true, autoCols: true })
   terminal.write(props.defaultMessage)
@@ -49,7 +49,7 @@ function terminalCreated(
   terminal.options.disableStdin = true
 }
 
-function terminalUnmounted() {
+const terminalUnmounted = () => {
   xterm = null
 }
 

apps/desktop-ui/src/composables/bottomPanelTabs/useTerminal.ts

@@ -55,14 +55,14 @@ export function useTerminal(element: Ref<HTMLElement | undefined>) {
       minRows?: number
       onResize?: () => void
     }) {
-      function ensureValidRows(rows: number | undefined): number {
+      const ensureValidRows = (rows: number | undefined): number => {
         if (rows == null || isNaN(rows)) {
           return (root.value?.clientHeight ?? 80) / 20
         }
         return rows
       }
 
-      function ensureValidCols(cols: number | undefined): number {
+      const ensureValidCols = (cols: number | undefined): number => {
         if (cols == null || isNaN(cols)) {
           // Sometimes this is NaN if so, estimate.
           return (root.value?.clientWidth ?? 80) / 8
@@ -70,7 +70,7 @@ export function useTerminal(element: Ref<HTMLElement | undefined>) {
         return cols
       }
 
-      function resize() {
+      const resize = () => {
         const dims = fitAddon.proposeDimensions()
         // Sometimes propose returns NaN, so we may need to estimate.
         terminal.resize(

apps/desktop-ui/src/composables/bottomPanelTabs/useTerminalBuffer.ts

@@ -6,17 +6,13 @@ export function useTerminalBuffer() {
   const serializeAddon = new SerializeAddon()
   const terminal = markRaw(new Terminal({ convertEol: true }))
 
-  function copyTo(destinationTerminal: Terminal) {
+  const copyTo = (destinationTerminal: Terminal) => {
     destinationTerminal.write(serializeAddon.serialize())
   }
 
-  function write(message: string) {
-    return terminal.write(message)
-  }
+  const write = (message: string) => terminal.write(message)
 
-  function serialize() {
-    return serializeAddon.serialize()
-  }
+  const serialize = () => serializeAddon.serialize()
 
   onMounted(() => {
     terminal.loadAddon(serializeAddon)

apps/desktop-ui/src/constants/desktopMaintenanceTasks.ts

@@ -5,7 +5,7 @@ import { electronAPI } from '@/utils/envUtil'
 
 const electron = electronAPI()
 
-function openUrl(url: string) {
+const openUrl = (url: string) => {
   window.open(url, '_blank')
   return true
 }

apps/desktop-ui/src/stores/maintenanceTaskStore.ts

@@ -124,15 +124,13 @@ export const useMaintenanceTaskStore = defineStore('maintenanceTask', () => {
    * @param task Task to get the matching state object for
    * @returns The state object for this task
    */
-  function getRunner(task: MaintenanceTask) {
-    return taskRunners.value.get(task.id)!
-  }
+  const getRunner = (task: MaintenanceTask) => taskRunners.value.get(task.id)!
 
   /**
    * Updates the task list with the latest validation state.
    * @param validationUpdate Update details passed in by electron
    */
-  function processUpdate(validationUpdate: InstallValidation) {
+  const processUpdate = (validationUpdate: InstallValidation) => {
     lastUpdate.value = validationUpdate
     const update = validationUpdate as IndexedUpdate
     isRefreshing.value = true
@@ -153,19 +151,19 @@ export const useMaintenanceTaskStore = defineStore('maintenanceTask', () => {
   }
 
   /** Clears the resolved status of tasks (when changing filters) */
-  function clearResolved() {
+  const clearResolved = () => {
     for (const task of tasks.value) {
       getRunner(task).resolved &&= false
     }
   }
 
   /** @todo Refreshes Electron tasks only. */
-  async function refreshDesktopTasks() {
+  const refreshDesktopTasks = async () => {
     isRefreshing.value = true
     await electron.Validation.validateInstallation(processUpdate)
   }
 
-  async function execute(task: MaintenanceTask) {
+  const execute = async (task: MaintenanceTask) => {
     const success = await getRunner(task).execute(task)
     if (success && task.isInstallationFix) {
       await refreshDesktopTasks()

apps/desktop-ui/src/utils/electronMirrorCheck.ts

@@ -7,7 +7,7 @@ import { electronAPI } from './envUtil'
  * @param mirror - The mirror to check.
  * @returns True if the mirror is reachable, false otherwise.
  */
-export async function checkMirrorReachable(mirror: string) {
+export const checkMirrorReachable = async (mirror: string) => {
   return (
     isValidUrl(mirror) && (await electronAPI().NetWork.canAccessUrl(mirror))
   )

apps/desktop-ui/src/views/DesktopDialogView.vue

@@ -36,7 +36,7 @@ import { electronAPI } from '@/utils/envUtil'
 const route = useRoute()
 const { id, title, message, buttons } = getDialog(route.params.dialogId)
 
-async function handleButtonClick(button: DialogAction) {
+const handleButtonClick = async (button: DialogAction) => {
   await electronAPI().Dialog.clickButton(button.returnValue)
 }
 </script>

apps/desktop-ui/src/views/DesktopUpdateView.vue

@@ -52,7 +52,7 @@ const electron = electronAPI()
 
 const terminalVisible = ref(false)
 
-function toggleConsoleDrawer() {
+const toggleConsoleDrawer = () => {
   terminalVisible.value = !terminalVisible.value
 }
 

apps/desktop-ui/src/views/DownloadGitView.vue

@@ -47,11 +47,11 @@ import { useRouter } from 'vue-router'
 
 import BaseViewTemplate from '@/views/templates/BaseViewTemplate.vue'
 
-function openGitDownloads() {
+const openGitDownloads = () => {
   window.open('https://git-scm.com/downloads/', '_blank')
 }
 
-async function skipGit() {
+const skipGit = async () => {
   console.warn('pushing')
   const router = useRouter()
   await router.push('install')

apps/desktop-ui/src/views/InstallView.stories.ts

@@ -8,8 +8,8 @@ import { createMemoryHistory, createRouter } from 'vue-router'
 import InstallView from './InstallView.vue'
 
 // Create a mock router for stories
-function createMockRouter() {
-  return createRouter({
+const createMockRouter = () =>
+  createRouter({
     history: createMemoryHistory(),
     routes: [
       { path: '/', component: { template: '<div>Home</div>' } },
@@ -23,7 +23,6 @@ function createMockRouter() {
       }
     ]
   })
-}
 
 const meta: Meta<typeof InstallView> = {
   title: 'Desktop/Views/InstallView',

apps/desktop-ui/src/views/InstallView.vue

@@ -90,7 +90,7 @@ const currentStep = ref('1')
 /** Forces each install step to be visited at least once. */
 const highestStep = ref(0)
 
-function handleStepChange(value: string | number) {
+const handleStepChange = (value: string | number) => {
   setHighestStep(value)
 
   electronAPI().Events.trackEvent('install_stepper_change', {
@@ -98,7 +98,7 @@ function handleStepChange(value: string | number) {
   })
 }
 
-function setHighestStep(value: string | number) {
+const setHighestStep = (value: string | number) => {
   const int = typeof value === 'number' ? value : parseInt(value, 10)
   if (!isNaN(int) && int > highestStep.value) highestStep.value = int
 }
@@ -123,7 +123,7 @@ const canProceed = computed(() => {
 })
 
 // Navigation methods
-function goToNextStep() {
+const goToNextStep = () => {
   const nextStep = (parseInt(currentStep.value) + 1).toString()
   currentStep.value = nextStep
   setHighestStep(nextStep)
@@ -132,7 +132,7 @@ function goToNextStep() {
   })
 }
 
-function goToPreviousStep() {
+const goToPreviousStep = () => {
   const prevStep = (parseInt(currentStep.value) - 1).toString()
   currentStep.value = prevStep
   electronAPI().Events.trackEvent('install_stepper_change', {
@@ -142,7 +142,7 @@ function goToPreviousStep() {
 
 const electron = electronAPI()
 const router = useRouter()
-async function install() {
+const install = async () => {
   if (!device.value) return
 
   const options: InstallOptions = {

apps/desktop-ui/src/views/MaintenanceView.stories.ts

@@ -35,14 +35,12 @@ const validationState: ValidationState = {
   upgradePackages: 'OK'
 }
 
-function createMockElectronAPI() {
+const createMockElectronAPI = () => {
   const logListeners: Array<(message: string) => void> = []
 
-  function getValidationUpdate() {
-    return {
-      ...validationState
-    }
-  }
+  const getValidationUpdate = () => ({
+    ...validationState
+  })
 
   return {
     getPlatform: () => 'darwin',
@@ -78,7 +76,7 @@ function createMockElectronAPI() {
   }
 }
 
-function ensureElectronAPI() {
+const ensureElectronAPI = () => {
   const globalWindow = window as { electronAPI?: unknown }
   if (!globalWindow.electronAPI) {
     globalWindow.electronAPI = createMockElectronAPI()

apps/desktop-ui/src/views/MaintenanceView.vue

@@ -183,7 +183,7 @@ const unsafeReasonText = computed(() => {
 })
 
 /** If valid, leave the validation window. */
-async function completeValidation() {
+const completeValidation = async () => {
   const isValid = await electron.Validation.complete()
   if (!isValid) {
     toast.add({
@@ -194,7 +194,7 @@ async function completeValidation() {
   }
 }
 
-function toggleConsoleDrawer() {
+const toggleConsoleDrawer = () => {
   terminalVisible.value = !terminalVisible.value
 }
 

apps/desktop-ui/src/views/ManualConfigurationView.vue

@@ -67,9 +67,7 @@ const electron = electronAPI()
 const basePath = ref<string | null>(null)
 const sep = ref<'\\' | '/'>('/')
 
-function restartApp(message?: string) {
-  return electron.restartApp(message)
-}
+const restartApp = (message?: string) => electron.restartApp(message)
 
 onMounted(async () => {
   basePath.value = await electron.getBasePath()

apps/desktop-ui/src/views/MetricsConsentView.vue

@@ -64,7 +64,7 @@ const allowMetrics = ref(true)
 const router = useRouter()
 const isUpdating = ref(false)
 
-async function updateConsent() {
+const updateConsent = async () => {
   isUpdating.value = true
   try {
     await electronAPI().setMetricsConsent(allowMetrics.value)

apps/desktop-ui/src/views/NotSupportedView.vue

@@ -61,19 +61,19 @@ import { useRouter } from 'vue-router'
 
 import BaseViewTemplate from '@/views/templates/BaseViewTemplate.vue'
 
-function openDocs() {
+const openDocs = () => {
   window.open(
     'https://github.com/Comfy-Org/desktop#currently-supported-platforms',
     '_blank'
   )
 }
 
-function reportIssue() {
+const reportIssue = () => {
   window.open('https://forum.comfy.org/c/v1-feedback/', '_blank')
 }
 
 const router = useRouter()
-async function continueToInstall() {
+const continueToInstall = async () => {
   await router.push('/install')
 }
 </script>

apps/desktop-ui/src/views/ServerStartView.vue

@@ -118,7 +118,7 @@ let xterm: Terminal | undefined
 /**
  * Handles installation stage updates from the desktop
  */
-function updateInstallStage(stageInfo: InstallStageInfo) {
+const updateInstallStage = (stageInfo: InstallStageInfo) => {
   console.warn('[InstallStage.onUpdate] Received:', {
     stage: stageInfo.stage,
     progress: stageInfo.progress,
@@ -183,17 +183,17 @@ const displayStatusText = computed(() => {
   return currentStatusLabel.value
 })
 
-function updateProgress({ status: newStatus }: { status: ProgressStatus }) {
+const updateProgress = ({ status: newStatus }: { status: ProgressStatus }) => {
   status.value = newStatus
 
   // Make critical error screen more obvious.
   if (newStatus === ProgressStatus.ERROR) terminalVisible.value = false
 }
 
-function terminalCreated(
+const terminalCreated = (
   { terminal, useAutoSize }: ReturnType<typeof useTerminal>,
   root: Ref<HTMLElement | undefined>
-) {
+) => {
   xterm = terminal
 
   useAutoSize({ root, autoRows: true, autoCols: true })
@@ -206,15 +206,11 @@ function terminalCreated(
   terminal.options.cursorInactiveStyle = 'block'
 }
 
-function troubleshoot() {
-  return electron.startTroubleshooting()
-}
-function reportIssue() {
+const troubleshoot = () => electron.startTroubleshooting()
+const reportIssue = () => {
   window.open('https://forum.comfy.org/c/v1-feedback/', '_blank')
 }
-function openLogs() {
-  return electron.openLogsFolder()
-}
+const openLogs = () => electron.openLogsFolder()
 
 let cleanupInstallStageListener: (() => void) | undefined
 

apps/desktop-ui/src/views/WelcomeView.vue

@@ -33,7 +33,7 @@ import { useRouter } from 'vue-router'
 import BaseViewTemplate from '@/views/templates/BaseViewTemplate.vue'
 
 const router = useRouter()
-async function navigateTo(path: string) {
+const navigateTo = async (path: string) => {
   await router.push(path)
 }
 </script>

apps/website/e2e/demos.spec.ts

@@ -3,9 +3,8 @@ import { expect, test } from '@playwright/test'
 import { demos, getNextDemo } from '../src/config/demos'
 import { t } from '../src/i18n/translations'
 
-function escapeRegExp(value: string): string {
-  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
-}
+const escapeRegExp = (value: string): string =>
+  value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
 
 test.describe('Demo pages @smoke', () => {
   for (const demo of demos) {

apps/website/e2e/responsive.spec.ts

@@ -111,7 +111,7 @@ async function measureMarqueeLoopGeometry(
         `Animation on ${sel} has unusable duration: ${String(duration)}`
       )
     }
-    function setAllTimes(time: number) {
+    const setAllTimes = (time: number) => {
       for (const track of tracks) {
         for (const anim of track.getAnimations()) {
           anim.currentTime = time
@@ -119,9 +119,7 @@ async function measureMarqueeLoopGeometry(
       }
       void document.body.offsetWidth
     }
-    function readX() {
-      return tracks.map((track) => track.getBoundingClientRect().x)
-    }
+    const readX = () => tracks.map((track) => track.getBoundingClientRect().x)
     setAllTimes(0)
     const startPositions = readX()
     const copyWidths = tracks.map(

apps/website/src/components/careers/RolesSection.vue

@@ -36,9 +36,7 @@ let pendingFrame = 0
 const HEADER_OFFSET = -144
 const ACTIVATION_OFFSET = 300
 
-function deptElementId(key: string) {
-  return `careers-dept-${key}`
-}
+const deptElementId = (key: string) => `careers-dept-${key}`
 
 function pickActiveSection() {
   pendingFrame = 0

apps/website/src/components/product/local/HeroSection.vue

@@ -58,7 +58,7 @@ onMounted(() => {
   })
 
   raw.sort((a, b) => {
-    function norm(v: number) {
+    const norm = (v: number) => {
       const r = v + Math.PI / 2
       return r < 0 ? r + 2 * Math.PI : r
     }
@@ -117,7 +117,7 @@ onMounted(() => {
     applyToPanel(panels[1], elapsed2)
     applyToPanel(panels[2], elapsed3)
 
-    function wOf(elapsed: number) {
+    const wOf = (elapsed: number) => {
       const progress = elapsed < PANEL_DURATION ? elapsed / PANEL_DURATION : 1
       return lerp(S.w, E.w, ease(progress))
     }

apps/website/src/composables/useParallax.ts

@@ -35,7 +35,7 @@ export function useParallax(
 
     const triggerEl = options.trigger?.value
 
-    function createAnimations() {
+    const createAnimations = () => {
       const els = elements
         .map((r) => r.value)
         .filter((el): el is HTMLElement => !!el && el.offsetParent !== null)

apps/website/src/composables/usePinScrub.ts

@@ -29,7 +29,7 @@ function interpolateY(
   contentH: number,
   vpH: number
 ) {
-  function clampedTarget(i: number) {
+  const clampedTarget = (i: number) => {
     const center = buttonCenters[i] ?? 0
     return Math.max(-(contentH - vpH), Math.min(0, vpH / 2 - center))
   }

apps/website/src/pages/cloud/supported-nodes/[pack].astro

@@ -1,4 +1,5 @@
 ---
+import type { GetStaticPaths } from 'astro'
 
 import type { Pack } from '../../../data/cloudNodes'
 
@@ -8,7 +9,7 @@ import { t } from '../../../i18n/translations'
 import { loadPacksForBuild } from '../../../utils/cloudNodes.build'
 import { escapeJsonLd } from '../../../utils/escapeJsonLd'
 
-export async function getStaticPaths() {
+export const getStaticPaths: GetStaticPaths = async () => {
   const packs = await loadPacksForBuild()
   return packs.map((pack) => ({
     params: { pack: pack.id },

apps/website/src/pages/customers/[slug].astro

@@ -1,4 +1,5 @@
 ---
+import type { GetStaticPaths } from 'astro'
 import BaseLayout from '../../layouts/BaseLayout.astro'
 import DetailHeroSection from '../../components/customers/DetailHeroSection.vue'
 import ContentSection from '../../components/common/ContentSection.vue'
@@ -6,7 +7,7 @@ import WhatsNextSection from '../../components/customers/WhatsNextSection.vue'
 import { customerStories, getNextStory, getStoryBySlug } from '../../config/customerStories'
 import { t } from '../../i18n/translations'
 
-export function getStaticPaths() {
+export const getStaticPaths: GetStaticPaths = () => {
   return customerStories.map((story) => ({
     params: { slug: story.slug }
   }))

apps/website/src/pages/demos/[slug].astro

@@ -1,4 +1,5 @@
 ---
+import type { GetStaticPaths } from 'astro'
 import BaseLayout from '../../layouts/BaseLayout.astro'
 import DemoHeroSection from '../../components/demos/DemoHeroSection.vue'
 import ArcadeEmbed from '../../components/demos/ArcadeEmbed.vue'
@@ -7,7 +8,7 @@ import DemoNavSection from '../../components/demos/DemoNavSection.vue'
 import { demos, getDemoBySlug, getNextDemo } from '../../config/demos'
 import { t } from '../../i18n/translations'
 
-export function getStaticPaths() {
+export const getStaticPaths: GetStaticPaths = () => {
   return demos.map((demo) => ({
     params: { slug: demo.slug }
   }))

apps/website/src/pages/p/supported-models/[slug].astro

@@ -1,10 +1,11 @@
 ---
+import type { GetStaticPaths } from 'astro'
 import BaseLayout from '../../../layouts/BaseLayout.astro'
 import ModelHeroSection from '../../../components/models/ModelHeroSection.vue'
 import { models, getModelBySlug } from '../../../config/models'
 import { t } from '../../../i18n/translations'
 
-export function getStaticPaths() {
+export const getStaticPaths: GetStaticPaths = () => {
   return models.map((model) => ({
     params: { slug: model.slug }
   }))

apps/website/src/pages/zh-CN/cloud/supported-nodes/[pack].astro

@@ -1,4 +1,5 @@
 ---
+import type { GetStaticPaths } from 'astro'
 
 import type { Pack } from '../../../../data/cloudNodes'
 
@@ -8,7 +9,7 @@ import { t } from '../../../../i18n/translations'
 import { loadPacksForBuild } from '../../../../utils/cloudNodes.build'
 import { escapeJsonLd } from '../../../../utils/escapeJsonLd'
 
-export async function getStaticPaths() {
+export const getStaticPaths: GetStaticPaths = async () => {
   const packs = await loadPacksForBuild()
   return packs.map((pack) => ({
     params: { pack: pack.id },

apps/website/src/pages/zh-CN/customers/[slug].astro

@@ -1,4 +1,5 @@
 ---
+import type { GetStaticPaths } from 'astro'
 import BaseLayout from '../../../layouts/BaseLayout.astro'
 import DetailHeroSection from '../../../components/customers/DetailHeroSection.vue'
 import ContentSection from '../../../components/common/ContentSection.vue'
@@ -6,7 +7,7 @@ import WhatsNextSection from '../../../components/customers/WhatsNextSection.vue
 import { customerStories, getNextStory, getStoryBySlug } from '../../../config/customerStories'
 import { t } from '../../../i18n/translations'
 
-export function getStaticPaths() {
+export const getStaticPaths: GetStaticPaths = () => {
   return customerStories.map((story) => ({
     params: { slug: story.slug }
   }))

apps/website/src/pages/zh-CN/demos/[slug].astro

@@ -1,4 +1,5 @@
 ---
+import type { GetStaticPaths } from 'astro'
 import BaseLayout from '../../../layouts/BaseLayout.astro'
 import DemoHeroSection from '../../../components/demos/DemoHeroSection.vue'
 import ArcadeEmbed from '../../../components/demos/ArcadeEmbed.vue'
@@ -7,7 +8,7 @@ import DemoNavSection from '../../../components/demos/DemoNavSection.vue'
 import { demos, getDemoBySlug, getNextDemo } from '../../../config/demos'
 import { t } from '../../../i18n/translations'
 
-export function getStaticPaths() {
+export const getStaticPaths: GetStaticPaths = () => {
   return demos.map((demo) => ({
     params: { slug: demo.slug }
   }))

apps/website/src/scripts/snakeGame.ts

@@ -35,9 +35,8 @@ const TICK_MS = 200
 
 function readColors() {
   const style = getComputedStyle(document.documentElement)
-  function get(name: string, fallback: string): string {
-    return style.getPropertyValue(name).trim() || fallback
-  }
+  const get = (name: string, fallback: string): string =>
+    style.getPropertyValue(name).trim() || fallback
 
   return {
     bg: get('--color-primary-comfy-ink', '#211927'),
@@ -60,12 +59,9 @@ function requireElement<T extends Element>(
   return el
 }
 
-function isSVGSVG(el: Element): el is SVGSVGElement {
-  return el instanceof SVGSVGElement
-}
-function isSVGG(el: Element): el is SVGGElement {
-  return el instanceof SVGGElement
-}
+const isSVGSVG = (el: Element): el is SVGSVGElement =>
+  el instanceof SVGSVGElement
+const isSVGG = (el: Element): el is SVGGElement => el instanceof SVGGElement
 function isSVGText(el: Element): el is SVGTextElement {
   return el instanceof SVGTextElement
 }
@@ -131,9 +127,8 @@ function depth(cell: Cell): number {
 
 function roundedPath(pts: [number, number][], radius: number): string {
   const n = pts.length
-  function fmt(p: readonly [number, number]) {
-    return `${p[0].toFixed(2)},${p[1].toFixed(2)}`
-  }
+  const fmt = (p: readonly [number, number]) =>
+    `${p[0].toFixed(2)},${p[1].toFixed(2)}`
   let d = ''
   for (let i = 0; i < n; i++) {
     const prev = pts[(i - 1 + n) % n]
@@ -211,7 +206,7 @@ function triggerExplosion() {
   const cx = ((COLS - ROWS) * STEP_X) / 2
   const cy = ((COLS + ROWS - 2) * STEP_Y) / 2
 
-  function launchParticle(i: number, j: number, fill: string): Particle {
+  const launchParticle = (i: number, j: number, fill: string): Particle => {
     const [sx, sy] = iso(i, j)
     const baseAngle = Math.atan2(sy - cy, sx - cx)
     const angle = baseAngle + (Math.random() - 0.5) * 1.2
@@ -244,9 +239,7 @@ function triggerExplosion() {
 const DROP_DURATION_MS = 450
 const DROP_HEIGHT = 600
 let foodDropStart = 0
-function easeOutCubic(t: number) {
-  return 1 - Math.pow(1 - t, 3)
-}
+const easeOutCubic = (t: number) => 1 - Math.pow(1 - t, 3)
 
 function foodDropOffset(now = performance.now()): number {
   if (!foodDropStart) return 0
@@ -259,7 +252,7 @@ function foodDropOffset(now = performance.now()): number {
 const REBIRTH_STAGGER_MS = 90
 const REBIRTH_GROW_MS = 260
 let rebirthStart = 0
-function easeOutBack(t: number) {
+const easeOutBack = (t: number) => {
   const c1 = 1.70158
   const c3 = c1 + 1
   return 1 + c3 * Math.pow(t - 1, 3) + c1 * Math.pow(t - 1, 2)
@@ -278,9 +271,7 @@ function rebirthScaleFor(idx: number, now = performance.now()): number {
 const CHOMP_DURATION_MS = 220
 const CHOMP_PEAK_SCALE = 1.15
 let chompStart = 0
-function easeOut(t: number) {
-  return 1 - (1 - t) * (1 - t)
-}
+const easeOut = (t: number) => 1 - (1 - t) * (1 - t)
 
 function chompScale(now = performance.now()): number {
   if (!chompStart) return 1
@@ -308,7 +299,7 @@ function isAnimating(): boolean {
 
 function ensureAnimationLoop() {
   if (animationHandle !== null) return
-  function tick() {
+  const tick = () => {
     if (
       explodeStart &&
       performance.now() - explodeStart >= EXPLODE_DURATION_MS
@@ -420,12 +411,8 @@ function updateScoreDisplay() {
   scoreBestEl.textContent = String(best)
 }
 
-function cellsEqual(a: Cell, b: Cell) {
-  return a.i === b.i && a.j === b.j
-}
-function inBounds(c: Cell) {
-  return c.i >= 0 && c.j >= 0 && c.i < COLS && c.j < ROWS
-}
+const cellsEqual = (a: Cell, b: Cell) => a.i === b.i && a.j === b.j
+const inBounds = (c: Cell) => c.i >= 0 && c.j >= 0 && c.i < COLS && c.j < ROWS
 
 function reset() {
   const j0 = Math.floor(ROWS / 2)

browser_tests/assets/widgets/combo_control_widget.json

@@ -0,0 +1,31 @@
+{
+  "last_node_id": 1,
+  "last_link_id": 0,
+  "nodes": [
+    {
+      "id": 1,
+      "type": "DevToolsNodeWithComboControlWidget",
+      "pos": [20, 50],
+      "size": [400, 200],
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [],
+      "properties": {
+        "Node name for S&R": "DevToolsNodeWithComboControlWidget"
+      },
+      "widgets_values": ["Option A", "fixed", ""]
+    }
+  ],
+  "links": [],
+  "groups": [],
+  "config": {},
+  "extra": {
+    "ds": {
+      "scale": 1,
+      "offset": [0, 0]
+    }
+  },
+  "version": 0.4
+}

browser_tests/fixtures/helpers/AssetHelper.ts

@@ -158,7 +158,7 @@ export class AssetHelper {
     statusCode: number,
     error: string = 'Internal Server Error'
   ): Promise<void> {
-    async function handler(route: Route) {
+    const handler = async (route: Route) => {
       return route.fulfill({
         status: statusCode,
         json: { error }

browser_tests/fixtures/helpers/AssetsHelper.ts

@@ -325,7 +325,7 @@ export class AssetsHelper {
       await this.page.unroute(pattern, existingHandler)
     }
 
-    async function handler(route: Route) {
+    const handler = async (route: Route) => {
       await route.fulfill({
         status: 200,
         contentType: 'application/json',

browser_tests/fixtures/helpers/NodeReplacementHelper.ts

@@ -42,7 +42,7 @@ export async function setupNodeReplacement(
       options?: AddEventListenerOptions | boolean
     ) {
       if (type === 'message' && typeof listener === 'function') {
-        function wrapped(this: WebSocket, event: Event) {
+        const wrapped = function (this: WebSocket, event: Event) {
           const msgEvent = event as MessageEvent
           if (typeof msgEvent.data === 'string') {
             try {

browser_tests/fixtures/helpers/SubgraphHelper.ts

@@ -498,6 +498,25 @@ export class SubgraphHelper {
     await this.comfyPage.contextMenu.waitForHidden()
   }
 
+  async getInnerControlWidgetLabels(): Promise<string[]> {
+    return this.page.evaluate(() => {
+      const graph = window.app!.canvas.graph!
+      const subgraphNode = graph.nodes.find(
+        (n: { isSubgraphNode?: () => boolean }) =>
+          typeof n.isSubgraphNode === 'function' && n.isSubgraphNode()
+      ) as { subgraph?: Subgraph } | undefined
+      if (!subgraphNode?.subgraph) return []
+      const innerNodes = Array.from(subgraphNode.subgraph.nodes.values())
+      return innerNodes.flatMap((n: { widgets?: Array<{ label?: string }> }) =>
+        (n.widgets ?? [])
+          .filter((w: { label?: string }) =>
+            (w.label ?? '').includes('control')
+          )
+          .map((w: { label?: string }) => w.label!)
+      )
+    })
+  }
+
   async findSubgraphNodeId(): Promise<string> {
     const id = await this.page.evaluate(() => {
       const graph = window.app!.canvas.graph!
@@ -618,7 +637,7 @@ export class SubgraphHelper {
     ]
   ): { warnings: string[]; dispose: () => void } {
     const warnings: string[] = []
-    function handler(msg: ConsoleMessage) {
+    const handler = (msg: ConsoleMessage) => {
       const text = msg.text()
       if (patterns.some((p) => text.includes(p))) {
         warnings.push(text)

browser_tests/fixtures/helpers/TemplateHelper.ts

@@ -150,7 +150,7 @@ export class TemplateHelper {
   }
 
   async mockThumbnails(): Promise<void> {
-    async function thumbnailHandler(route: Route) {
+    const thumbnailHandler = async (route: Route) => {
       await route.fulfill({
         status: 200,
         path: 'browser_tests/assets/example.webp',

browser_tests/fixtures/sharedWorkflowImportFixture.ts

@@ -130,12 +130,10 @@ export const sharedWorkflowImportFixture = base.extend<{
 async function mockSharedWorkflowImportFlow(
   page: Page
 ): Promise<SharedWorkflowImportMocks> {
-  function noopResolveResponse() {}
   let isRecording = false
   let importEndpointCalled = false
   let importBody: ImportPublishedAssetsRequest | undefined
-  let resolvePublicInclusiveInputAssetResponseAfterImport: () => void =
-    noopResolveResponse
+  let resolvePublicInclusiveInputAssetResponseAfterImport: () => void = () => {}
   let publicInclusiveInputAssetResponseAfterImport = new Promise<void>(
     (resolve) => {
       resolvePublicInclusiveInputAssetResponseAfterImport = resolve

browser_tests/fixtures/utils/litegraphUtils.ts

@@ -7,7 +7,7 @@ import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import type { Position, Size } from '@e2e/fixtures/types'
 import { VueNodeFixture } from '@e2e/fixtures/utils/vueNodeFixtures'
 
-export function getMiddlePoint(pos1: Position, pos2: Position) {
+export const getMiddlePoint = (pos1: Position, pos2: Position) => {
   return {
     x: (pos1.x + pos2.x) / 2,
     y: (pos1.y + pos2.y) / 2

browser_tests/tests/actionbar.spec.ts

@@ -45,7 +45,7 @@ test.describe('Actionbar', { tag: '@ui' }, () => {
     const requestPromise = comfyPage.page.waitForResponse('**/api/prompt')
 
     // Find and set the width on the latent node
-    async function triggerChange(value: number) {
+    const triggerChange = async (value: number) => {
       return await comfyPage.page.evaluate((value) => {
         const node = window.app!.graph!._nodes.find(
           (n) => n.type === 'EmptyLatentImage'
@@ -59,7 +59,7 @@ test.describe('Actionbar', { tag: '@ui' }, () => {
     }
 
     // Trigger a status websocket message
-    function triggerStatus(queueSize: number) {
+    const triggerStatus = (queueSize: number) => {
       ws.send(
         JSON.stringify({
           type: 'status',
@@ -75,7 +75,7 @@ test.describe('Actionbar', { tag: '@ui' }, () => {
     }
 
     // Extract the width from the queue response
-    async function getQueuedWidth(resp: Promise<Response>) {
+    const getQueuedWidth = async (resp: Promise<Response>) => {
       const obj = await (await resp).json()
       return obj['__request']['prompt']['5']['inputs']['width']
     }

browser_tests/tests/canvasLayoutSettings.spec.ts

@@ -5,18 +5,16 @@ import {
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import type { Size } from '@e2e/fixtures/types'
 
-function expectedGroupSize(
+const expectedGroupSize = (
   nodeBounds: Size,
   padding: number,
   titleHeight: number
-): Size {
-  return {
-    width: nodeBounds.width + padding * 2,
-    // Group height adds one title row above the contained node bounds (which
-    // themselves already include the node's own title), independent of padding.
-    height: nodeBounds.height + padding * 2 + titleHeight
-  }
-}
+): Size => ({
+  width: nodeBounds.width + padding * 2,
+  // Group height adds one title row above the contained node bounds (which
+  // themselves already include the node's own title), independent of padding.
+  height: nodeBounds.height + padding * 2 + titleHeight
+})
 
 test.describe('Canvas layout settings', { tag: '@canvas' }, () => {
   test.describe('Comfy.SnapToGrid.GridSize', () => {
@@ -26,7 +24,7 @@ test.describe('Canvas layout settings', { tag: '@canvas' }, () => {
       await comfyPage.nodeOps.clearGraph()
     })
 
-    async function createNode(comfyPage: ComfyPage) {
+    const createNode = async (comfyPage: ComfyPage) => {
       const note = await comfyPage.nodeOps.addNode('Note', undefined, {
         x: 0,
         y: 0
@@ -81,10 +79,10 @@ test.describe('Canvas layout settings', { tag: '@canvas' }, () => {
       await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
     })
 
-    async function groupAroundAllNodesWithPadding(
+    const groupAroundAllNodesWithPadding = async (
       comfyPage: ComfyPage,
       padding: number
-    ): Promise<Size> {
+    ): Promise<Size> => {
       await comfyPage.settings.setSetting(
         'Comfy.GroupSelectedNodes.Padding',
         padding
@@ -128,16 +126,15 @@ test.describe('Canvas layout settings', { tag: '@canvas' }, () => {
 
   test.describe('LiteGraph.ContextMenu.Scaling', () => {
     const ZOOM_SCALE = 2
-    function litegraphContextMenu(comfyPage: ComfyPage) {
-      return comfyPage.page.locator('.litecontextmenu')
-    }
+    const litegraphContextMenu = (comfyPage: ComfyPage) =>
+      comfyPage.page.locator('.litecontextmenu')
 
     test.beforeEach(async ({ comfyPage }) => {
       await comfyPage.workflow.loadWorkflow('widgets/load_image_widget')
       await comfyPage.canvasOps.setScale(ZOOM_SCALE)
     })
 
-    async function openComboMenu(comfyPage: ComfyPage) {
+    const openComboMenu = async (comfyPage: ComfyPage) => {
       const loadImage = (
         await comfyPage.nodeOps.getNodeRefsByType('LoadImage')
       )[0]

browser_tests/tests/canvasModeSelector.spec.ts

@@ -3,14 +3,12 @@ import { expect } from '@playwright/test'
 
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
 
-function getLocators(page: Page) {
-  return {
-    trigger: page.getByRole('button', { name: 'Canvas Mode' }),
-    menu: page.getByRole('menu', { name: 'Canvas Mode' }),
-    selectItem: page.getByRole('menuitemradio', { name: 'Select' }),
-    handItem: page.getByRole('menuitemradio', { name: 'Hand' })
-  }
-}
+const getLocators = (page: Page) => ({
+  trigger: page.getByRole('button', { name: 'Canvas Mode' }),
+  menu: page.getByRole('menu', { name: 'Canvas Mode' }),
+  selectItem: page.getByRole('menuitemradio', { name: 'Select' }),
+  handItem: page.getByRole('menuitemradio', { name: 'Hand' })
+})
 
 const MODES = [
   {

browser_tests/tests/canvasSettings.spec.ts

@@ -7,7 +7,7 @@ import { sleep } from '@e2e/fixtures/utils/timing'
 
 const CLIP_NODE_COUNT = 2
 
-async function getClipNodesDragBox(comfyPage: ComfyPage) {
+const getClipNodesDragBox = async (comfyPage: ComfyPage) => {
   const clipNodes = await comfyPage.nodeOps.getNodeRefsByType('CLIPTextEncode')
   expect(
     clipNodes,
@@ -242,11 +242,11 @@ test.describe('Canvas settings', { tag: '@canvas' }, () => {
      * hold), nudge by `(dx, dy)` absolute pixels, then release. Spec-local
      * because it exists only to probe the CanvasPointer timing thresholds.
      */
-    async function holdDragAt(
+    const holdDragAt = async (
       comfyPage: ComfyPage,
       pos: { x: number; y: number },
       opts: { dx: number; dy: number; holdMs: number }
-    ) {
+    ) => {
       const abs = await comfyPage.canvasOps.toAbsolute(pos)
       await comfyPage.page.mouse.move(abs.x, abs.y)
       await comfyPage.page.mouse.down()
@@ -383,9 +383,8 @@ test.describe('Canvas settings', { tag: '@canvas' }, () => {
     // (CI jitter, background throttling, canvas-idle behaviour). Assert the
     // render-loop throttle value instead — that is what actually governs
     // frame cadence.
-    function getFrameGap(comfyPage: ComfyPage) {
-      return comfyPage.page.evaluate(() => window.app!.canvas.maximumFps * 1000)
-    }
+    const getFrameGap = (comfyPage: ComfyPage) =>
+      comfyPage.page.evaluate(() => window.app!.canvas.maximumFps * 1000)
 
     test('caps the render loop frame gap', async ({ comfyPage }) => {
       await comfyPage.settings.setSetting('LiteGraph.Canvas.MaximumFps', 30)

browser_tests/tests/changeTracker.spec.ts

@@ -219,7 +219,7 @@ test.describe('Change Tracker', { tag: '@workflow' }, () => {
     comfyPage
   }) => {
     const node = (await comfyPage.nodeOps.getFirstNodeRef())!
-    async function bypassAndPin() {
+    const bypassAndPin = async () => {
       await beforeChange(comfyPage)
       await comfyPage.keyboard.bypass()
       await expect(node).toBeBypassed()
@@ -228,14 +228,14 @@ test.describe('Change Tracker', { tag: '@workflow' }, () => {
       await afterChange(comfyPage)
     }
 
-    async function collapse() {
+    const collapse = async () => {
       await beforeChange(comfyPage)
       await node.click('collapse', { moveMouseToEmptyArea: true })
       await expect(node).toBeCollapsed()
       await afterChange(comfyPage)
     }
 
-    async function multipleChanges() {
+    const multipleChanges = async () => {
       await beforeChange(comfyPage)
       // Call other actions that uses begin/endChange
       await node.click('title')

browser_tests/tests/defaultKeybindings.spec.ts

@@ -133,11 +133,10 @@ test.describe('Default Keybindings', { tag: '@keyboard' }, () => {
       await node.click('title')
 
       // Normal mode is ALWAYS (0)
-      function getMode() {
-        return comfyPage.page.evaluate((nodeId) => {
+      const getMode = () =>
+        comfyPage.page.evaluate((nodeId) => {
           return window.app!.canvas.graph!.getNodeById(nodeId)!.mode
         }, node.id)
-      }
 
       await expect.poll(() => getMode()).toBe(0)
 

browser_tests/tests/dialog.spec.ts

@@ -290,7 +290,7 @@ test('Blueprint overwrite', { tag: ['@subgraph'] }, async ({ comfyPage }) => {
 
   const confirmDialog = comfyPage.confirmDialog.root
   const { incrementButton } = comfyPage.vueNodes.getInputNumberControls(steps)
-  async function dirtyGraphAndSave() {
+  const dirtyGraphAndSave = async () => {
     await incrementButton.click()
     await comfyPage.page.keyboard.press('Control+s')
   }

browser_tests/tests/groupCopyPaste.spec.ts

@@ -21,14 +21,13 @@ test.describe('Group Copy Paste', { tag: ['@canvas'] }, () => {
     await comfyPage.clipboard.paste()
     await comfyPage.nextFrame()
 
-    function getGroupPositions() {
-      return comfyPage.page.evaluate(() =>
+    const getGroupPositions = () =>
+      comfyPage.page.evaluate(() =>
         window.app!.graph.groups.map((g: { pos: number[] }) => ({
           x: g.pos[0],
           y: g.pos[1]
         }))
       )
-    }
 
     await expect.poll(getGroupPositions).toHaveLength(2)
 

browser_tests/tests/groupNode.spec.ts

@@ -137,7 +137,7 @@ test.describe('Group Node', { tag: '@node' }, () => {
   test('Manage group opens with the correct group selected', async ({
     comfyPage
   }) => {
-    async function makeGroup(name: string, type1: string, type2: string) {
+    const makeGroup = async (name: string, type1: string, type2: string) => {
       const node1 = (await comfyPage.nodeOps.getNodeRefsByType(type1))[0]
       const node2 = (await comfyPage.nodeOps.getNodeRefsByType(type2))[0]
       await node1.click('title')
@@ -204,7 +204,7 @@ test.describe('Group Node', { tag: '@node' }, () => {
   test('Reconnects inputs after configuration changed via manage dialog save', async ({
     comfyPage
   }) => {
-    async function expectSingleNode(type: string) {
+    const expectSingleNode = async (type: string) => {
       const nodes = await comfyPage.nodeOps.getNodeRefsByType(type)
       expect(nodes).toHaveLength(1)
       return nodes[0]
@@ -255,13 +255,13 @@ test.describe('Group Node', { tag: '@node' }, () => {
     const GROUP_NODE_NAME = 'group_node' // Node name in given workflow
     const GROUP_NODE_TYPE = `${GROUP_NODE_PREFIX}${GROUP_NODE_NAME}`
 
-    async function isRegisteredLitegraph(comfyPage: ComfyPage) {
+    const isRegisteredLitegraph = async (comfyPage: ComfyPage) => {
       return await comfyPage.page.evaluate((nodeType: string) => {
         return !!window.LiteGraph!.registered_node_types[nodeType]
       }, GROUP_NODE_TYPE)
     }
 
-    async function isRegisteredNodeDefStore(comfyPage: ComfyPage) {
+    const isRegisteredNodeDefStore = async (comfyPage: ComfyPage) => {
       await comfyPage.menu.nodeLibraryTab.open()
       const groupNodesFolderCt = await comfyPage.menu.nodeLibraryTab
         .getFolder(GROUP_NODE_CATEGORY)
@@ -269,10 +269,10 @@ test.describe('Group Node', { tag: '@node' }, () => {
       return groupNodesFolderCt === 1
     }
 
-    async function verifyNodeLoaded(
+    const verifyNodeLoaded = async (
       comfyPage: ComfyPage,
       expectedCount: number
-    ) {
+    ) => {
       expect(
         await comfyPage.nodeOps.getNodeRefsByType(GROUP_NODE_TYPE)
       ).toHaveLength(expectedCount)

browser_tests/tests/imageCompare.spec.ts

@@ -510,7 +510,7 @@ test.describe('Image Compare', { tag: ['@widget', '@vue-nodes'] }, () => {
     const brokenAfter = 'http://127.0.0.1:1/broken2.png'
 
     const pageErrors: Error[] = []
-    function onPageError(err: Error) {
+    const onPageError = (err: Error) => {
       pageErrors.push(err)
     }
     comfyPage.page.on('pageerror', onPageError)

browser_tests/tests/interaction.spec.ts

@@ -82,10 +82,10 @@ test.describe('Node Interaction', () => {
       }
     )
 
-    async function dragSelectNodes(
+    const dragSelectNodes = async (
       comfyPage: ComfyPage,
       clipNodes: NodeReference[]
-    ) {
+    ) => {
       const clipNode1Pos = await clipNodes[0].getPosition()
       const clipNode2Pos = await clipNodes[1].getPosition()
       const offset = 64
@@ -117,16 +117,15 @@ test.describe('Node Interaction', () => {
     }) => {
       const clipNodes =
         await comfyPage.nodeOps.getNodeRefsByType('CLIPTextEncode')
-      function getPositions() {
-        return Promise.all(clipNodes.map((node) => node.getPosition()))
-      }
-      async function testDirection({
+      const getPositions = () =>
+        Promise.all(clipNodes.map((node) => node.getPosition()))
+      const testDirection = async ({
         direction,
         expectedPosition
       }: {
         direction: string
         expectedPosition: (originalPosition: Position) => Position
-      }) {
+      }) => {
         const originalPositions = await getPositions()
         await dragSelectNodes(comfyPage, clipNodes)
         await comfyPage.command.executeCommand(
@@ -672,7 +671,7 @@ test.describe('Canvas Interaction', { tag: '@screenshot' }, () => {
   })
 
   test('Cursor style changes when panning', async ({ comfyPage }) => {
-    async function getCursorStyle() {
+    const getCursorStyle = async () => {
       return await comfyPage.page.evaluate(() => {
         return (
           document.getElementById('graph-canvas')!.style.cursor || 'default'
@@ -704,7 +703,7 @@ test.describe('Canvas Interaction', { tag: '@screenshot' }, () => {
   test('Properly resets dragging state after pan mode sequence', async ({
     comfyPage
   }) => {
-    async function getCursorStyle() {
+    const getCursorStyle = async () => {
       return await comfyPage.page.evaluate(() => {
         return (
           document.getElementById('graph-canvas')!.style.cursor || 'default'
@@ -879,9 +878,8 @@ test.describe('Load workflow', { tag: '@screenshot' }, () => {
     )
   })
 
-  function generateUniqueFilename(extension = '') {
-    return `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}${extension}`
-  }
+  const generateUniqueFilename = (extension = '') =>
+    `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}${extension}`
 
   test.describe('Restore all open workflows on reload', () => {
     let workflowA: string
@@ -1079,7 +1077,7 @@ test.describe('Viewport settings', () => {
     comfyPage,
     comfyMouse
   }) => {
-    async function changeTab(tab: Locator) {
+    const changeTab = async (tab: Locator) => {
       await tab.click()
       await comfyPage.nextFrame()
       await comfyMouse.move(DefaultGraphPositions.emptySpace)
@@ -1408,7 +1406,7 @@ test.describe('Canvas Navigation', { tag: '@screenshot' }, () => {
     test('Cursor changes appropriately in different modes', async ({
       comfyPage
     }) => {
-      async function getCursorStyle() {
+      const getCursorStyle = async () => {
         return await comfyPage.page.evaluate(() => {
           return (
             document.getElementById('graph-canvas')!.style.cursor || 'default'

browser_tests/tests/load3d/gizmoControls.spec.ts

@@ -3,15 +3,14 @@ import type { Page } from '@playwright/test'
 
 import { load3dTest as test } from '@e2e/fixtures/helpers/Load3DFixtures'
 
-function getGizmoConfig(page: Page) {
-  return page.evaluate(() => {
+const getGizmoConfig = (page: Page) =>
+  page.evaluate(() => {
     const n = window.app!.graph.getNodeById(1)
     const modelConfig = n?.properties?.['Model Config'] as
       | { gizmo?: { enabled: boolean; mode: string } }
       | undefined
     return modelConfig?.gizmo
   })
-}
 
 test.describe('Load3D Gizmo Controls', () => {
   test(

browser_tests/tests/load3d/load3d.spec.ts

@@ -155,7 +155,7 @@ test.describe('Load3D', () => {
     async ({ comfyPage, load3d }) => {
       await expect(load3d.uploadBackgroundImageButton).toBeVisible()
       const node = await comfyPage.nodeOps.getNodeRefById(1)
-      async function readBackgroundImage() {
+      const readBackgroundImage = async () => {
         const properties =
           await node.getProperty<Record<string, { backgroundImage?: string }>>(
             'properties'
@@ -222,7 +222,7 @@ test.describe('Load3D', () => {
       await expect(load3d.gridToggleButton).toBeVisible()
 
       const node = await comfyPage.nodeOps.getNodeRefById(1)
-      async function readShowGrid() {
+      const readShowGrid = async () => {
         const properties =
           await node.getProperty<Record<string, { showGrid?: boolean }>>(
             'properties'

browser_tests/tests/nodeHelp.spec.ts

@@ -55,7 +55,7 @@ async function setLocaleAndWaitForWorkflowReload(
     const waitForReload = new Promise<void>((resolve, reject) => {
       const timeoutAt = performance.now() + 5000
 
-      function tick() {
+      const tick = () => {
         if (changeTracker.isLoadingGraph) {
           sawLoading = true
         }

browser_tests/tests/nodeSearchBox.spec.ts

@@ -166,10 +166,10 @@ test.describe('Node search box', { tag: '@node' }, () => {
   })
 
   test.describe('Filtering', () => {
-    async function expectFilterChips(
+    const expectFilterChips = async (
       comfyPage: ComfyPage,
       expectedTexts: string[]
-    ) {
+    ) => {
       const chips = comfyPage.searchBox.filterChips
 
       // Check that the number of chips matches the expected count

browser_tests/tests/nodeSearchBoxV2.spec.ts

@@ -243,18 +243,15 @@ test.describe('Node search box V2', { tag: '@node' }, () => {
       comfyPage
     }) => {
       const { searchBoxV2 } = comfyPage
-      function switchToDesktop() {
-        return comfyPage.page.setViewportSize({ width: 1280, height: 800 })
-      }
-      function switchToMobile() {
-        return comfyPage.page.setViewportSize({ width: 360, height: 800 })
-      }
-      function expectExpanded(value: 'true' | 'false') {
-        return expect(searchBoxV2.sidebarToggle).toHaveAttribute(
+      const switchToDesktop = () =>
+        comfyPage.page.setViewportSize({ width: 1280, height: 800 })
+      const switchToMobile = () =>
+        comfyPage.page.setViewportSize({ width: 360, height: 800 })
+      const expectExpanded = (value: 'true' | 'false') =>
+        expect(searchBoxV2.sidebarToggle).toHaveAttribute(
           'aria-expanded',
           value
         )
-      }
 
       await switchToDesktop()
       await searchBoxV2.open()

browser_tests/tests/nodeSearchBoxV2Extended.spec.ts

@@ -312,9 +312,7 @@ test.describe('Node search box V2 extended', { tag: '@node' }, () => {
   test.describe('Search behavior', () => {
     test('Search narrows results progressively', async ({ comfyPage }) => {
       const { searchBoxV2 } = comfyPage
-      function getCount() {
-        return searchBoxV2.results.count()
-      }
+      const getCount = () => searchBoxV2.results.count()
 
       await searchBoxV2.open()
 

browser_tests/tests/numberControlWidget.spec.ts

@@ -0,0 +1,251 @@
+import { expect } from '@playwright/test'
+
+import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
+
+test.describe('Number widget', { tag: ['@screenshot', '@widget'] }, () => {
+  test('Can drag adjust value', async ({ comfyPage }) => {
+    await comfyPage.workflow.loadWorkflow('widgets/seed_widget')
+
+    const node = (await comfyPage.nodeOps.getFirstNodeRef())!
+    const widget = await node.getWidget(0)
+    await comfyPage.page.evaluate(() => {
+      window.widgetValue = undefined
+      const widget = window.app!.graph!.nodes[0].widgets![0]
+      widget.callback = (value: number) => {
+        window.widgetValue = value
+      }
+    })
+    await widget.dragHorizontal(50)
+    await expect(comfyPage.canvas).toHaveScreenshot('seed_widget_dragged.png')
+
+    await expect
+      .poll(() => comfyPage.page.evaluate(() => window.widgetValue))
+      .toBeDefined()
+  })
+})
+
+test.describe('WidgetControlMode setting', { tag: '@widget' }, () => {
+  test.afterEach(async ({ comfyPage }) => {
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'after')
+  })
+
+  test('Changing mode to "before" updates control widget labels', async ({
+    comfyPage
+  }) => {
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'after')
+    await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
+    const ksampler = (await comfyPage.nodeOps.getNodeRefsByType('KSampler'))[0]
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate((id) => {
+          const node = window.app!.graph!.getNodeById(id)
+          return node?.widgets
+            ?.filter((w) => (w.label ?? '').includes('control'))
+            .map((w) => w.label)
+        }, ksampler.id)
+      )
+      .toEqual(expect.arrayContaining([expect.stringContaining('after')]))
+
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate((id) => {
+          const node = window.app!.graph!.getNodeById(id)
+          return node?.widgets
+            ?.filter((w) => (w.label ?? '').includes('control'))
+            .map((w) => w.label)
+        }, ksampler.id)
+      )
+      .toEqual(expect.arrayContaining([expect.stringContaining('before')]))
+  })
+
+  test('Changing mode back to "after" restores labels', async ({
+    comfyPage
+  }) => {
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+    await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
+    const ksampler = (await comfyPage.nodeOps.getNodeRefsByType('KSampler'))[0]
+
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'after')
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate((id) => {
+          const node = window.app!.graph!.getNodeById(id)
+          return node?.widgets
+            ?.filter((w) => (w.label ?? '').includes('control'))
+            .map((w) => w.label)
+        }, ksampler.id)
+      )
+      .toEqual(expect.arrayContaining([expect.stringContaining('after')]))
+  })
+
+  test('Mode change updates control widgets across multiple nodes', async ({
+    comfyPage
+  }) => {
+    await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
+
+    await comfyPage.page.evaluate(() => {
+      const node = window.LiteGraph!.createNode('KSampler')
+      node!.pos = [400, 30]
+      window.app!.graph!.add(node!)
+    })
+    await comfyPage.nextFrame()
+
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate(() => {
+          const ksamplers = window.app!.graph!.nodes.filter(
+            (n) => n.type === 'KSampler'
+          )
+          return (
+            ksamplers.length === 2 &&
+            ksamplers.every((n) => {
+              const controlLabels = (n.widgets ?? [])
+                .filter((w) => (w.label ?? '').includes('control'))
+                .map((w) => w.label ?? '')
+              return (
+                controlLabels.length > 0 &&
+                controlLabels.every((label) => label.includes('before'))
+              )
+            })
+          )
+        })
+      )
+      .toBe(true)
+  })
+
+  test('Nodes without widgets are skipped without error', async ({
+    comfyPage
+  }) => {
+    await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
+
+    await comfyPage.page.evaluate(() => {
+      const node = window.LiteGraph!.createNode('Reroute')
+      if (node) {
+        node.pos = [400, 30]
+        window.app!.graph!.add(node)
+      }
+    })
+    await comfyPage.nextFrame()
+
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+
+    const ksampler = (await comfyPage.nodeOps.getNodeRefsByType('KSampler'))[0]
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate((id) => {
+          const node = window.app!.graph!.getNodeById(id)
+          return node?.widgets
+            ?.filter((w) => (w.label ?? '').includes('control'))
+            .map((w) => w.label)
+        }, ksampler.id)
+      )
+      .toEqual(expect.arrayContaining([expect.stringContaining('before')]))
+  })
+
+  test('Canvas is marked dirty after mode change', async ({ comfyPage }) => {
+    await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
+
+    await comfyPage.page.evaluate(() => {
+      const w = window as Window & { __canvasDirtied?: boolean }
+      w.__canvasDirtied = false
+      const origSetDirty = window.app!.canvas.setDirty.bind(window.app!.canvas)
+      window.app!.canvas.setDirty = (
+        ...args: Parameters<typeof origSetDirty>
+      ) => {
+        w.__canvasDirtied = true
+        return origSetDirty(...args)
+      }
+    })
+
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate(
+          () =>
+            (window as Window & { __canvasDirtied?: boolean }).__canvasDirtied
+        )
+      )
+      .toBe(true)
+  })
+
+  test('Mode change updates combo control widget labels', async ({
+    comfyPage
+  }) => {
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'after')
+    await comfyPage.workflow.loadWorkflow('widgets/combo_control_widget')
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate(() => {
+          const node = window.app!.graph!.nodes[0]
+          return (node?.widgets ?? [])
+            .filter((w) => (w.label ?? '').includes('control'))
+            .map((w) => w.label!)
+        })
+      )
+      .toEqual(expect.arrayContaining([expect.stringContaining('after')]))
+
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate(() => {
+          const node = window.app!.graph!.nodes[0]
+          return (node?.widgets ?? [])
+            .filter((w) => (w.label ?? '').includes('control'))
+            .map((w) => w.label!)
+        })
+      )
+      .toEqual(expect.arrayContaining([expect.stringContaining('before')]))
+  })
+
+  test('Mode change propagates to linkedWidgets on control widgets', async ({
+    comfyPage
+  }) => {
+    // linkedWidgets is only set on main widgets, never on control widgets
+    // themselves. This covers the defensive code path (GraphCanvas.vue:360-362).
+    await comfyPage.workflow.loadWorkflow('nodes/single_ksampler')
+
+    await comfyPage.page.evaluate(() => {
+      const node = window.app!.graph!.nodes[0]
+      if (!node?.widgets) return
+      const controlWidget = node.widgets.find((w) =>
+        (w.label ?? '').includes('control')
+      )
+      if (!controlWidget) return
+      const mockLinked = Object.create(null)
+      mockLinked.name = 'mock_filter'
+      mockLinked.label = 'control after generate'
+      mockLinked.type = 'string'
+      mockLinked.value = ''
+      controlWidget.linkedWidgets = [mockLinked]
+    })
+
+    await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+
+    await expect
+      .poll(() =>
+        comfyPage.page.evaluate(() => {
+          const node = window.app!.graph!.nodes[0]
+          const controlWidget = node?.widgets?.find((w) =>
+            (w.label ?? '').includes('control')
+          )
+          const linked = controlWidget?.linkedWidgets ?? []
+          return [controlWidget?.label, ...linked.map((l) => l.label ?? '')]
+        })
+      )
+      .toEqual(
+        expect.arrayContaining([
+          expect.stringContaining('before'),
+          expect.stringContaining('before')
+        ])
+      )
+  })
+})

browser_tests/tests/painter.spec.ts

@@ -758,8 +758,8 @@ test.describe('Painter', { tag: ['@widget', '@vue-nodes'] }, () => {
     await drawStroke(comfyPage.page, canvas, { yPct: 0.75 })
     await comfyPage.nextFrame()
 
-    function hasContentAtRow(yFraction: number) {
-      return canvas.evaluate((el: HTMLCanvasElement, y: number) => {
+    const hasContentAtRow = (yFraction: number) =>
+      canvas.evaluate((el: HTMLCanvasElement, y: number) => {
         const ctx = el.getContext('2d')
         if (!ctx) return false
         const cy = Math.floor(el.height * y)
@@ -769,7 +769,6 @@ test.describe('Painter', { tag: ['@widget', '@vue-nodes'] }, () => {
         }
         return false
       }, yFraction)
-    }
 
     await expect
       .poll(() => hasContentAtRow(0.25), {

browser_tests/tests/propertiesPanel/errorsTabMissingMediaRuntime.spec.ts

@@ -77,7 +77,7 @@ const cloudUploadRaceTest = comfyPageFixture.extend<{
     }
     cloudUploadAssetStateByPage.set(page, state)
 
-    async function assetsRouteHandler(route: Route) {
+    const assetsRouteHandler = async (route: Route) => {
       const allAssets = [
         cloudDefaultGraphInputAsset,
         ...(state.isUploadedAssetAvailable ? [cloudUploadedVideoAsset] : [])
@@ -149,7 +149,7 @@ async function delayNextUpload(comfyPage: ComfyPage) {
     releaseUpload = resolve
   })
 
-  async function uploadRouteHandler(route: Route) {
+  const uploadRouteHandler = async (route: Route) => {
     resolveUploadStarted()
     await release
     await route.continue()

browser_tests/tests/queueNotificationBanners.spec.ts

@@ -15,9 +15,7 @@ const REQUEST_ID_SECONDARY = 2
 const REQUEST_ID_MISMATCH = 999
 
 let nextRequestId = 1000
-function newRequestId() {
-  return nextRequestId++
-}
+const newRequestId = () => nextRequestId++
 
 function bannerLocator(page: Page) {
   return page.getByTestId(TestIds.queue.notificationBanner)

browser_tests/tests/remoteWidgets.spec.ts

@@ -6,11 +6,11 @@ import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
 test.describe('Remote COMBO Widget', { tag: '@widget' }, () => {
   const mockOptions = ['d', 'c', 'b', 'a']
 
-  async function addRemoteWidgetNode(
+  const addRemoteWidgetNode = async (
     comfyPage: ComfyPage,
     nodeName: string,
     count: number = 1
-  ) {
+  ) => {
     const tab = comfyPage.menu.nodeLibraryTab
     await tab.open()
     await tab.getFolder('DevTools').click()
@@ -21,24 +21,24 @@ test.describe('Remote COMBO Widget', { tag: '@widget' }, () => {
     }
   }
 
-  async function getWidgetOptions(
+  const getWidgetOptions = async (
     comfyPage: ComfyPage,
     nodeName: string
-  ): Promise<string[] | undefined> {
+  ): Promise<string[] | undefined> => {
     return await comfyPage.page.evaluate((name) => {
       const node = window.app!.graph!.nodes.find((node) => node.title === name)
       return node!.widgets![0].options.values as string[] | undefined
     }, nodeName)
   }
 
-  async function getWidgetValue(comfyPage: ComfyPage, nodeName: string) {
+  const getWidgetValue = async (comfyPage: ComfyPage, nodeName: string) => {
     return await comfyPage.page.evaluate((name) => {
       const node = window.app!.graph!.nodes.find((node) => node.title === name)
       return node!.widgets![0].value
     }, nodeName)
   }
 
-  function clickRefreshButton(comfyPage: ComfyPage, nodeName: string) {
+  const clickRefreshButton = (comfyPage: ComfyPage, nodeName: string) => {
     return comfyPage.page.evaluate((name) => {
       const node = window.app!.graph!.nodes.find((node) => node.title === name)
       const buttonWidget = node!.widgets!.find((w) => w.name === 'refresh')

browser_tests/tests/selectionToolbox.spec.ts

@@ -13,21 +13,16 @@ test.beforeEach(async ({ comfyPage }) => {
 const BLUE_COLOR = 'rgb(51, 51, 85)'
 const RED_COLOR = 'rgb(85, 51, 51)'
 
-function getColorPickerButton(comfyPage: { page: Page }) {
-  return comfyPage.page.getByTestId(TestIds.selectionToolbox.colorPickerButton)
-}
+const getColorPickerButton = (comfyPage: { page: Page }) =>
+  comfyPage.page.getByTestId(TestIds.selectionToolbox.colorPickerButton)
 
-function getColorPickerCurrentColor(comfyPage: { page: Page }) {
-  return comfyPage.page.getByTestId(
-    TestIds.selectionToolbox.colorPickerCurrentColor
-  )
-}
+const getColorPickerCurrentColor = (comfyPage: { page: Page }) =>
+  comfyPage.page.getByTestId(TestIds.selectionToolbox.colorPickerCurrentColor)
 
-function getColorPickerGroup(comfyPage: { page: Page }) {
-  return comfyPage.page.getByRole('group').filter({
+const getColorPickerGroup = (comfyPage: { page: Page }) =>
+  comfyPage.page.getByRole('group').filter({
     has: comfyPage.page.getByTestId(TestIds.selectionToolbox.colorBlue)
   })
-}
 
 test.describe('Selection Toolbox', { tag: ['@screenshot', '@ui'] }, () => {
   test.beforeEach(async ({ comfyPage }) => {

browser_tests/tests/selectionToolboxSubmenus.spec.ts

@@ -19,9 +19,8 @@ test.describe(
       await comfyPage.nextFrame()
     })
 
-    function openMoreOptions(comfyPage: ComfyPage) {
-      return openMoreOptionsMenu(comfyPage, 'KSampler')
-    }
+    const openMoreOptions = (comfyPage: ComfyPage) =>
+      openMoreOptionsMenu(comfyPage, 'KSampler')
 
     test('hides Node Info from More Options menu when the new menu is disabled', async ({
       comfyPage

browser_tests/tests/sidebar/sidebarSplitterWidth.spec.ts

@@ -114,12 +114,11 @@ test.describe('Sidebar splitter width independence', () => {
     await dragGutter(comfyPage, 80)
 
     // Check that saved sizes sum to ~100%
-    function getSidebarSizes() {
-      return comfyPage.page.evaluate(() => {
+    const getSidebarSizes = () =>
+      comfyPage.page.evaluate(() => {
         const raw = localStorage.getItem('unified-sidebar')
         return raw ? (JSON.parse(raw) as number[]) : null
       })
-    }
 
     await expect
       .poll(async () => {

browser_tests/tests/subgraph/subgraphBreadcrumb.spec.ts

@@ -25,7 +25,7 @@ const MISSING_NODES_SUBGRAPH_NODE_ID = '2'
  * the root graph, then the inner subgraph node that appears inside. Matches
  * how a user navigates via the canvas.
  */
-async function enterNestedSubgraphs(comfyPage: ComfyPage) {
+const enterNestedSubgraphs = async (comfyPage: ComfyPage) => {
   const outerNode = await comfyPage.nodeOps.getNodeRefById(
     OUTER_SUBGRAPH_NODE_ID_IN_NESTED
   )

browser_tests/tests/subgraph/subgraphPromotion.spec.ts

@@ -608,6 +608,33 @@ test.describe(
   }
 )
 
+test.describe(
+  'WidgetControlMode in subgraphs',
+  { tag: ['@subgraph', '@widget'] },
+  () => {
+    test.afterEach(async ({ comfyPage }) => {
+      await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'after')
+    })
+
+    test('Mode change updates control widget labels inside subgraph nodes', async ({
+      comfyPage
+    }) => {
+      await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'after')
+      await comfyPage.workflow.loadWorkflow('subgraphs/basic-subgraph')
+
+      await expect
+        .poll(() => comfyPage.subgraph.getInnerControlWidgetLabels())
+        .toEqual(expect.arrayContaining([expect.stringContaining('after')]))
+
+      await comfyPage.settings.setSetting('Comfy.WidgetControlMode', 'before')
+
+      await expect
+        .poll(() => comfyPage.subgraph.getInnerControlWidgetLabels())
+        .toEqual(expect.arrayContaining([expect.stringContaining('before')]))
+    })
+  }
+)
+
 test('Promote/Demote by Context Menu @vue-nodes', async ({ comfyPage }) => {
   await comfyPage.workflow.loadWorkflow('subgraphs/basic-subgraph')
   const ksampler = comfyPage.vueNodes.getNodeLocator('1')
@@ -689,9 +716,7 @@ test('Can intermix linked and proxy @vue-nodes', async ({ comfyPage }) => {
     const fromSlot = ksampler.getSlot('steps')
     const toPos = await comfyPage.subgraph.getInputSlot().getOpenSlotPosition()
     await fromSlot.dragTo(comfyPage.canvas, { targetPosition: toPos })
-    function isConnected() {
-      return comfyPage.vueNodes.isSlotConnected(fromSlot)
-    }
+    const isConnected = () => comfyPage.vueNodes.isSlotConnected(fromSlot)
     await expect.poll(isConnected).toBe(true)
 
     await comfyPage.subgraph.exitViaBreadcrumb()
@@ -737,9 +762,7 @@ test('Link already promoted widget @vue-nodes', async ({ comfyPage }) => {
     const fromSlot = ksampler.getSlot('steps')
     const toPos = await comfyPage.subgraph.getInputSlot().getOpenSlotPosition()
     await fromSlot.dragTo(comfyPage.canvas, { targetPosition: toPos })
-    function isConnected() {
-      return comfyPage.vueNodes.isSlotConnected(fromSlot)
-    }
+    const isConnected = () => comfyPage.vueNodes.isSlotConnected(fromSlot)
     await expect.poll(isConnected).toBe(true)
 
     await comfyPage.subgraph.exitViaBreadcrumb()
@@ -816,9 +839,7 @@ test('Linked widgets can not be demoted @vue-nodes', async ({ comfyPage }) => {
     const fromSlot = ksampler.getSlot('steps')
     const toPos = await comfyPage.subgraph.getInputSlot().getOpenSlotPosition()
     await fromSlot.dragTo(comfyPage.canvas, { targetPosition: toPos })
-    function isConnected() {
-      return comfyPage.vueNodes.isSlotConnected(fromSlot)
-    }
+    const isConnected = () => comfyPage.vueNodes.isSlotConnected(fromSlot)
     await expect.poll(isConnected).toBe(true)
 
     await comfyPage.subgraph.exitViaBreadcrumb()

browser_tests/tests/subgraph/subgraphSerialization.spec.ts

@@ -368,16 +368,15 @@ test.describe('Subgraph Serialization', { tag: ['@subgraph'] }, () => {
         ]
 
         const SENTINEL_IDS = new Set([-1, -10, -20])
-        function isSentinelNodeId(id: number | string): id is number {
-          return typeof id === 'number' && SENTINEL_IDS.has(id)
-        }
+        const isSentinelNodeId = (id: number | string): id is number =>
+          typeof id === 'number' && SENTINEL_IDS.has(id)
 
-        function checkEndpoint(
+        const checkEndpoint = (
           label: string,
           kind: 'origin_id' | 'target_id',
           id: number | string,
           g: typeof graph
-        ): string | null {
+        ): string | null => {
           if (isSentinelNodeId(id)) return null
           if (typeof id !== 'number' || !g._nodes_by_id[id]) {
             return `${label}: ${kind} ${id} invalid or not found`

browser_tests/tests/subgraph/subgraphSlots.spec.ts

@@ -647,9 +647,7 @@ test(
     await test.step('Make second INT typed connection', async () => {
       const toPos = await seedIOSlot.getOpenSlotPosition()
       await seedSlot.dragTo(comfyPage.canvas, { targetPosition: toPos })
-      function isConnected() {
-        return comfyPage.vueNodes.isSlotConnected(seedSlot)
-      }
+      const isConnected = () => comfyPage.vueNodes.isSlotConnected(seedSlot)
       await expect.poll(isConnected).toBe(true)
     })
 
@@ -682,9 +680,8 @@ test(
     )
 
     await test.step('Connect I/O to node with snap', async () => {
-      function hasSnap() {
-        return comfyPage.page.evaluate(() => !!app!.canvas._highlight_pos)
-      }
+      const hasSnap = () =>
+        comfyPage.page.evaluate(() => !!app!.canvas._highlight_pos)
       expect(await hasSnap()).toBe(false)
 
       const emptySlotPos = await seedIOSlot.getOpenSlotPosition()

browser_tests/tests/subgraph/subgraphZeroUuid.spec.ts

@@ -14,7 +14,7 @@ test.describe(
       )
       await comfyPage.vueNodes.waitForNodes()
 
-      async function assertInSubgraph(inSubgraph: boolean) {
+      const assertInSubgraph = async (inSubgraph: boolean) => {
         await expect
           .poll(() => comfyPage.subgraph.isInSubgraph())
           .toBe(inSubgraph)

browser_tests/tests/versionMismatchWarnings.spec.ts

@@ -7,9 +7,9 @@ test.describe('Version Mismatch Warnings', { tag: '@slow' }, () => {
   const ALWAYS_AHEAD_OF_INSTALLED_VERSION = '100.100.100'
   const ALWAYS_BEHIND_INSTALLED_VERSION = '0.0.0'
 
-  function createMockSystemStatsRes(
+  const createMockSystemStatsRes = (
     requiredFrontendVersion: string
-  ): SystemStats {
+  ): SystemStats => {
     return {
       system: {
         os: 'posix',

browser_tests/tests/vueNodes/groups/groups.spec.ts

@@ -79,7 +79,7 @@ async function getNodeGroupCenteringErrors(
 
     const nodeRect = nodeElement.getBoundingClientRect()
 
-    function getCenteringError(group: GraphGroup): NodeGroupCenteringError {
+    const getCenteringError = (group: GraphGroup): NodeGroupCenteringError => {
       const [groupStartX, groupStartY] = app.canvasPosToClientPos([
         group.pos[0],
         group.pos[1]

browser_tests/tests/vueNodes/interactions/links/linkInteraction.spec.ts

@@ -1151,14 +1151,12 @@ test.describe('Vue Node Widget Link Position', { tag: '@vue-nodes' }, () => {
     const ksampler = await comfyPage.page.evaluate(() => {
       const node = window.app!.graph.nodes.find((n) => n.type === 'KSampler')
       if (!node) return null
-      const ksamplerNode = node
-      function findIndex(name: string) {
-        return ksamplerNode.inputs.findIndex(
+      const findIndex = (name: string) =>
+        node.inputs.findIndex(
           (input) => input.name === name || input.widget?.name === name
         )
-      }
       return {
-        id: ksamplerNode.id,
+        id: node.id,
         denoiseIndex: findIndex('denoise'),
         schedulerIndex: findIndex('scheduler')
       }

browser_tests/tests/vueNodes/interactions/node/move.spec.ts

@@ -8,10 +8,10 @@ import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import type { Position } from '@e2e/fixtures/types'
 
 test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
-  async function getHeaderPos(
+  const getHeaderPos = async (
     comfyPage: ComfyPage,
     title: string
-  ): Promise<{ x: number; y: number; width: number; height: number }> {
+  ): Promise<{ x: number; y: number; width: number; height: number }> => {
     const box = await comfyPage.vueNodes
       .getNodeByTitle(title)
       .getByTestId('node-title')
@@ -21,30 +21,27 @@ test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
     return box
   }
 
-  async function getLoadCheckpointHeaderPos(comfyPage: ComfyPage) {
-    return getHeaderPos(comfyPage, 'Load Checkpoint')
-  }
+  const getLoadCheckpointHeaderPos = async (comfyPage: ComfyPage) =>
+    getHeaderPos(comfyPage, 'Load Checkpoint')
 
-  async function expectPosChanged(pos1: Position, pos2: Position) {
+  const expectPosChanged = async (pos1: Position, pos2: Position) => {
     const diffX = Math.abs(pos2.x - pos1.x)
     const diffY = Math.abs(pos2.y - pos1.y)
     expect(diffX).toBeGreaterThan(0)
     expect(diffY).toBeGreaterThan(0)
   }
 
-  function deltaBetween(before: Position, after: Position) {
-    return {
-      x: after.x - before.x,
-      y: after.y - before.y
-    }
-  }
+  const deltaBetween = (before: Position, after: Position) => ({
+    x: after.x - before.x,
+    y: after.y - before.y
+  })
 
-  function expectSameDelta(a: Position, b: Position, tol = 2) {
+  const expectSameDelta = (a: Position, b: Position, tol = 2) => {
     expect(Math.abs(a.x - b.x)).toBeLessThanOrEqual(tol)
     expect(Math.abs(a.y - b.y)).toBeLessThanOrEqual(tol)
   }
 
-  async function dragFromTabButton(comfyPage: ComfyPage, button: Locator) {
+  const dragFromTabButton = async (comfyPage: ComfyPage, button: Locator) => {
     const box = await button.boundingBox()
     if (!box) throw new Error('Tab button has no bounding box')
     const start = {
@@ -175,7 +172,7 @@ test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
     const dx = 120
     const dy = 80
 
-    async function clickNodeTitleWithMeta(title: string) {
+    const clickNodeTitleWithMeta = async (title: string) => {
       await comfyPage.vueNodes
         .getNodeByTitle(title)
         .getByTestId('node-title')

browser_tests/tests/vueNodes/widgets/legacy.spec.ts

@@ -15,11 +15,10 @@ test('@vue-nodes In App Mode, widget width updates with panel size', async ({
     await comfyPage.appMode.enterAppModeWithInputs([['10', 'legacy_widget']])
   })
 
-  function getWidth() {
-    return comfyPage.page.evaluate(
+  const getWidth = () =>
+    comfyPage.page.evaluate(
       () => graph!.getNodeById(10)!.widgets![0].width ?? 0
     )
-  }
 
   await test.step('Mouse clicks resolve to button regions', async () => {
     const legacyWidget = comfyPage.appMode.linearWidgets.locator('canvas')

browser_tests/tests/vueNodes/widgets/text/multilineStringWidget.spec.ts

@@ -5,15 +5,11 @@ import {
 import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 
 test.describe('Vue Multiline String Widget', { tag: '@vue-nodes' }, () => {
-  function getFirstClipNode(comfyPage: ComfyPage) {
-    return comfyPage.vueNodes
-      .getNodeByTitle('CLIP Text Encode (Prompt)')
-      .first()
-  }
+  const getFirstClipNode = (comfyPage: ComfyPage) =>
+    comfyPage.vueNodes.getNodeByTitle('CLIP Text Encode (Prompt)').first()
 
-  function getFirstMultilineStringWidget(comfyPage: ComfyPage) {
-    return getFirstClipNode(comfyPage).getByRole('textbox', { name: 'text' })
-  }
+  const getFirstMultilineStringWidget = (comfyPage: ComfyPage) =>
+    getFirstClipNode(comfyPage).getByRole('textbox', { name: 'text' })
 
   test('should allow entering text', async ({ comfyPage }) => {
     const textarea = getFirstMultilineStringWidget(comfyPage)

browser_tests/tests/widget.spec.ts

@@ -56,8 +56,8 @@ test.describe('Combo text widget', { tag: ['@screenshot', '@widget'] }, () => {
   test('should refresh combo values of optional inputs', async ({
     comfyPage
   }) => {
-    async function getComboValues() {
-      return comfyPage.page.evaluate(() => {
+    const getComboValues = async () =>
+      comfyPage.page.evaluate(() => {
         return window
           .app!.graph!.nodes.find(
             (node) => node.title === 'Node With Optional Combo Input'
@@ -65,7 +65,6 @@ test.describe('Combo text widget', { tag: ['@screenshot', '@widget'] }, () => {
           .widgets!.find((widget) => widget.name === 'optional_combo_input')!
           .options.values
       })
-    }
 
     await comfyPage.workflow.loadWorkflow('inputs/optional_combo_input')
     const initialComboValues = await getComboValues()
@@ -83,8 +82,8 @@ test.describe('Combo text widget', { tag: ['@screenshot', '@widget'] }, () => {
   test('Should refresh combo values of nodes with v2 combo input spec', async ({
     comfyPage
   }) => {
-    async function getComboValues() {
-      return comfyPage.page.evaluate(() => {
+    const getComboValues = async () =>
+      comfyPage.page.evaluate(() => {
         return window
           .app!.graph!.nodes.find(
             (node) => node.title === 'Node With V2 Combo Input'
@@ -92,7 +91,6 @@ test.describe('Combo text widget', { tag: ['@screenshot', '@widget'] }, () => {
           .widgets!.find((widget) => widget.name === 'combo_input')!.options
           .values
       })
-    }
 
     await comfyPage.workflow.loadWorkflow('inputs/node_with_v2_combo_input')
     // click canvas to focus
@@ -139,28 +137,6 @@ test.describe('Slider widget', { tag: ['@screenshot', '@widget'] }, () => {
   })
 })
 
-test.describe('Number widget', { tag: ['@screenshot', '@widget'] }, () => {
-  test('Can drag adjust value', async ({ comfyPage }) => {
-    await comfyPage.workflow.loadWorkflow('widgets/seed_widget')
-
-    const node = (await comfyPage.nodeOps.getFirstNodeRef())!
-    const widget = await node.getWidget(0)
-    await comfyPage.page.evaluate(() => {
-      window.widgetValue = undefined
-      const widget = window.app!.graph!.nodes[0].widgets![0]
-      widget.callback = (value: number) => {
-        window.widgetValue = value
-      }
-    })
-    await widget.dragHorizontal(50)
-    await expect(comfyPage.canvas).toHaveScreenshot('seed_widget_dragged.png')
-
-    await expect
-      .poll(() => comfyPage.page.evaluate(() => window.widgetValue))
-      .toBeDefined()
-  })
-})
-
 test.describe(
   'Dynamic widget manipulation',
   { tag: ['@screenshot', '@widget'] },

browser_tests/tests/workflowPersistence.spec.ts

@@ -213,11 +213,10 @@ test.describe('Workflow Persistence', () => {
       .poll(() => comfyPage.nodeOps.getNodeCount())
       .toBeGreaterThanOrEqual(2)
 
-    function getNodeTypes() {
-      return comfyPage.page.evaluate(() =>
+    const getNodeTypes = () =>
+      comfyPage.page.evaluate(() =>
         window.app!.graph.nodes.map((n: { type: string }) => n.type)
       )
-    }
     await expect.poll(getNodeTypes).toContain('KSampler')
     await expect.poll(getNodeTypes).toContain('EmptyLatentImage')
     await expect
@@ -553,12 +552,11 @@ test.describe('Workflow Persistence', () => {
     await comfyPage.setup({ clearStorage: false })
     await comfyPage.nextFrame()
 
-    function getSplitterSizes() {
-      return comfyPage.page.evaluate(() => {
+    const getSplitterSizes = () =>
+      comfyPage.page.evaluate(() => {
         const raw = localStorage.getItem('Comfy.Splitter.MainSplitter')
         return raw ? (JSON.parse(raw) as number[]) : null
       })
-    }
 
     await expect
       .poll(async () => {

browser_tests/utils/backupUtils.ts

@@ -3,11 +3,9 @@ import path from 'path'
 
 type PathParts = readonly [string, ...string[]]
 
-function getBackupPath(originalPath: string): string {
-  return `${originalPath}.bak`
-}
+const getBackupPath = (originalPath: string): string => `${originalPath}.bak`
 
-function resolvePathIfExists(pathParts: PathParts): string | null {
+const resolvePathIfExists = (pathParts: PathParts): string | null => {
   const resolvedPath = path.resolve(...pathParts)
   if (!fs.pathExistsSync(resolvedPath)) {
     console.warn(`Path not found: ${resolvedPath}`)
@@ -16,7 +14,7 @@ function resolvePathIfExists(pathParts: PathParts): string | null {
   return resolvedPath
 }
 
-function createScaffoldingCopy(srcDir: string, destDir: string) {
+const createScaffoldingCopy = (srcDir: string, destDir: string) => {
   // Get all items (files and directories) in the source directory
   const items = fs.readdirSync(srcDir, { withFileTypes: true })
 

packages/shared-frontend-utils/src/formatUtil.ts

@@ -195,7 +195,7 @@ export function processDynamicPrompt(input: string): string {
   let result = ''
   input = stripComments(input)
 
-  function handleEscape() {
+  const handleEscape = () => {
     const nextChar = input[i++]
     return '\\' + nextChar
   }
@@ -347,7 +347,7 @@ export function formatDate(text: string, date: Date) {
  * Generate a cache key from parameters
  * Sorts the parameters to ensure consistent keys regardless of parameter order
  */
-export function paramsToCacheKey(params: unknown): string {
+export const paramsToCacheKey = (params: unknown): string => {
   if (typeof params === 'string') return params
   if (typeof params === 'object' && params !== null)
     return Object.keys(params)
@@ -362,7 +362,7 @@ export function paramsToCacheKey(params: unknown): string {
  * Generates a RFC4122 compliant UUID v4 using the native crypto API when available
  * @returns A properly formatted UUID string
  */
-export function generateUUID(): string {
+export const generateUUID = (): string => {
   // Use native crypto.randomUUID() if available (modern browsers)
   if (
     typeof crypto !== 'undefined' &&
@@ -379,21 +379,18 @@ export function generateUUID(): string {
   })
 }
 
-function isCivitaiHost(hostname: string): boolean {
-  return (
-    hostname === 'civitai.com' ||
-    hostname.endsWith('.civitai.com') ||
-    hostname === 'civitai.red' ||
-    hostname.endsWith('.civitai.red')
-  )
-}
+const isCivitaiHost = (hostname: string): boolean =>
+  hostname === 'civitai.com' ||
+  hostname.endsWith('.civitai.com') ||
+  hostname === 'civitai.red' ||
+  hostname.endsWith('.civitai.red')
 
 /**
  * Checks if a URL belongs to any Civitai domain (civitai.com or civitai.red).
  * Use this for source-name detection; use `isCivitaiModelUrl` when the URL
  * must also match a specific model API path format.
  */
-export function isCivitaiUrl(url: string): boolean {
+export const isCivitaiUrl = (url: string): boolean => {
   if (!isValidUrl(url)) return false
   return isCivitaiHost(new URL(url).hostname.toLowerCase())
 }
@@ -406,7 +403,7 @@ export function isCivitaiUrl(url: string): boolean {
  * isCivitaiModelUrl('https://civitai.com/api/v1/models-versions/15342') // true
  * isCivitaiModelUrl('https://example.com/model.safetensors') // false
  */
-export function isCivitaiModelUrl(url: string): boolean {
+export const isCivitaiModelUrl = (url: string): boolean => {
   if (!isValidUrl(url)) return false
 
   const urlObj = new URL(url)
@@ -429,7 +426,7 @@ export function isCivitaiModelUrl(url: string): boolean {
  *  'https://huggingface.co/bfl/FLUX.1/resolve/main/flux1-canny-dev.safetensors?download=true'
  * ) // https://huggingface.co/bfl/FLUX.1
  */
-export function downloadUrlToHfRepoUrl(url: string): string {
+export const downloadUrlToHfRepoUrl = (url: string): string => {
   try {
     const urlObj = new URL(url)
     const pathname = urlObj.pathname

packages/shared-frontend-utils/src/networkUtil.ts

@@ -1,7 +1,7 @@
 import axios from 'axios'
 
 const VALID_STATUS_CODES = [200, 201, 301, 302, 307, 308]
-export async function checkUrlReachable(url: string): Promise<boolean> {
+export const checkUrlReachable = async (url: string): Promise<boolean> => {
   try {
     const response = await axios.head(url)
     // Additional check for successful response

scripts/check-unused-i18n-keys.ts

@@ -103,9 +103,8 @@ function shouldIgnoreKey(key: string): boolean {
 // Search for key usage in source files
 function isKeyUsed(key: string, sourceFiles: string[]): boolean {
   // Escape special regex characters
-  function escapeRegex(str: string) {
-    return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
-  }
+  const escapeRegex = (str: string) =>
+    str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
   const escapedKey = escapeRegex(key)
   const lastPart = key.split('.').pop()
   const escapedLastPart = lastPart ? escapeRegex(lastPart) : ''

scripts/collect-i18n-general.ts

@@ -18,7 +18,7 @@ const localePath = './src/locales/en/main.json'
 const commandsPath = './src/locales/en/commands.json'
 const settingsPath = './src/locales/en/settings.json'
 
-function extractMenuCommandLocaleStrings(): Set<string> {
+const extractMenuCommandLocaleStrings = (): Set<string> => {
   const labels = new Set<string>()
   for (const [category, _] of CORE_MENU_COMMANDS) {
     category.forEach((category) => labels.add(category))

scripts/size-report.js

@@ -93,9 +93,7 @@ async function buildBundleReport() {
    * @param {string[]} files
    * @returns {string[]}
    */
-  function filterFiles(files) {
-    return files.filter((file) => file.endsWith('.json'))
-  }
+  const filterFiles = (files) => files.filter((file) => file.endsWith('.json'))
 
   const currFiles = filterFiles(await readdir(currDir))
   const baselineFiles = existsSync(prevDir)

src/App.vue

@@ -34,7 +34,7 @@ watch(
   { flush: 'post' }
 )
 
-function showContextMenu(event: MouseEvent) {
+const showContextMenu = (event: MouseEvent) => {
   const { target } = event
   switch (true) {
     case target instanceof HTMLTextAreaElement:

src/base/common/downloadUtil.ts

@@ -70,7 +70,7 @@ export function downloadBlob(filename: string, blob: Blob): void {
  * @param url - The URL to extract filename from
  * @returns The extracted filename or null if not found
  */
-function extractFilenameFromUrl(url: string): string | null {
+const extractFilenameFromUrl = (url: string): string | null => {
   try {
     const urlObj = new URL(url, window.location.origin)
     return urlObj.searchParams.get('filename')

src/base/credits/comfyCredits.ts

@@ -3,7 +3,7 @@ const DEFAULT_NUMBER_FORMAT: Intl.NumberFormatOptions = {
   maximumFractionDigits: 2
 }
 
-function formatNumber({
+const formatNumber = ({
   value,
   locale,
   options
@@ -11,7 +11,7 @@ function formatNumber({
   value: number
   locale?: string
   options?: Intl.NumberFormatOptions
-}): string {
+}): string => {
   const merged: Intl.NumberFormatOptions = {
     ...DEFAULT_NUMBER_FORMAT,
     ...options
@@ -31,25 +31,19 @@ function formatNumber({
 export const CREDITS_PER_USD = 211
 export const COMFY_CREDIT_RATE_CENTS = CREDITS_PER_USD / 100 // credits per cent
 
-export function usdToCents(usd: number): number {
-  return Math.round(usd * 100)
-}
+export const usdToCents = (usd: number): number => Math.round(usd * 100)
 
-export function centsToCredits(cents: number): number {
-  return Math.round(cents * COMFY_CREDIT_RATE_CENTS)
-}
+export const centsToCredits = (cents: number): number =>
+  Math.round(cents * COMFY_CREDIT_RATE_CENTS)
 
-export function creditsToCents(credits: number): number {
-  return Math.round(credits / COMFY_CREDIT_RATE_CENTS)
-}
+export const creditsToCents = (credits: number): number =>
+  Math.round(credits / COMFY_CREDIT_RATE_CENTS)
 
-export function usdToCredits(usd: number): number {
-  return Math.round(usd * CREDITS_PER_USD)
-}
+export const usdToCredits = (usd: number): number =>
+  Math.round(usd * CREDITS_PER_USD)
 
-export function creditsToUsd(credits: number): number {
-  return Math.round((credits / CREDITS_PER_USD) * 100) / 100
-}
+export const creditsToUsd = (credits: number): number =>
+  Math.round((credits / CREDITS_PER_USD) * 100) / 100
 
 export type FormatOptions = {
   value: number
@@ -69,68 +63,63 @@ export type FormatFromUsdOptions = {
   numberOptions?: Intl.NumberFormatOptions
 }
 
-export function formatCredits({
+export const formatCredits = ({
   value,
   locale,
   numberOptions
-}: FormatOptions): string {
-  return formatNumber({ value, locale, options: numberOptions })
-}
+}: FormatOptions): string =>
+  formatNumber({ value, locale, options: numberOptions })
 
-export function formatCreditsFromCents({
+export const formatCreditsFromCents = ({
   cents,
   locale,
   numberOptions
-}: FormatFromCentsOptions): string {
-  return formatCredits({
+}: FormatFromCentsOptions): string =>
+  formatCredits({
     value: centsToCredits(cents),
     locale,
     numberOptions
   })
-}
 
-export function formatCreditsFromUsd({
+export const formatCreditsFromUsd = ({
   usd,
   locale,
   numberOptions
-}: FormatFromUsdOptions): string {
-  return formatCredits({
+}: FormatFromUsdOptions): string =>
+  formatCredits({
     value: usdToCredits(usd),
     locale,
     numberOptions
   })
-}
 
-export function formatUsd({
+export const formatUsd = ({
   value,
   locale,
   numberOptions
-}: FormatOptions): string {
-  return formatNumber({
+}: FormatOptions): string =>
+  formatNumber({
     value,
     locale,
     options: numberOptions
   })
-}
 
-export function formatUsdFromCents({
+export const formatUsdFromCents = ({
   cents,
   locale,
   numberOptions
-}: FormatFromCentsOptions): string {
-  return formatUsd({
+}: FormatFromCentsOptions): string =>
+  formatUsd({
     value: cents / 100,
     locale,
     numberOptions
   })
-}
 
 /**
  * Clamps a USD value to the allowed range for credit purchases
  * @param value - The USD amount to clamp
  * @returns The clamped value between $1 and $1000, or 0 if NaN
  */
-export function clampUsd(value: number): number {
+export const clampUsd = (value: number): number => {
   if (Number.isNaN(value)) return 0
   return Math.min(1000, Math.max(1, value))
 }

src/base/wheelGestures.ts

@@ -14,10 +14,7 @@
  * Components that intercept wheel events should suppress the default for
  * these gestures even when they otherwise let the browser scroll natively.
  */
-export function isCanvasGestureWheel(event: WheelEvent): boolean {
-  return (
-    event.ctrlKey ||
-    event.metaKey ||
-    Math.abs(event.deltaX) > Math.abs(event.deltaY)
-  )
-}
+export const isCanvasGestureWheel = (event: WheelEvent): boolean =>
+  event.ctrlKey ||
+  event.metaKey ||
+  Math.abs(event.deltaX) > Math.abs(event.deltaY)

src/components/MenuHamburger.vue

@@ -29,7 +29,7 @@ import { showNativeSystemMenu } from '@/utils/envUtil'
 
 const workspaceState = useWorkspaceStore()
 const settingStore = useSettingStore()
-function exitFocusMode() {
+const exitFocusMode = () => {
   workspaceState.focusMode = false
 }
 

src/components/TopMenuSection.test.ts

@@ -328,11 +328,11 @@ describe('TopMenuSection', () => {
   })
 
   describe('inline progress summary', () => {
-    function configureSettings(
+    const configureSettings = (
       pinia: ReturnType<typeof createTestingPinia>,
       qpoV2Enabled: boolean,
       showRunProgressBar = true
-    ) {
+    ) => {
       const settingStore = useSettingStore(pinia)
       vi.mocked(settingStore.get).mockImplementation((key) => {
         if (key === 'Comfy.Queue.QPOV2') return qpoV2Enabled
@@ -413,10 +413,10 @@ describe('TopMenuSection', () => {
   })
 
   describe(QueueNotificationBannerHost, () => {
-    function configureSettings(
+    const configureSettings = (
       pinia: ReturnType<typeof createTestingPinia>,
       qpoV2Enabled: boolean
-    ) {
+    ) => {
       const settingStore = useSettingStore(pinia)
       vi.mocked(settingStore.get).mockImplementation((key) => {
         if (key === 'Comfy.Queue.QPOV2') return qpoV2Enabled