Remove circular dependency between IssuesManager and SourceFrameIssuesManager

This change extracts the IssuesManager Events enum into a separate file
to break the circular dependency of values between IssuesManager.ts and
SourceFrameIssuesManager.ts. This helps reduce existing circular
dependencies, in theory moving us slightly closer to being able to
warn about such cycles at build-time to avoid unexpected errors.

This particular cycle recently led to a runtime error when attempting to
subclass IssuesManager to introduce additional functionality. This
subclass was included in the cycle as SourceFrameIssuesManager was
updated to import the subclass instead of IssuesManager. At the time
the Events enum for IssuesManager was non-const, causing the circular
dependency to exist post-build. The error occurred because the extends
relationship of the subclass was evaluated during module initialization.

Since then the Events enum has been converted to const which eliminates
the runtime error. However, eliminating even this cycle is still
beneficial. The compile-time only relationship is not obvious and
cannot otherwise be communicated explicitly until values from const enums
can be used with `import type` per
microsoft/TypeScript#40344.

Bug: 1229328
Change-Id: I033080c77f22584aa0527bcd0559698341d200f5
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3040178
Commit-Queue: Tony Ross <[email protected]>
Reviewed-by: Sigurd Schneider <[email protected]>
Reviewed-by: Tim van der Lippe <[email protected]>

Author: Tony Ross

config/gni/devtools_grd_files.gni

@@ -698,6 +698,7 @@ grd_files_debug_sources = [
   "front_end/models/issues_manager/Issue.js",
   "front_end/models/issues_manager/IssueResolver.js",
   "front_end/models/issues_manager/IssuesManager.js",
+  "front_end/models/issues_manager/IssuesManagerEvents.js",
   "front_end/models/issues_manager/LowTextContrastIssue.js",
   "front_end/models/issues_manager/MarkdownIssueDescription.js",
   "front_end/models/issues_manager/MixedContentIssue.js",

front_end/models/issues_manager/BUILD.gn

@@ -20,6 +20,7 @@ devtools_module("issues_manager") {
     "Issue.ts",
     "IssueResolver.ts",
     "IssuesManager.ts",
+    "IssuesManagerEvents.ts",
     "LowTextContrastIssue.ts",
     "MarkdownIssueDescription.ts",
     "MixedContentIssue.ts",

front_end/models/issues_manager/IssuesManager.ts

@@ -12,6 +12,7 @@ import {CrossOriginEmbedderPolicyIssue, isCrossOriginEmbedderPolicyIssue} from '
 import {DeprecationIssue} from './DeprecationIssue.js';
 import {HeavyAdIssue} from './HeavyAdIssue.js';
 import type {Issue, IssueKind} from './Issue.js';
+import {Events} from './IssuesManagerEvents.js';
 import {LowTextContrastIssue} from './LowTextContrastIssue.js';
 import {MixedContentIssue} from './MixedContentIssue.js';
 import {QuirksModeIssue} from './QuirksModeIssue.js';
@@ -22,6 +23,8 @@ import {TrustedWebActivityIssue} from './TrustedWebActivityIssue.js';
 import {AttributionReportingIssue} from './AttributionReportingIssue.js';
 import {WasmCrossOriginModuleSharingIssue} from './WasmCrossOriginModuleSharingIssue.js';
 
+export {Events} from './IssuesManagerEvents.js';
+
 let issuesManagerInstance: IssuesManager|null = null;
 
 
@@ -288,12 +291,6 @@ export class IssuesManager extends Common.ObjectWrapper.ObjectWrapper<EventTypes
   }
 }
 
-export const enum Events {
-  IssuesCountUpdated = 'IssuesCountUpdated',
-  IssueAdded = 'IssueAdded',
-  FullUpdateRequired = 'FullUpdateRequired',
-}
-
 export interface IssueAddedEvent {
   issuesModel: SDK.IssuesModel.IssuesModel;
   issue: Issue;

front_end/models/issues_manager/IssuesManagerEvents.ts

@@ -0,0 +1,9 @@
+// Copyright 2021 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+export const enum Events {
+  IssuesCountUpdated = 'IssuesCountUpdated',
+  IssueAdded = 'IssueAdded',
+  FullUpdateRequired = 'FullUpdateRequired',
+}

front_end/models/issues_manager/SourceFrameIssuesManager.ts

@@ -11,19 +11,20 @@ import * as Workspace from '../../models/workspace/workspace.js';
 import {ContentSecurityPolicyIssue, trustedTypesPolicyViolationCode, trustedTypesSinkViolationCode} from './ContentSecurityPolicyIssue.js';
 import type {Issue, IssueKind} from './Issue.js';
 import {toZeroBasedLocation} from './Issue.js';
-import * as IssuesManager from './IssuesManager.js';
+import type {IssueAddedEvent, IssuesManager} from './IssuesManager.js';
+import {Events} from './IssuesManagerEvents.js';
 import {getIssueTitleFromMarkdownDescription} from './MarkdownIssueDescription.js';
 
 export class SourceFrameIssuesManager {
   private locationPool = new Bindings.LiveLocation.LiveLocationPool();
   private issueMessages = new Array<IssueMessage>();
 
-  constructor(private readonly issuesManager: IssuesManager.IssuesManager) {
-    this.issuesManager.addEventListener(IssuesManager.Events.IssueAdded, this.onIssueAdded, this);
-    this.issuesManager.addEventListener(IssuesManager.Events.FullUpdateRequired, this.onFullUpdateRequired, this);
+  constructor(private readonly issuesManager: IssuesManager) {
+    this.issuesManager.addEventListener(Events.IssueAdded, this.onIssueAdded, this);
+    this.issuesManager.addEventListener(Events.FullUpdateRequired, this.onFullUpdateRequired, this);
   }
 
-  private onIssueAdded(event: Common.EventTarget.EventTargetEvent<IssuesManager.IssueAddedEvent>): void {
+  private onIssueAdded(event: Common.EventTarget.EventTargetEvent<IssueAddedEvent>): void {
     const {issue} = event.data;
     this.addIssue(issue);
   }