[eslint] Prefer TypeScript interface over type aliases.

We have a mix of `type` and `interface` usage throughout our codebase,
that is sometimes difficult to follow and reason about. We should follow
the suggestion from the TypeScript PM and use `interface` consistently
where possible. This leads to better type display in errors and makes
our codebase easier to read (b/c consistency).

This CL adds the `@typescript-eslint/consistent-type-definitions`
ESLint rule to accomplish this.

Fixed: 387237537
Change-Id: Idb9e8275ddd8f633021d6cf1c933e2e55f980e45
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6152576
Auto-Submit: Nikolay Vitkov <[email protected]>
Commit-Queue: Benedikt Meurer <[email protected]>
Reviewed-by: Benedikt Meurer <[email protected]>

Author: Lightning00Blade

eslint.config.mjs

@@ -453,6 +453,8 @@ export default [
         },
       ],
 
+      '@typescript-eslint/consistent-type-definitions': ['error', 'interface'],
+
       'rulesdir/no-underscored-properties': 'error',
       'rulesdir/prefer-readonly-keyword': 'error',
       'rulesdir/inline-type-imports': 'error',

front_end/core/common/Console.ts

@@ -78,9 +78,9 @@ export const enum Events {
   MESSAGE_ADDED = 'messageAdded',
 }
 
-export type EventTypes = {
-  [Events.MESSAGE_ADDED]: Message,
-};
+export interface EventTypes {
+  [Events.MESSAGE_ADDED]: Message;
+}
 
 export const enum MessageLevel {
   INFO = 'info',

front_end/core/common/EventTarget.test.ts

@@ -16,13 +16,13 @@ const enum Events {
   UNION_EVENT = 'UnionEvent',
 }
 
-type TestEvents = {
-  [Events.VOID_EVENT]: void,
-  [Events.NUMBER_EVENT]: number,
-  [Events.KEY_VALUE_EVENT]: {key: string, value: number},
-  [Events.BOOLEAN_EVENT]: boolean,
-  [Events.UNION_EVENT]: string|null,
-};
+interface TestEvents {
+  [Events.VOID_EVENT]: void;
+  [Events.NUMBER_EVENT]: number;
+  [Events.KEY_VALUE_EVENT]: {key: string, value: number};
+  [Events.BOOLEAN_EVENT]: boolean;
+  [Events.UNION_EVENT]: string|null;
+}
 
 class TypedEventEmitter extends Common.ObjectWrapper.ObjectWrapper<TestEvents> {
   testValidArgumentTypes() {

front_end/core/common/EventTarget.ts

@@ -22,10 +22,10 @@ export function removeEventListeners(eventList: EventDescriptor[]): void {
 
 // This type can be used as the type parameter for `EventTarget`/`ObjectWrapper`
 // when the set of events is not known at compile time.
-export type GenericEvents = {
+export interface GenericEvents {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  [eventName: string]: any,
-};
+  [eventName: string]: any;
+}
 
 export type EventPayloadToRestParameters<Events, T extends keyof Events> = Events[T] extends void ? [] : [Events[T]];
 export type EventListener<Events, T extends keyof Events> = (arg0: EventTargetEvent<Events[T], Events>) => void;

front_end/core/host/AidaClient.ts

@@ -495,6 +495,6 @@ export const enum Events {
   AIDA_AVAILABILITY_CHANGED = 'aidaAvailabilityChanged',
 }
 
-export type EventTypes = {
-  [Events.AIDA_AVAILABILITY_CHANGED]: void,
-};
+export interface EventTypes {
+  [Events.AIDA_AVAILABILITY_CHANGED]: void;
+}

front_end/core/host/InspectorFrontendHostAPI.ts

@@ -204,36 +204,36 @@ export interface KeyDownEvent {
 // `EventTypes` is not used at runtime.
 // Please note that the "dispatch" side can't be type-checked as the dispatch is
 // done dynamically.
-export type EventTypes = {
-  [Events.AppendedToURL]: Platform.DevToolsPath.RawPathString|Platform.DevToolsPath.UrlString,
-  [Events.CanceledSaveURL]: Platform.DevToolsPath.UrlString,
-  [Events.ColorThemeChanged]: void,
-  [Events.ContextMenuCleared]: void,
-  [Events.ContextMenuItemSelected]: number,
-  [Events.DeviceCountUpdated]: number,
-  [Events.DevicesDiscoveryConfigChanged]: Adb.Config,
-  [Events.DevicesPortForwardingStatusChanged]: void,
-  [Events.DevicesUpdated]: void,
-  [Events.DispatchMessage]: string,
-  [Events.DispatchMessageChunk]: DispatchMessageChunkEvent,
-  [Events.EnterInspectElementMode]: void,
-  [Events.EyeDropperPickedColor]: EyeDropperPickedColorEvent,
-  [Events.FileSystemsLoaded]: DevToolsFileSystem[],
-  [Events.FileSystemRemoved]: Platform.DevToolsPath.RawPathString,
-  [Events.FileSystemAdded]: FileSystemAddedEvent,
-  [Events.FileSystemFilesChangedAddedRemoved]: FilesChangedEvent,
-  [Events.IndexingTotalWorkCalculated]: IndexingTotalWorkCalculatedEvent,
-  [Events.IndexingWorked]: IndexingWorkedEvent,
-  [Events.IndexingDone]: IndexingEvent,
-  [Events.KeyEventUnhandled]: KeyEventUnhandledEvent,
-  [Events.ReloadInspectedPage]: boolean,
-  [Events.RevealSourceLine]: RevealSourceLineEvent,
-  [Events.SavedURL]: SavedURLEvent,
-  [Events.SearchCompleted]: SearchCompletedEvent,
-  [Events.SetInspectedTabId]: string,
-  [Events.SetUseSoftMenu]: boolean,
-  [Events.ShowPanel]: string,
-};
+export interface EventTypes {
+  [Events.AppendedToURL]: Platform.DevToolsPath.RawPathString|Platform.DevToolsPath.UrlString;
+  [Events.CanceledSaveURL]: Platform.DevToolsPath.UrlString;
+  [Events.ColorThemeChanged]: void;
+  [Events.ContextMenuCleared]: void;
+  [Events.ContextMenuItemSelected]: number;
+  [Events.DeviceCountUpdated]: number;
+  [Events.DevicesDiscoveryConfigChanged]: Adb.Config;
+  [Events.DevicesPortForwardingStatusChanged]: void;
+  [Events.DevicesUpdated]: void;
+  [Events.DispatchMessage]: string;
+  [Events.DispatchMessageChunk]: DispatchMessageChunkEvent;
+  [Events.EnterInspectElementMode]: void;
+  [Events.EyeDropperPickedColor]: EyeDropperPickedColorEvent;
+  [Events.FileSystemsLoaded]: DevToolsFileSystem[];
+  [Events.FileSystemRemoved]: Platform.DevToolsPath.RawPathString;
+  [Events.FileSystemAdded]: FileSystemAddedEvent;
+  [Events.FileSystemFilesChangedAddedRemoved]: FilesChangedEvent;
+  [Events.IndexingTotalWorkCalculated]: IndexingTotalWorkCalculatedEvent;
+  [Events.IndexingWorked]: IndexingWorkedEvent;
+  [Events.IndexingDone]: IndexingEvent;
+  [Events.KeyEventUnhandled]: KeyEventUnhandledEvent;
+  [Events.ReloadInspectedPage]: boolean;
+  [Events.RevealSourceLine]: RevealSourceLineEvent;
+  [Events.SavedURL]: SavedURLEvent;
+  [Events.SearchCompleted]: SearchCompletedEvent;
+  [Events.SetInspectedTabId]: string;
+  [Events.SetUseSoftMenu]: boolean;
+  [Events.ShowPanel]: string;
+}
 
 export interface InspectorFrontendHostAPI {
   addFileSystem(type?: string): void;

front_end/core/i18n/i18nTypes.ts

@@ -2,9 +2,9 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-export type Values = {
-  [key: string]: string|boolean|number,
-};
+export interface Values {
+  [key: string]: string|boolean|number;
+}
 
 export interface SerializedMessage {
   string: string;

front_end/core/platform/ServerTiming.ts

@@ -29,14 +29,14 @@ const defaultWarningMessages: ServerTimingParsingWarningMessage = {
   },
 };
 
-export type ServerTimingParsingWarningMessage = {
-  deprecratedSyntax: () => string,
-  duplicateParameter: (parameter: string) => string,
-  noValueFoundForParameter: (parameter: string) => string,
-  unrecognizedParameter: (parameter: string) => string,
-  extraneousTrailingCharacters: () => string,
-  unableToParseValue: (parameter: string, value: string) => string,
-};
+export interface ServerTimingParsingWarningMessage {
+  deprecratedSyntax: () => string;
+  duplicateParameter: (parameter: string) => string;
+  noValueFoundForParameter: (parameter: string) => string;
+  unrecognizedParameter: (parameter: string) => string;
+  extraneousTrailingCharacters: () => string;
+  unableToParseValue: (parameter: string, value: string) => string;
+}
 
 export class ServerTiming {
   metric: string;

front_end/core/protocol_client/InspectorBackend.ts

@@ -39,10 +39,10 @@ export const DevToolsStubErrorCode = -32015;
 const GenericErrorCode = -32000;
 const ConnectionClosedErrorCode = -32001;
 
-type MessageParams = {
+interface MessageParams {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  [x: string]: any,
-};
+  [x: string]: any;
+}
 
 type ProtocolDomainName = ProtocolProxyApi.ProtocolDomainName;
 
@@ -52,15 +52,15 @@ export interface MessageError {
   data?: string|null;
 }
 
-export type Message = {
-  sessionId?: string,
-  url?: Platform.DevToolsPath.UrlString,
-  id?: number,
-  error?: MessageError|null,
-  result?: Object|null,
-  method?: QualifiedName,
-  params?: MessageParams|null,
-};
+export interface Message {
+  sessionId?: string;
+  url?: Platform.DevToolsPath.UrlString;
+  id?: number;
+  error?: MessageError|null;
+  result?: Object|null;
+  method?: QualifiedName;
+  params?: MessageParams|null;
+}
 
 interface EventMessage extends Message {
   method: QualifiedName;

front_end/core/sdk/AccessibilityModel.ts

@@ -196,9 +196,9 @@ export const enum Events {
   TREE_UPDATED = 'TreeUpdated',
 }
 
-export type EventTypes = {
-  [Events.TREE_UPDATED]: {root?: AccessibilityNode},
-};
+export interface EventTypes {
+  [Events.TREE_UPDATED]: {root?: AccessibilityNode};
+}
 
 export class AccessibilityModel extends SDKModel<EventTypes> implements ProtocolProxyApi.AccessibilityDispatcher {
   agent: ProtocolProxyApi.AccessibilityApi;

front_end/core/sdk/AnimationModel.ts

@@ -478,11 +478,11 @@ export enum Events {
   /* eslint-enable @typescript-eslint/naming-convention */
 }
 
-export type EventTypes = {
-  [Events.AnimationGroupStarted]: AnimationGroup,
-  [Events.AnimationGroupUpdated]: AnimationGroup,
-  [Events.ModelReset]: void,
-};
+export interface EventTypes {
+  [Events.AnimationGroupStarted]: AnimationGroup;
+  [Events.AnimationGroupUpdated]: AnimationGroup;
+  [Events.ModelReset]: void;
+}
 
 export class AnimationImpl {
   readonly #animationModel: AnimationModel;

front_end/core/sdk/AutofillModel.ts

@@ -175,6 +175,6 @@ export interface AddressFormFilledEvent {
   event: Protocol.Autofill.AddressFormFilledEvent;
 }
 
-export type EventTypes = {
-  [Events.ADDRESS_FORM_FILLED]: AddressFormFilledEvent,
-};
+export interface EventTypes {
+  [Events.ADDRESS_FORM_FILLED]: AddressFormFilledEvent;
+}

front_end/core/sdk/CPUProfilerModel.ts

@@ -165,10 +165,10 @@ export const enum Events {
   CONSOLE_PROFILE_FINISHED = 'ConsoleProfileFinished',
 }
 
-export type EventTypes = {
-  [Events.CONSOLE_PROFILE_STARTED]: EventData,
-  [Events.CONSOLE_PROFILE_FINISHED]: ProfileFinishedData,
-};
+export interface EventTypes {
+  [Events.CONSOLE_PROFILE_STARTED]: EventData;
+  [Events.CONSOLE_PROFILE_FINISHED]: ProfileFinishedData;
+}
 
 SDKModel.register(CPUProfilerModel, {capabilities: Capability.JS, autostart: true});
 

front_end/core/sdk/CPUThrottlingManager.ts

@@ -123,10 +123,10 @@ export const enum Events {
   HARDWARE_CONCURRENCY_CHANGED = 'HardwareConcurrencyChanged',
 }
 
-export type EventTypes = {
-  [Events.RATE_CHANGED]: number,
-  [Events.HARDWARE_CONCURRENCY_CHANGED]: number,
-};
+export interface EventTypes {
+  [Events.RATE_CHANGED]: number;
+  [Events.HARDWARE_CONCURRENCY_CHANGED]: number;
+}
 
 export function throttlingManager(): CPUThrottlingManager {
   return CPUThrottlingManager.instance();

front_end/core/sdk/CSSModel.ts

@@ -927,17 +927,17 @@ export interface ComputedStyleUpdatedEvent {
   nodeId: Protocol.DOM.NodeId;
 }
 
-export type EventTypes = {
-  [Events.FontsUpdated]: void,
-  [Events.MediaQueryResultChanged]: void,
-  [Events.ModelWasEnabled]: void,
-  [Events.ModelDisposed]: CSSModel,
-  [Events.PseudoStateForced]: PseudoStateForcedEvent,
-  [Events.StyleSheetAdded]: CSSStyleSheetHeader,
-  [Events.StyleSheetChanged]: StyleSheetChangedEvent,
-  [Events.StyleSheetRemoved]: CSSStyleSheetHeader,
-  [Events.ComputedStyleUpdated]: ComputedStyleUpdatedEvent,
-};
+export interface EventTypes {
+  [Events.FontsUpdated]: void;
+  [Events.MediaQueryResultChanged]: void;
+  [Events.ModelWasEnabled]: void;
+  [Events.ModelDisposed]: CSSModel;
+  [Events.PseudoStateForced]: PseudoStateForcedEvent;
+  [Events.StyleSheetAdded]: CSSStyleSheetHeader;
+  [Events.StyleSheetChanged]: StyleSheetChangedEvent;
+  [Events.StyleSheetRemoved]: CSSStyleSheetHeader;
+  [Events.ComputedStyleUpdated]: ComputedStyleUpdatedEvent;
+}
 
 const PseudoStateMarker = 'pseudo-state-marker';
 
@@ -1076,9 +1076,9 @@ export const enum CSSPropertyTrackerEvents {
   TRACKED_CSS_PROPERTIES_UPDATED = 'TrackedCSSPropertiesUpdated',
 }
 
-export type CSSPropertyTrackerEventTypes = {
-  [CSSPropertyTrackerEvents.TRACKED_CSS_PROPERTIES_UPDATED]: (DOMNode|null)[],
-};
+export interface CSSPropertyTrackerEventTypes {
+  [CSSPropertyTrackerEvents.TRACKED_CSS_PROPERTIES_UPDATED]: (DOMNode|null)[];
+}
 
 SDKModel.register(CSSModel, {capabilities: Capability.DOM, autostart: true});
 export interface ContrastInfo {

front_end/core/sdk/ChildTargetManager.ts

@@ -269,8 +269,8 @@ export const enum Events {
   TARGET_INFO_CHANGED = 'TargetInfoChanged',
 }
 
-export type EventTypes = {
-  [Events.TARGET_CREATED]: Protocol.Target.TargetInfo,
-  [Events.TARGET_DESTROYED]: Protocol.Target.TargetID,
-  [Events.TARGET_INFO_CHANGED]: Protocol.Target.TargetInfo,
-};
+export interface EventTypes {
+  [Events.TARGET_CREATED]: Protocol.Target.TargetInfo;
+  [Events.TARGET_DESTROYED]: Protocol.Target.TargetID;
+  [Events.TARGET_INFO_CHANGED]: Protocol.Target.TargetInfo;
+}

front_end/core/sdk/ConsoleModel.ts

@@ -521,12 +521,12 @@ export interface CommandEvaluatedEvent {
   exceptionDetails?: Protocol.Runtime.ExceptionDetails|undefined;
 }
 
-export type EventTypes = {
-  [Events.ConsoleCleared]: void,
-  [Events.MessageAdded]: ConsoleMessage,
-  [Events.MessageUpdated]: ConsoleMessage,
-  [Events.CommandEvaluated]: CommandEvaluatedEvent,
-};
+export interface EventTypes {
+  [Events.ConsoleCleared]: void;
+  [Events.MessageAdded]: ConsoleMessage;
+  [Events.MessageUpdated]: ConsoleMessage;
+  [Events.CommandEvaluated]: CommandEvaluatedEvent;
+}
 
 export interface AffectedResources {
   requestId?: Protocol.Network.RequestId;

front_end/core/sdk/CookieModel.ts

@@ -238,6 +238,6 @@ export const enum Events {
   COOKIE_LIST_UPDATED = 'CookieListUpdated',
 }
 
-export type EventTypes = {
-  [Events.COOKIE_LIST_UPDATED]: void,
-};
+export interface EventTypes {
+  [Events.COOKIE_LIST_UPDATED]: void;
+}

front_end/core/sdk/DOMDebuggerModel.ts

@@ -271,11 +271,11 @@ export const enum Events {
   DOM_BREAKPOINTS_REMOVED = 'DOMBreakpointsRemoved',
 }
 
-export type EventTypes = {
-  [Events.DOM_BREAKPOINT_ADDED]: DOMBreakpoint,
-  [Events.DOM_BREAKPOINT_TOGGLED]: DOMBreakpoint,
-  [Events.DOM_BREAKPOINTS_REMOVED]: DOMBreakpoint[],
-};
+export interface EventTypes {
+  [Events.DOM_BREAKPOINT_ADDED]: DOMBreakpoint;
+  [Events.DOM_BREAKPOINT_TOGGLED]: DOMBreakpoint;
+  [Events.DOM_BREAKPOINTS_REMOVED]: DOMBreakpoint[];
+}
 
 const Marker = 'breakpoint-marker';