[TS] Enable strict mode (#3136)

2026-03-08 06:30:04 +00:00 · 2025-03-18 22:57:17 -04:00
parent 44edec7ad2
commit a049e9ae2d
64 changed files with 924 additions and 781 deletions
--- a/src/components/common/ComfyImage.vue
+++ b/src/components/common/ComfyImage.vue
@@ -55,6 +55,7 @@ const classArray = computed(() => {
  } else if (typeof props.class === 'string') {
    return props.class.split(' ')
  } else if (typeof props.class === 'object') {
+    // @ts-expect-error fixme ts strict error
    return Object.keys(props.class).filter((key) => props.class[key])
  }
  return []
--- a/src/components/common/CustomizationDialog.vue
+++ b/src/components/common/CustomizationDialog.vue
@@ -98,12 +98,14 @@ const defaultIcon = iconOptions.find(
  (option) => option.value === nodeBookmarkStore.defaultBookmarkIcon
 )

+// @ts-expect-error fixme ts strict error
 const selectedIcon = ref<{ name: string; value: string }>(defaultIcon)
 const finalColor = ref(
  props.initialColor || nodeBookmarkStore.defaultBookmarkColor
 )

 const resetCustomization = () => {
+  // @ts-expect-error fixme ts strict error
  selectedIcon.value =
    iconOptions.find((option) => option.value === props.initialIcon) ||
    defaultIcon
--- a/src/components/common/ElectronFileDownload.vue
+++ b/src/components/common/ElectronFileDownload.vue
@@ -101,13 +101,16 @@ const fileSize = computed(() =>
  download.fileSize.value ? formatSize(download.fileSize.value) : '?'
 )
 const electronDownloadStore = useElectronDownloadStore()
+// @ts-expect-error fixme ts strict error
 const [savePath, filename] = props.label.split('/')

 electronDownloadStore.$subscribe((_, { downloads }) => {
  const download = downloads.find((download) => props.url === download.url)

  if (download) {
+    // @ts-expect-error fixme ts strict error
    downloadProgress.value = Number((download.progress * 100).toFixed(1))
+    // @ts-expect-error fixme ts strict error
    status.value = download.status
  }
 })
--- a/src/components/common/TreeExplorer.vue
+++ b/src/components/common/TreeExplorer.vue
@@ -170,18 +170,21 @@ const deleteCommand = async (node: RenderedTreeExplorerNode) => {
  await node.handleDelete?.()
  emit('nodeDelete', node)
 }
+// @ts-expect-error fixme ts strict error
 const menuItems = computed<MenuItem[]>(() =>
  [
    getAddFolderMenuItem(menuTargetNode.value),
    {
      label: t('g.rename'),
      icon: 'pi pi-file-edit',
+      // @ts-expect-error fixme ts strict error
      command: () => renameCommand(menuTargetNode.value),
      visible: menuTargetNode.value?.handleRename !== undefined
    },
    {
      label: t('g.delete'),
      icon: 'pi pi-trash',
+      // @ts-expect-error fixme ts strict error
      command: () => deleteCommand(menuTargetNode.value),
      visible: menuTargetNode.value?.handleDelete !== undefined,
      isAsync: true // The delete command can be async
@@ -189,6 +192,7 @@ const menuItems = computed<MenuItem[]>(() =>
    ...extraMenuItems.value
  ].map((menuItem) => ({
    ...menuItem,
+    // @ts-expect-error fixme ts strict error
    command: wrapCommandWithErrorHandler(menuItem.command, {
      isAsync: menuItem.isAsync ?? false
    })
@@ -226,6 +230,7 @@ defineExpose({
   * @param targetNodeKey - The key of the node where the folder will be added under
   */
  addFolderCommand: (targetNodeKey: string) => {
+    // @ts-expect-error fixme ts strict error
    addFolderCommand(findNodeByKey(renderedRoot.value, targetNodeKey))
  }
 })
--- a/src/components/common/tests/EditableText.spec.ts
+++ b/src/components/common/tests/EditableText.spec.ts
@@ -1,4 +1,3 @@
-// @ts-strict-ignore
 import { mount } from '@vue/test-utils'
 import PrimeVue from 'primevue/config'
 import InputText from 'primevue/inputtext'
@@ -14,6 +13,7 @@ describe('EditableText', () => {
    app.use(PrimeVue)
  })

+  // @ts-expect-error fixme ts strict error
  const mountComponent = (props, options = {}) => {
    return mount(EditableText, {
      global: {
@@ -65,6 +65,7 @@ describe('EditableText', () => {
    })
    await wrapper.findComponent(InputText).trigger('blur')
    expect(wrapper.emitted('edit')).toBeTruthy()
+    // @ts-expect-error fixme ts strict error
    expect(wrapper.emitted('edit')[0]).toEqual(['Test Text'])
  })
 })
--- a/src/components/common/tests/TreeExplorerTreeNode.spec.ts
+++ b/src/components/common/tests/TreeExplorerTreeNode.spec.ts
@@ -1,4 +1,3 @@
-// @ts-strict-ignore
 import { createTestingPinia } from '@pinia/testing'
 import { mount } from '@vue/test-utils'
 import Badge from 'primevue/badge'
@@ -59,6 +58,7 @@ describe('TreeExplorerTreeNode', () => {
    expect(wrapper.findComponent(EditableText).props('modelValue')).toBe(
      'Test Node'
    )
+    // @ts-expect-error fixme ts strict error
    expect(wrapper.findComponent(Badge).props()['value'].toString()).toBe('3')
  })

--- a/src/components/dialog/content/SettingDialogContent.vue
+++ b/src/components/dialog/content/SettingDialogContent.vue
@@ -157,7 +157,9 @@ const categories = computed<SettingTreeNode[]>(() =>
  ].map((node) => ({
    ...node,
    translatedLabel: t(
+      // @ts-expect-error fixme ts strict error
      `settingsCategories.${normalizeI18nKey(node.label)}`,
+      // @ts-expect-error fixme ts strict error
      node.label
    )
  }))
@@ -175,12 +177,16 @@ onMounted(() => {
 })

 const sortedGroups = (category: SettingTreeNode): ISettingGroup[] => {
-  return [...(category.children ?? [])]
-    .sort((a, b) => a.label.localeCompare(b.label))
-    .map((group) => ({
-      label: group.label,
-      settings: flattenTree<SettingParams>(group)
-    }))
+  // @ts-expect-error fixme ts strict error
+  return (
+    [...(category.children ?? [])]
+      // @ts-expect-error fixme ts strict error
+      .sort((a, b) => a.label.localeCompare(b.label))
+      .map((group) => ({
+        label: group.label,
+        settings: flattenTree<SettingParams>(group)
+      }))
+  )
 }

 const searchQuery = ref<string>('')
--- a/src/components/dialog/content/error/ReportIssuePanel.vue
+++ b/src/components/dialog/content/error/ReportIssuePanel.vue
@@ -4,7 +4,7 @@
    @submit="submit"
    :resolver="zodResolver(issueReportSchema)"
  >
-    <Panel :pt="$attrs.pt">
+    <Panel :pt="$attrs.pt as any">
      <template #header>
        <div class="flex items-center gap-2">
          <span class="font-bold">{{ title }}</span>
--- a/src/components/dialog/content/error/tests/ReportIssuePanel.spec.ts
+++ b/src/components/dialog/content/error/tests/ReportIssuePanel.spec.ts
@@ -1,4 +1,3 @@
-// @ts-strict-ignore
 import { Form } from '@primevue/forms'
 import { mount } from '@vue/test-utils'
 import Checkbox from 'primevue/checkbox'
@@ -95,12 +94,15 @@ vi.mock('@primevue/forms', () => ({
    },
    methods: {
      onSubmit() {
+        // @ts-expect-error fixme ts strict error
        this.$emit('submit', {
          valid: true,
+          // @ts-expect-error fixme ts strict error
          values: this.formValues
        })
      },
      updateFieldValue(name: string, value: any) {
+        // @ts-expect-error fixme ts strict error
        this.formValues[name] = value
      }
    }
@@ -116,13 +118,17 @@ vi.mock('@primevue/forms', () => ({
      }
    },
    methods: {
+      // @ts-expect-error fixme ts strict error
      updateValue(value) {
+        // @ts-expect-error fixme ts strict error
        this.modelValue = value
+        // @ts-expect-error fixme ts strict error
        let parent = this.$parent
        while (parent && parent.$options.name !== 'Form') {
          parent = parent.$parent
        }
        if (parent) {
+          // @ts-expect-error fixme ts strict error
          parent.updateFieldValue(this.name, value)
        }
      }
@@ -163,6 +169,7 @@ describe('ReportIssuePanel', () => {

    for (const field of DEFAULT_FIELDS) {
      const checkbox = checkboxes.find(
+        // @ts-expect-error fixme ts strict error
        (checkbox) => checkbox.props('value') === field
      )
      expect(checkbox).toBeDefined()
@@ -218,12 +225,11 @@ describe('ReportIssuePanel', () => {
    })

    // Filter out the contact preferences checkboxes
-    const fieldCheckboxes = wrapper
-      .findAllComponents(Checkbox)
-      .filter(
-        (checkbox) =>
-          !['followUp', 'notifyOnResolution'].includes(checkbox.props('value'))
-      )
+    const fieldCheckboxes = wrapper.findAllComponents(Checkbox).filter(
+      // @ts-expect-error fixme ts strict error
+      (checkbox) =>
+        !['followUp', 'notifyOnResolution'].includes(checkbox.props('value'))
+    )
    expect(fieldCheckboxes.length).toBe(1)
    expect(fieldCheckboxes.at(0)?.props('value')).toBe('Settings')
  })
@@ -235,6 +241,7 @@ describe('ReportIssuePanel', () => {
    })
    const customCheckbox = wrapper
      .findAllComponents(Checkbox)
+      // @ts-expect-error fixme ts strict error
      .find((checkbox) => checkbox.props('value') === 'CustomField')
    expect(customCheckbox).toBeDefined()
  })
--- a/src/components/dialog/content/setting/tests/SettingItem.spec.ts
+++ b/src/components/dialog/content/setting/tests/SettingItem.spec.ts
@@ -1,4 +1,3 @@
-// @ts-strict-ignore
 import { mount } from '@vue/test-utils'
 import { createPinia } from 'pinia'
 import PrimeVue from 'primevue/config'
--- a/src/components/graph/GraphCanvas.vue
+++ b/src/components/graph/GraphCanvas.vue
@@ -126,6 +126,7 @@ watch(
    for (const n of comfyApp.graph.nodes) {
      if (!n.widgets) continue
      for (const w of n.widgets) {
+        // @ts-expect-error fixme ts strict error
        if (w[IS_CONTROL_WIDGET]) {
          updateControlWidgetLabel(w)
          if (w.linkedWidgets) {
@@ -170,6 +171,7 @@ const loadCustomNodesI18n = async () => {

 const comfyAppReady = ref(false)
 const workflowPersistence = useWorkflowPersistence()
+// @ts-expect-error fixme ts strict error
 useCanvasDrop(canvasRef)
 useLitegraphSettings()

@@ -190,12 +192,15 @@ onMounted(async () => {
  CORE_SETTINGS.forEach((setting) => {
    settingStore.addSetting(setting)
  })
+  // @ts-expect-error fixme ts strict error
  await comfyApp.setup(canvasRef.value)
  canvasStore.canvas = comfyApp.canvas
  canvasStore.canvas.render_canvas_border = false
  workspaceStore.spinner = false

+  // @ts-expect-error fixme ts strict error
  window['app'] = comfyApp
+  // @ts-expect-error fixme ts strict error
  window['graph'] = comfyApp.graph

  comfyAppReady.value = true
--- a/src/components/load3d/Load3DControls.vue
+++ b/src/components/load3d/Load3DControls.vue
@@ -146,6 +146,7 @@ const getCategoryIcon = (category: string) => {
    camera: 'pi pi-camera',
    light: 'pi pi-sun'
  }
+  // @ts-expect-error fixme ts strict error
  return `${icons[category]} text-white text-lg`
 }

--- a/src/components/load3d/Load3DScene.vue
+++ b/src/components/load3d/Load3DScene.vue
@@ -95,6 +95,7 @@ watch(
    if (load3d.value) {
      const rawLoad3d = toRaw(load3d.value)

+      // @ts-expect-error fixme ts strict error
      rawLoad3d.setEdgeThreshold(newValue)
    }
  }
@@ -132,6 +133,7 @@ const handleEvents = (action: 'add' | 'remove') => {
 onMounted(() => {
  load3d.value = useLoad3dService().registerLoad3d(
    node.value as LGraphNode,
+    // @ts-expect-error fixme ts strict error
    container.value,
    props.type
  )
--- a/src/components/load3d/controls/ModelControls.vue
+++ b/src/components/load3d/controls/ModelControls.vue
@@ -169,6 +169,7 @@ watch(
 watch(
  () => props.edgeThreshold,
  (newValue) => {
+    // @ts-expect-error fixme ts strict error
    edgeThreshold.value = newValue
  }
 )
--- a/src/components/searchbox/NodeSearchBoxPopover.vue
+++ b/src/components/searchbox/NodeSearchBoxPopover.vue
@@ -94,6 +94,7 @@ const addNode = (nodeDef: ComfyNodeDefImpl) => {

  const eventDetail = triggerEvent.value?.detail
  if (eventDetail && eventDetail.subType === 'empty-release') {
+    // @ts-expect-error fixme ts strict error
    eventDetail.linkReleaseContext.links.forEach((link: ConnectingLink) => {
      ConnectingLinkImpl.createFromPlainObject(link).connectTo(node)
    })
@@ -121,6 +122,7 @@ const showSearchBox = (e: LiteGraphCanvasEvent) => {
      showNewSearchBox(e)
    }
  } else {
+    // @ts-expect-error fixme ts strict error
    canvasStore.canvas.showSearchBox(detail.originalEvent)
  }
 }
@@ -137,7 +139,9 @@ const showNewSearchBox = (e: LiteGraphCanvasEvent) => {
    const filter = nodeDefStore.nodeSearchService.getFilterById(
      firstLink.releaseSlotType
    )
+    // @ts-expect-error fixme ts strict error
    const dataType = firstLink.type.toString()
+    // @ts-expect-error fixme ts strict error
    addFilter([filter, dataType])
  }

@@ -180,6 +184,7 @@ const showContextMenu = (e: LiteGraphCanvasEvent) => {
        slotTo: firstLink.input,
        afterRerouteId: firstLink.afterRerouteId
      }
+  // @ts-expect-error fixme ts strict error
  canvasStore.canvas.showConnectionMenu({
    ...connectionOptions,
    ...commonOptions
--- a/src/components/sidebar/tabs/ModelLibrarySidebarTab.vue
+++ b/src/components/sidebar/tabs/ModelLibrarySidebarTab.vue
@@ -116,11 +116,13 @@ const renderedRoot = computed<TreeExplorerNode<ModelOrFolder>>(() => {

    return {
      key: node.key,
+      // @ts-expect-error fixme ts strict error
      label: model
        ? nameFormat === 'title'
          ? model.title
          : model.simplified_file_name
        : node.label,
+      // @ts-expect-error fixme ts strict error
      leaf: node.leaf,
      data: node.data,
      getIcon() {
@@ -134,6 +136,7 @@ const renderedRoot = computed<TreeExplorerNode<ModelOrFolder>>(() => {
        }
        return 'pi pi-folder'
      },
+      // @ts-expect-error fixme ts strict error
      getBadgeText() {
        // Return null to apply default badge text
        // Return empty string to hide badge
@@ -146,13 +149,16 @@ const renderedRoot = computed<TreeExplorerNode<ModelOrFolder>>(() => {
      draggable: node.leaf,
      handleClick(e: MouseEvent) {
        if (this.leaf) {
+          // @ts-expect-error fixme ts strict error
          const provider = modelToNodeStore.getNodeProvider(model.directory)
          if (provider) {
            const node = useLitegraphService().addNodeOnGraph(provider.nodeDef)
+            // @ts-expect-error fixme ts strict error
            const widget = node.widgets.find(
              (widget) => widget.name === provider.key
            )
            if (widget) {
+              // @ts-expect-error fixme ts strict error
              widget.value = model.file_name
            }
          }
--- a/src/components/sidebar/tabs/NodeLibrarySidebarTab.vue
+++ b/src/components/sidebar/tabs/NodeLibrarySidebarTab.vue
@@ -114,8 +114,10 @@ const renderedRoot = computed<TreeExplorerNode<ComfyNodeDefImpl>>(() => {
    return {
      key: node.key,
      label: node.leaf ? node.data.display_name : node.label,
+      // @ts-expect-error fixme ts strict error
      leaf: node.leaf,
      data: node.data,
+      // @ts-expect-error fixme ts strict error
      getIcon() {
        if (this.leaf) {
          return 'pi pi-circle-fill'
@@ -132,6 +134,7 @@ const renderedRoot = computed<TreeExplorerNode<ComfyNodeDefImpl>>(() => {
      },
      handleClick(e: MouseEvent) {
        if (this.leaf) {
+          // @ts-expect-error fixme ts strict error
          useLitegraphService().addNodeOnGraph(this.data)
        } else {
          toggleNodeOnEvent(e, this)
@@ -173,6 +176,7 @@ const handleSearch = (query: string) => {
  )

  nextTick(() => {
+    // @ts-expect-error fixme ts strict error
    expandNode(filteredRoot.value)
  })
 }
@@ -189,6 +193,7 @@ const onAddFilter = (filterAndValue: FilterAndValue) => {
  handleSearch(searchQuery.value)
 }

+// @ts-expect-error fixme ts strict error
 const onRemoveFilter = (filterAndValue) => {
  const index = filters.value.findIndex((f) => f === filterAndValue)
  if (index !== -1) {
--- a/src/components/sidebar/tabs/WorkflowsSidebarTab.vue
+++ b/src/components/sidebar/tabs/WorkflowsSidebarTab.vue
@@ -267,7 +267,9 @@ const renderTreeNode = (

  return {
    key: node.key,
+    // @ts-expect-error fixme ts strict error
    label: node.label,
+    // @ts-expect-error fixme ts strict error
    leaf: node.leaf,
    data: node.data,
    children,
--- a/src/components/sidebar/tabs/nodeLibrary/NodeBookmarkTreeExplorer.vue
+++ b/src/components/sidebar/tabs/nodeLibrary/NodeBookmarkTreeExplorer.vue
@@ -131,6 +131,7 @@ const renderedBookmarkedRoot = computed<TreeExplorerNode<ComfyNodeDefImpl>>(
      return {
        key: node.key,
        label: node.leaf ? node.data.display_name : node.label,
+        // @ts-expect-error fixme ts strict error
        leaf: node.leaf,
        data: node.data,
        getIcon() {
@@ -161,15 +162,19 @@ const renderedBookmarkedRoot = computed<TreeExplorerNode<ComfyNodeDefImpl>>(
        handleDrop(data: TreeExplorerDragAndDropData<ComfyNodeDefImpl>) {
          const nodeDefToAdd = data.data.data
          // Remove bookmark if the source is the top level bookmarked node.
+          // @ts-expect-error fixme ts strict error
          if (nodeBookmarkStore.isBookmarked(nodeDefToAdd)) {
+            // @ts-expect-error fixme ts strict error
            nodeBookmarkStore.toggleBookmark(nodeDefToAdd)
          }
          const folderNodeDef = node.data as ComfyNodeDefImpl
+          // @ts-expect-error fixme ts strict error
          const nodePath = folderNodeDef.category + '/' + nodeDefToAdd.name
          nodeBookmarkStore.addBookmark(nodePath)
        },
        handleClick(e: MouseEvent) {
          if (this.leaf) {
+            // @ts-expect-error fixme ts strict error
            useLitegraphService().addNodeOnGraph(this.data)
          } else {
            toggleNodeOnEvent(e, node)
@@ -185,6 +190,7 @@ const renderedBookmarkedRoot = computed<TreeExplorerNode<ComfyNodeDefImpl>>(
                }
              },
              handleDelete() {
+                // @ts-expect-error fixme ts strict error
                nodeBookmarkStore.deleteBookmarkFolder(this.data)
              }
            })