[TS] Require override keyword (#3746)

src/extensions/core/clipspace.ts

@@ -81,7 +81,7 @@ export class ClipspaceDialog extends ComfyDialog {
     super()
   }
 
-  createButtons() {
+  override createButtons() {
     const buttons = []
 
     for (let idx in ClipspaceDialog.items) {
@@ -177,7 +177,7 @@ export class ClipspaceDialog extends ComfyDialog {
     } else return []
   }
 
-  show() {
+  override show() {
     ClipspaceDialog.invalidate()
 
     this.element.style.display = 'block'

src/extensions/core/load3d/Load3dAnimation.ts

@@ -69,7 +69,10 @@ class Load3dAnimation extends Load3d {
     animate()
   }
 
-  async loadModel(url: string, originalFileName?: string): Promise<void> {
+  override async loadModel(
+    url: string,
+    originalFileName?: string
+  ): Promise<void> {
     await super.loadModel(url, originalFileName)
 
     if (this.modelManager.currentModel) {
@@ -80,7 +83,7 @@ class Load3dAnimation extends Load3d {
     }
   }
 
-  clearModel(): void {
+  override clearModel(): void {
     this.animationManager.dispose()
     super.clearModel()
   }
@@ -125,7 +128,7 @@ class Load3dAnimation extends Load3d {
     return this.animationManager.currentAnimation
   }
 
-  remove(): void {
+  override remove(): void {
     this.animationManager.dispose()
     super.remove()
   }

src/extensions/core/maskEditorOld.ts

@@ -165,7 +165,7 @@ export class MaskEditorDialogOld extends ComfyDialog {
     ])
   }
 
-  createButtons() {
+  override createButtons() {
     return []
   }
 
@@ -442,7 +442,7 @@ export class MaskEditorDialogOld extends ComfyDialog {
     maskCanvas.style.opacity = maskCanvasStyle.opacity.toString()
   }
 
-  async show() {
+  override async show() {
     this.zoom_ratio = 1.0
     this.pan_x = 0
     this.pan_y = 0

src/extensions/core/maskeditor.ts

@@ -869,7 +869,7 @@ class MaskEditorDialog extends ComfyDialog {
     return MaskEditorDialog.instance
   }
 
-  async show() {
+  override async show() {
     this.cleanup()
     if (!this.isLayoutCreated) {
       // layout

src/extensions/core/nodeTemplates.ts

@@ -61,7 +61,7 @@ class ManageTemplates extends ComfyDialog {
     }) as HTMLInputElement
   }
 
-  createButtons() {
+  override createButtons() {
     const btns = super.createButtons()
     btns[0].textContent = 'Close'
     btns[0].onclick = () => {
@@ -160,7 +160,7 @@ class ManageTemplates extends ComfyDialog {
     }, 0)
   }
 
-  show() {
+  override show() {
     // Show list of template names + delete button
     super.show(
       $el(

src/extensions/core/noteNode.ts

@@ -10,14 +10,14 @@ app.registerExtension({
   name: 'Comfy.NoteNode',
   registerCustomNodes() {
     class NoteNode extends LGraphNode {
-      static category: string
+      static override category: string
       static collapsable: boolean
       static title_mode: number
 
-      color = LGraphCanvas.node_colors.yellow.color
-      bgcolor = LGraphCanvas.node_colors.yellow.bgcolor
+      override color = LGraphCanvas.node_colors.yellow.color
+      override bgcolor = LGraphCanvas.node_colors.yellow.bgcolor
       groupcolor = LGraphCanvas.node_colors.yellow.groupcolor
-      isVirtualNode: boolean
+      override isVirtualNode: boolean
 
       constructor(title: string) {
         super(title)
@@ -51,10 +51,10 @@ app.registerExtension({
 
     /** Markdown variant of NoteNode */
     class MarkdownNoteNode extends LGraphNode {
-      static title = 'Markdown Note'
+      static override title = 'Markdown Note'
 
-      color = LGraphCanvas.node_colors.yellow.color
-      bgcolor = LGraphCanvas.node_colors.yellow.bgcolor
+      override color = LGraphCanvas.node_colors.yellow.color
+      override bgcolor = LGraphCanvas.node_colors.yellow.bgcolor
       groupcolor = LGraphCanvas.node_colors.yellow.groupcolor
 
       constructor(title: string) {

src/extensions/core/rerouteNode.ts

@@ -14,7 +14,7 @@ app.registerExtension({
     }
 
     class RerouteNode extends LGraphNode {
-      static category: string | undefined
+      static override category: string | undefined
       static defaultVisibility = false
 
       constructor(title?: string) {
@@ -277,7 +277,7 @@ app.registerExtension({
         )
         return []
       }
-      computeSize(): [number, number] {
+      override computeSize(): [number, number] {
         return [
           this.properties.showOutputText && this.outputs && this.outputs.length
             ? Math.max(

src/extensions/core/widgetInputs.ts

@@ -25,7 +25,7 @@ const replacePropertyName = 'Run widget replace on values'
 export class PrimitiveNode extends LGraphNode {
   controlValues?: any[]
   lastType?: string
-  static category: string
+  static override category: string
   constructor(title: string) {
     super(title)
     this.addOutput('connect to widget input', '*')
@@ -37,7 +37,7 @@ export class PrimitiveNode extends LGraphNode {
     }
   }
 
-  applyToGraph(extraLinks: LLink[] = []) {
+  override applyToGraph(extraLinks: LLink[] = []) {
     if (!this.outputs[0].links?.length) return
 
     const links = [
@@ -83,7 +83,7 @@ export class PrimitiveNode extends LGraphNode {
     }
   }
 
-  refreshComboInNode() {
+  override refreshComboInNode() {
     const widget = this.widgets?.[0]
     if (widget?.type === 'combo') {
       // @ts-expect-error fixme ts strict error
@@ -98,7 +98,7 @@ export class PrimitiveNode extends LGraphNode {
     }
   }
 
-  onAfterGraphConfigured() {
+  override onAfterGraphConfigured() {
     if (this.outputs[0].links?.length && !this.widgets?.length) {
       this.#onFirstConnection()
 
@@ -117,7 +117,11 @@ export class PrimitiveNode extends LGraphNode {
     }
   }
 
-  onConnectionsChange(_type: ISlotType, _index: number, connected: boolean) {
+  override onConnectionsChange(
+    _type: ISlotType,
+    _index: number,
+    connected: boolean
+  ) {
     if (app.configuringGraph) {
       // Dont run while the graph is still setting up
       return
@@ -138,7 +142,7 @@ export class PrimitiveNode extends LGraphNode {
     }
   }
 
-  onConnectOutput(
+  override onConnectOutput(
     slot: number,
     _type: string,
     input: INodeInputSlot,

src/scripts/api.ts

@@ -271,7 +271,7 @@ export class ComfyApi extends EventTarget {
     return fetch(this.apiURL(route), options)
   }
 
-  addEventListener<TEvent extends keyof ApiEvents>(
+  override addEventListener<TEvent extends keyof ApiEvents>(
     type: TEvent,
     callback: ((event: ApiEvents[TEvent]) => void) | null,
     options?: AddEventListenerOptions | boolean
@@ -281,7 +281,7 @@ export class ComfyApi extends EventTarget {
     this.#registered.add(type)
   }
 
-  removeEventListener<TEvent extends keyof ApiEvents>(
+  override removeEventListener<TEvent extends keyof ApiEvents>(
     type: TEvent,
     callback: ((event: ApiEvents[TEvent]) => void) | null,
     options?: EventListenerOptions | boolean
@@ -312,7 +312,7 @@ export class ComfyApi extends EventTarget {
   }
 
   /** @deprecated Use {@link dispatchCustomEvent}. */
-  dispatchEvent(event: never): boolean {
+  override dispatchEvent(event: never): boolean {
     return super.dispatchEvent(event)
   }
 

src/scripts/ui/components/asyncDialog.ts

@@ -22,7 +22,7 @@ export class ComfyAsyncDialog extends ComfyDialog<HTMLDialogElement> {
     )
   }
 
-  show(html: string | HTMLElement | HTMLElement[]) {
+  override show(html: string | HTMLElement | HTMLElement[]) {
     this.element.addEventListener('close', () => {
       this.close()
     })
@@ -47,7 +47,7 @@ export class ComfyAsyncDialog extends ComfyDialog<HTMLDialogElement> {
     })
   }
 
-  close(result = null) {
+  override close(result = null) {
     this.#resolve(result)
     this.element.close()
     super.close()

src/services/litegraphService.ts

@@ -57,8 +57,8 @@ export const useLitegraphService = () => {
   async function registerNodeDef(nodeId: string, nodeDefV1: ComfyNodeDefV1) {
     const node = class ComfyNode extends LGraphNode {
       static comfyClass: string
-      static title: string
-      static category: string
+      static override title: string
+      static override category: string
       static nodeData: ComfyNodeDefV1 & ComfyNodeDefV2
 
       /**

src/stores/workflowStore.ts

@@ -33,7 +33,7 @@ export class ComfyWorkflow extends UserFile {
     super(options.path, options.modified, options.size)
   }
 
-  get key() {
+  override get key() {
     return this.path.substring(ComfyWorkflow.basePath.length)
   }
 
@@ -45,15 +45,15 @@ export class ComfyWorkflow extends UserFile {
     return this.changeTracker?.initialState ?? null
   }
 
-  get isLoaded(): boolean {
+  override get isLoaded(): boolean {
     return this.changeTracker !== null
   }
 
-  get isModified(): boolean {
+  override get isModified(): boolean {
     return this._isModified
   }
 
-  set isModified(value: boolean) {
+  override set isModified(value: boolean) {
     this._isModified = value
   }
 
@@ -64,7 +64,7 @@ export class ComfyWorkflow extends UserFile {
    * @param force Whether to force loading the content even if it is already loaded.
    * @returns this
    */
-  async load({
+  override async load({
     force = false
   }: { force?: boolean } = {}): Promise<LoadedComfyWorkflow> {
     await super.load({ force })
@@ -85,13 +85,13 @@ export class ComfyWorkflow extends UserFile {
     return this as LoadedComfyWorkflow
   }
 
-  unload(): void {
+  override unload(): void {
     console.debug('unload workflow', this.path)
     this.changeTracker = null
     super.unload()
   }
 
-  async save() {
+  override async save() {
     this.content = JSON.stringify(this.activeState)
     // Force save to ensure the content is updated in remote storage incase
     // the isModified state is screwed by changeTracker.
@@ -106,7 +106,7 @@ export class ComfyWorkflow extends UserFile {
    * @param path The path to save the workflow to. Note: with 'workflows/' prefix.
    * @returns this
    */
-  async saveAs(path: string) {
+  override async saveAs(path: string) {
     this.content = JSON.stringify(this.activeState)
     return await super.saveAs(path)
   }

tsconfig.json

@@ -19,6 +19,7 @@
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
     "downlevelIteration": true,
+    "noImplicitOverride": true,
 
     /* AllowJs during migration phase */
     "allowJs": true,