[TS] Enable noUnusedLocals (#3108)

src/components/dialog/content/ExecutionErrorDialogContent.vue

@@ -174,18 +174,6 @@ const { copyToClipboard } = useCopyToClipboard()
 const copyReportToClipboard = async () => {
   await copyToClipboard(reportContent.value)
 }
-
-const openNewGithubIssue = async () => {
-  await copyReportToClipboard()
-  const issueTitle = encodeURIComponent(
-    `[Bug]: ${props.error.exception_type} in ${props.error.node_type}`
-  )
-  const issueBody = encodeURIComponent(
-    'The report has been copied to the clipboard. Please paste it here.'
-  )
-  const url = `https://github.com/${repoOwner}/${repoName}/issues/new?title=${issueTitle}&body=${issueBody}`
-  window.open(url, '_blank')
-}
 </script>
 
 <style scoped>

src/components/dialog/content/manager/PackStatusMessage.vue

@@ -18,13 +18,10 @@
 <script setup lang="ts">
 import Message from 'primevue/message'
 import { computed } from 'vue'
-import { useI18n } from 'vue-i18n'
 
 import { components } from '@/types/comfyRegistryTypes'
 import { VueSeverity } from '@/types/primeVueTypes'
 
-const { t } = useI18n()
-
 type PackVersionStatus = components['schemas']['NodeVersionStatus']
 type PackStatus = components['schemas']['NodeStatus']
 type Status = PackVersionStatus | PackStatus

src/components/graph/TitleEditor.vue

@@ -87,7 +87,7 @@ const canvasEventHandler = (event: LiteGraphCanvasEvent) => {
     }
 
     const group: LGraphGroup = event.detail.group
-    const [x, y] = group.pos
+    const [_, y] = group.pos
 
     const e = event.detail.originalEvent
     const relativeY = e.canvasY - y
@@ -101,7 +101,7 @@ const canvasEventHandler = (event: LiteGraphCanvasEvent) => {
     }
 
     const node: LGraphNode = event.detail.node
-    const [x, y] = node.pos
+    const [_, y] = node.pos
 
     const e = event.detail.originalEvent
     const relativeY = e.canvasY - y

src/components/load3d/Load3DControls.vue

@@ -165,26 +165,14 @@ const emit = defineEmits<{
 const backgroundColor = ref(props.backgroundColor)
 const showGrid = ref(props.showGrid)
 const showPreview = ref(props.showPreview)
-const colorPickerRef = ref<HTMLInputElement | null>(null)
 const lightIntensity = ref(props.lightIntensity)
 const upDirection = ref(props.upDirection || 'original')
 const materialMode = ref(props.materialMode || 'original')
-const showLightIntensity = ref(false)
 const showLightIntensityButton = ref(props.showLightIntensityButton)
 const fov = ref(props.fov)
-const showFOV = ref(false)
 const showFOVButton = ref(props.showFOVButton)
 const showPreviewButton = ref(props.showPreviewButton)
 const hasBackgroundImage = ref(props.hasBackgroundImage)
-const upDirections: UpDirection[] = [
-  'original',
-  '-x',
-  '+x',
-  '-y',
-  '+y',
-  '-z',
-  '+z'
-]
 const edgeThreshold = ref(props.edgeThreshold)
 
 const switchCamera = () => {
@@ -196,10 +184,6 @@ const togglePreview = () => {
   emit('togglePreview', showPreview.value)
 }
 
-const updateBackgroundColor = (color: string) => {
-  emit('updateBackgroundColor', color)
-}
-
 const handleToggleGrid = (value: boolean) => {
   emit('toggleGrid', value)
 }
@@ -228,22 +212,10 @@ const handleUpdateLightIntensity = (value: number) => {
   emit('updateLightIntensity', value)
 }
 
-const updateLightIntensity = () => {
-  emit('updateLightIntensity', lightIntensity.value)
-}
-
 const handleUpdateFOV = (value: number) => {
   emit('updateFOV', value)
 }
 
-const updateFOV = () => {
-  emit('updateFOV', fov.value)
-}
-
-const updateEdgeThreshold = () => {
-  emit('updateEdgeThreshold', edgeThreshold.value)
-}
-
 const closeSlider = (e: MouseEvent) => {
   const target = e.target as HTMLElement
 

src/components/maintenance/TaskListPanel.vue

@@ -60,7 +60,7 @@ const confirm = useConfirm()
 const taskStore = useMaintenanceTaskStore()
 
 // Properties
-const props = defineProps<{
+defineProps<{
   displayAsList: string
   filter: MaintenanceFilter
   isRefreshing: boolean

src/components/searchbox/NodeSearchBoxPopover.vue

@@ -202,7 +202,7 @@ const canvasEventHandler = (e: LiteGraphCanvasEvent) => {
     handleCanvasEmptyRelease(e)
   } else if (e.detail.subType === 'group-double-click') {
     const group = e.detail.group
-    const [x, y] = group.pos
+    const [_, y] = group.pos
     const relativeY = e.detail.originalEvent.canvasY - y
     // Show search box if the click is NOT on the title bar
     if (relativeY > group.titleHeight) {

src/components/sidebar/tabs/WorkflowsSidebarTab.vue

@@ -136,7 +136,6 @@ import SidebarTabTemplate from '@/components/sidebar/tabs/SidebarTabTemplate.vue
 import WorkflowTreeLeaf from '@/components/sidebar/tabs/workflows/WorkflowTreeLeaf.vue'
 import { useTreeExpansion } from '@/composables/useTreeExpansion'
 import { useWorkflowService } from '@/services/workflowService'
-import { useCommandStore } from '@/stores/commandStore'
 import { useSettingStore } from '@/stores/settingStore'
 import {
   useWorkflowBookmarkStore,
@@ -174,7 +173,6 @@ const handleSearch = (query: string) => {
   })
 }
 
-const commandStore = useCommandStore()
 const workflowStore = useWorkflowStore()
 const workflowService = useWorkflowService()
 const workspaceStore = useWorkspaceStore()

src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue

@@ -66,10 +66,6 @@ const sidebarLocation = computed<'left' | 'right'>(() =>
   settingStore.get('Comfy.Sidebar.Location')
 )
 
-const emit = defineEmits<{
-  (e: 'toggle-bookmark', value: ComfyNodeDefImpl): void
-}>()
-
 const toggleBookmark = () => {
   nodeBookmarkStore.toggleBookmark(nodeDef.value)
 }

src/components/templates/TemplateWorkflowCard.vue

@@ -80,7 +80,6 @@ import { useElementHover } from '@vueuse/core'
 import Card from 'primevue/card'
 import ProgressSpinner from 'primevue/progressspinner'
 import { computed, ref } from 'vue'
-import { useI18n } from 'vue-i18n'
 
 import AudioThumbnail from '@/components/templates/thumbnails/AudioThumbnail.vue'
 import CompareSliderThumbnail from '@/components/templates/thumbnails/CompareSliderThumbnail.vue'
@@ -101,8 +100,6 @@ const { sourceModule, categoryTitle, loading, template } = defineProps<{
   template: TemplateInfo
 }>()
 
-const { t } = useI18n()
-
 const cardRef = ref<HTMLElement | null>(null)
 const isHovered = useElementHover(cardRef)
 

src/extensions/core/clipspace.ts

@@ -178,7 +178,6 @@ export class ClipspaceDialog extends ComfyDialog {
   }
 
   show() {
-    const img_preview = document.getElementById('clipspace_preview')
     ClipspaceDialog.invalidate()
 
     this.element.style.display = 'block'

src/extensions/core/groupNode.ts

@@ -1,5 +1,5 @@
 // @ts-strict-ignore
-import { type LGraph, LGraphCanvas, LiteGraph } from '@comfyorg/litegraph'
+import { LGraphCanvas, LiteGraph } from '@comfyorg/litegraph'
 import { LGraphNode, type NodeId } from '@comfyorg/litegraph/dist/LGraphNode'
 
 import { t } from '@/i18n'
@@ -1044,7 +1044,7 @@ export class GroupNodeHandler {
     const onDrawForeground = node.onDrawForeground
     const groupData = this.groupData.nodeData
     node.onDrawForeground = function (ctx) {
-      const r = onDrawForeground?.apply?.(this, arguments)
+      onDrawForeground?.apply?.(this, arguments)
       if (
         +app.runningNodeId === this.id &&
         this.runningInternalNodeId !== null

src/extensions/core/load3d/CameraManager.ts

@@ -14,6 +14,7 @@ export class CameraManager implements CameraManagerInterface {
   orthographicCamera: THREE.OrthographicCamera
   activeCamera: THREE.Camera
 
+  // @ts-expect-error unused variable
   private renderer: THREE.WebGLRenderer
   private eventManager: EventManagerInterface
   private nodeStorage: NodeStorageInterface

src/extensions/core/load3d/ControlsManager.ts

@@ -9,7 +9,7 @@ import {
 
 export class ControlsManager implements ControlsManagerInterface {
   controls: OrbitControls
-
+  // @ts-expect-error unused variable
   private eventManager: EventManagerInterface
   private nodeStorage: NodeStorageInterface
   private camera: THREE.Camera

src/extensions/core/load3d/Load3DConfiguration.ts

@@ -2,7 +2,6 @@ import type { IWidget } from '@comfyorg/litegraph'
 
 import Load3d from '@/extensions/core/load3d/Load3d'
 import Load3dUtils from '@/extensions/core/load3d/Load3dUtils'
-import { MaterialMode } from '@/extensions/core/load3d/interfaces'
 import { api } from '@/scripts/api'
 
 class Load3DConfiguration {

src/extensions/core/load3d/LoaderManager.ts

@@ -1,6 +1,6 @@
 import * as THREE from 'three'
 import { FBXLoader } from 'three/examples/jsm/loaders/FBXLoader'
-import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'
+import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'
 import { MTLLoader } from 'three/examples/jsm/loaders/MTLLoader'
 import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader'
 import { STLLoader } from 'three/examples/jsm/loaders/STLLoader'

src/extensions/core/load3d/PreviewManager.ts

@@ -17,6 +17,7 @@ export class PreviewManager implements PreviewManagerInterface {
   private getControls: () => OrbitControls
   private eventManager: EventManagerInterface
 
+  // @ts-expect-error unused variable
   private getRenderer: () => THREE.WebGLRenderer
 
   private previewBackgroundScene: THREE.Scene

src/extensions/core/load3d/SceneManager.ts

@@ -17,6 +17,7 @@ export class SceneManager implements SceneManagerInterface {
   private renderer: THREE.WebGLRenderer
 
   private getActiveCamera: () => THREE.Camera
+  // @ts-expect-error unused variable
   private getControls: () => OrbitControls
 
   constructor(

src/extensions/core/load3d/ViewHelperManager.ts

@@ -11,6 +11,7 @@ export class ViewHelperManager implements ViewHelperManagerInterface {
   private getActiveCamera: () => THREE.Camera
   private getControls: () => OrbitControls
   private nodeStorage: NodeStorageInterface
+  // @ts-expect-error unused variable
   private renderer: THREE.WebGLRenderer
 
   constructor(

src/extensions/core/maskEditorOld.ts

@@ -18,22 +18,6 @@ function dataURLToBlob(dataURL) {
   return new Blob([arrayBuffer], { type: contentType })
 }
 
-function loadedImageToBlob(image) {
-  const canvas = document.createElement('canvas')
-
-  canvas.width = image.width
-  canvas.height = image.height
-
-  const ctx = canvas.getContext('2d')
-
-  ctx.drawImage(image, 0, 0)
-
-  const dataURL = canvas.toDataURL('image/png', 1)
-  const blob = dataURLToBlob(dataURL)
-
-  return blob
-}
-
 function loadImage(imagePath) {
   return new Promise((resolve, reject) => {
     const image = new Image()
@@ -526,8 +510,6 @@ export class MaskEditorDialogOld extends ComfyDialog {
     maskCtx.clearRect(0, 0, this.maskCanvas.width, this.maskCanvas.height)
 
     // image load
-    const filepath = ComfyApp.clipspace.images
-
     const alpha_url = new URL(
       ComfyApp.clipspace.imgs[ComfyApp.clipspace['selectedIndex']].src
     )

src/extensions/core/maskeditor.ts

@@ -821,8 +821,11 @@ class MaskEditorDialog extends ComfyDialog {
 
   //new
   private uiManager!: UIManager
+  // @ts-expect-error unused variable
   private toolManager!: ToolManager
+  // @ts-expect-error unused variable
   private panAndZoomManager!: PanAndZoomManager
+  // @ts-expect-error unused variable
   private brushTool!: BrushTool
   private paintBucketTool!: PaintBucketTool
   private colorSelectTool!: ColorSelectTool
@@ -1190,6 +1193,7 @@ class MaskEditorDialog extends ComfyDialog {
 }
 
 class CanvasHistory {
+  // @ts-expect-error unused variable
   private maskEditor!: MaskEditorDialog
   private messageBroker!: MessageBroker
 
@@ -1542,6 +1546,7 @@ class PaintBucketTool {
 }
 
 class ColorSelectTool {
+  // @ts-expect-error unused variable
   private maskEditor!: MaskEditorDialog
   private messageBroker!: MessageBroker
   private width: number | null = null
@@ -2329,9 +2334,6 @@ class BrushTool {
     const cappedDeltaY = Math.max(-100, Math.min(100, finalDeltaY))
 
     // Rest of the function remains the same
-    const sizeDelta = cappedDeltaX / 40
-    const hardnessDelta = cappedDeltaY / 800
-
     const newSize = Math.max(
       1,
       Math.min(
@@ -2450,90 +2452,6 @@ class BrushTool {
     }
   }
 
-  private calculateCubicSplinePoints(
-    points: Point[],
-    numSegments: number = 10
-  ): Point[] {
-    const result: Point[] = []
-
-    const xCoords = points.map((p) => p.x)
-    const yCoords = points.map((p) => p.y)
-
-    const xDerivatives = this.calculateSplineCoefficients(xCoords)
-    const yDerivatives = this.calculateSplineCoefficients(yCoords)
-
-    // Generate points along the spline
-    for (let i = 0; i < points.length - 1; i++) {
-      const p0 = points[i]
-      const p1 = points[i + 1]
-      const d0x = xDerivatives[i]
-      const d1x = xDerivatives[i + 1]
-      const d0y = yDerivatives[i]
-      const d1y = yDerivatives[i + 1]
-
-      for (let t = 0; t <= numSegments; t++) {
-        const t_normalized = t / numSegments
-
-        // Hermite basis functions
-        const h00 = 2 * t_normalized ** 3 - 3 * t_normalized ** 2 + 1
-        const h10 = t_normalized ** 3 - 2 * t_normalized ** 2 + t_normalized
-        const h01 = -2 * t_normalized ** 3 + 3 * t_normalized ** 2
-        const h11 = t_normalized ** 3 - t_normalized ** 2
-
-        const x = h00 * p0.x + h10 * d0x + h01 * p1.x + h11 * d1x
-        const y = h00 * p0.y + h10 * d0y + h01 * p1.y + h11 * d1y
-
-        result.push({ x, y })
-      }
-    }
-
-    return result
-  }
-
-  private generateEvenlyDistributedPoints(
-    splinePoints: Point[],
-    numPoints: number
-  ): Point[] {
-    const distances: number[] = [0]
-    for (let i = 1; i < splinePoints.length; i++) {
-      const dx = splinePoints[i].x - splinePoints[i - 1].x
-      const dy = splinePoints[i].y - splinePoints[i - 1].y
-      const dist = Math.hypot(dx, dy)
-      distances.push(distances[i - 1] + dist)
-    }
-
-    const totalLength = distances[distances.length - 1]
-    const interval = totalLength / (numPoints - 1)
-    const result: Point[] = []
-    let currentIndex = 0
-
-    for (let i = 0; i < numPoints; i++) {
-      const targetDistance = i * interval
-
-      while (
-        currentIndex < distances.length - 1 &&
-        distances[currentIndex + 1] < targetDistance
-      ) {
-        currentIndex++
-      }
-
-      const t =
-        (targetDistance - distances[currentIndex]) /
-        (distances[currentIndex + 1] - distances[currentIndex])
-
-      const x =
-        splinePoints[currentIndex].x +
-        t * (splinePoints[currentIndex + 1].x - splinePoints[currentIndex].x)
-      const y =
-        splinePoints[currentIndex].y +
-        t * (splinePoints[currentIndex + 1].y - splinePoints[currentIndex].y)
-
-      result.push({ x, y })
-    }
-
-    return result
-  }
-
   private generateEquidistantPoints(
     points: Point[],
     distance: number
@@ -2582,45 +2500,6 @@ class BrushTool {
     return result
   }
 
-  private calculateSplineCoefficients(values: number[]): number[] {
-    const n = values.length - 1
-    const matrix: number[][] = new Array(n + 1)
-      .fill(0)
-      .map(() => new Array(n + 1).fill(0))
-    const rhs: number[] = new Array(n + 1).fill(0)
-
-    // Set up tridiagonal matrix
-    for (let i = 1; i < n; i++) {
-      matrix[i][i - 1] = 1
-      matrix[i][i] = 4
-      matrix[i][i + 1] = 1
-      rhs[i] = 3 * (values[i + 1] - values[i - 1])
-    }
-
-    // Set boundary conditions (natural spline)
-    matrix[0][0] = 2
-    matrix[0][1] = 1
-    matrix[n][n - 1] = 1
-    matrix[n][n] = 2
-    rhs[0] = 3 * (values[1] - values[0])
-    rhs[n] = 3 * (values[n] - values[n - 1])
-
-    // Solve tridiagonal system using Thomas algorithm
-    for (let i = 1; i <= n; i++) {
-      const m = matrix[i][i - 1] / matrix[i - 1][i - 1]
-      matrix[i][i] -= m * matrix[i - 1][i]
-      rhs[i] -= m * rhs[i - 1]
-    }
-
-    const solution: number[] = new Array(n + 1)
-    solution[n] = rhs[n] / matrix[n][n]
-    for (let i = n - 1; i >= 0; i--) {
-      solution[i] = (rhs[i] - matrix[i][i + 1] * solution[i + 1]) / matrix[i][i]
-    }
-
-    return solution
-  }
-
   private setBrushSize(size: number) {
     this.brushSettings.size = size
     saveBrushToCache('maskeditor_brush_settings', this.brushSettings)
@@ -2658,13 +2537,16 @@ class UIManager {
   private brushSettingsHTML!: HTMLDivElement
   private paintBucketSettingsHTML!: HTMLDivElement
   private colorSelectSettingsHTML!: HTMLDivElement
+  // @ts-expect-error unused variable
   private maskOpacitySlider!: HTMLInputElement
   private brushHardnessSlider!: HTMLInputElement
   private brushSizeSlider!: HTMLInputElement
+  // @ts-expect-error unused variable
   private brushOpacitySlider!: HTMLInputElement
   private sidebarImage!: HTMLImageElement
   private saveButton!: HTMLButtonElement
   private toolPanel!: HTMLDivElement
+  // @ts-expect-error unused variable
   private sidePanel!: HTMLDivElement
   private pointerZone!: HTMLDivElement
   private canvasBackground!: HTMLDivElement
@@ -3817,7 +3699,7 @@ class UIManager {
 
   private async createBrush() {
     var brush = document.createElement('div')
-    const brushSettings = await this.messageBroker.pull('brushSettings')
+    await this.messageBroker.pull('brushSettings')
     brush.id = 'maskEditor_brush'
 
     var brush_preview_gradient = document.createElement('div')
@@ -4741,7 +4623,7 @@ class PanAndZoomManager {
   }
 
   private handlePanStart(event: PointerEvent) {
-    let coords_canvas = this.messageBroker.pull('screenToCanvas', {
+    this.messageBroker.pull('screenToCanvas', {
       x: event.offsetX,
       y: event.offsetY
     })
@@ -4947,6 +4829,7 @@ class MessageBroker {
 
 class KeyboardManager {
   private keysDown: string[] = []
+  // @ts-expect-error unused variable
   private maskEditor: MaskEditorDialog
   private messageBroker: MessageBroker
 
@@ -4995,24 +4878,6 @@ class KeyboardManager {
   private isKeyDown(key: string) {
     return this.keysDown.includes(key)
   }
-
-  // combinations
-
-  private undoCombinationPressed() {
-    const combination = ['ctrl', 'z']
-    const keysDownLower = this.keysDown.map((key) => key.toLowerCase())
-    const result = combination.every((key) => keysDownLower.includes(key))
-    if (result) this.messageBroker.publish('undo')
-    return result
-  }
-
-  private redoCombinationPressed() {
-    const combination = ['ctrl', 'shift', 'z']
-    const keysDownLower = this.keysDown.map((key) => key.toLowerCase())
-    const result = combination.every((key) => keysDownLower.includes(key))
-    if (result) this.messageBroker.publish('redo')
-    return result
-  }
 }
 
 app.registerExtension({

src/extensions/core/widgetInputs.ts

@@ -7,7 +7,6 @@ import type {
   ISlotType,
   IWidget,
   LLink,
-  LiteGraphCanvasEvent,
   Vector2
 } from '@comfyorg/litegraph'
 import type { CanvasMouseEvent } from '@comfyorg/litegraph/dist/types/events'

src/scripts/app.ts

@@ -1237,9 +1237,7 @@ export class ComfyApp {
       let message = error.response.error.message
       if (error.response.error.details)
         message += ': ' + error.response.error.details
-      for (const [nodeID, nodeError] of Object.entries(
-        error.response.node_errors
-      )) {
+      for (const [_, nodeError] of Object.entries(error.response.node_errors)) {
         // @ts-expect-error
         message += '\n' + nodeError.class_type + ':'
         // @ts-expect-error

src/scripts/metadata/flac.ts

@@ -48,6 +48,7 @@ function parseVorbisComment(dataView: DataView): Record<string, string> {
   let offset = 0
   const vendorLength = dataView.getUint32(offset, true)
   offset += 4
+  // @ts-expect-error unused variable
   const vendorString = getString(dataView, offset, vendorLength)
   offset += vendorLength
 

src/scripts/pnginfo.ts

@@ -68,16 +68,6 @@ function parseExifData(exifData) {
   return ifdData
 }
 
-function splitValues(input) {
-  var output = {}
-  for (var key in input) {
-    var value = input[key]
-    var splitValues = value.split(':', 2)
-    output[splitValues[0]] = splitValues[1]
-  }
-  return output
-}
-
 export function getWebpMetadata(file) {
   return new Promise<Record<string, string>>((r) => {
     const reader = new FileReader()

src/scripts/ui.ts

@@ -108,7 +108,7 @@ function dragElement(dragEl, settings): () => void {
   }
 
   // When the element resizes (e.g. view queue) ensure it is still in the windows bounds
-  const resizeObserver = new ResizeObserver(() => {
+  new ResizeObserver(() => {
     ensureInBounds()
   }).observe(dragEl)
 

src/scripts/ui/dialog.ts

@@ -1,6 +1,4 @@
 // @ts-strict-ignore
-import { useDialogStore } from '@/stores/dialogStore'
-
 import { $el } from '../ui'
 
 export class ComfyDialog<

tests-ui/tests/composables/widgets/useRemoteWidget.test.ts

@@ -75,8 +75,6 @@ async function getResolvedValue(hook: ReturnType<typeof useRemoteWidget>) {
 }
 
 describe('useRemoteWidget', () => {
-  let mockConfig: RemoteWidgetConfig
-
   beforeEach(() => {
     vi.clearAllMocks()
     // Reset mocks
@@ -85,8 +83,6 @@ describe('useRemoteWidget', () => {
     vi.spyOn(Map.prototype, 'get').mockClear()
     vi.spyOn(Map.prototype, 'set').mockClear()
     vi.spyOn(Map.prototype, 'delete').mockClear()
-
-    mockConfig = createMockConfig()
   })
 
   afterEach(() => {

tsconfig.json

@@ -15,7 +15,7 @@
 
     /* Linting */
     "strict": false,
-    "noUnusedLocals": false,
+    "noUnusedLocals": true,
     "noUnusedParameters": false,
     "noFallthroughCasesInSwitch": true,
     "downlevelIteration": true,