chrome-devtools-frontend 1.0.930993 → 1.0.932348

package/front_end/panels/browser_debugger/XHRBreakpointsSidebarPane.ts

@@ -67,36 +67,36 @@ let xhrBreakpointsSidebarPaneInstance: XHRBreakpointsSidebarPane;
 export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.ContextFlavorListener.ContextFlavorListener,
                                                                          UI.Toolbar.ItemsProvider,
                                                                          UI.ListControl.ListDelegate<string> {
-  private readonly breakpoints: UI.ListModel.ListModel<string>;
-  private list: UI.ListControl.ListControl<string>;
-  private readonly emptyElement: HTMLElement;
-  private readonly breakpointElements: Map<string, Element>;
-  private readonly addButton: UI.Toolbar.ToolbarButton;
+  readonly #breakpoints: UI.ListModel.ListModel<string>;
+  #list: UI.ListControl.ListControl<string>;
+  readonly #emptyElement: HTMLElement;
+  readonly #breakpointElements: Map<string, Element>;
+  readonly #addButton: UI.Toolbar.ToolbarButton;
   // TODO(crbug.com/1172300) Ignored during the jsdoc to ts migration)
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  private hitBreakpoint?: any;
+  #hitBreakpoint?: any;
 
   private constructor() {
     super(true);
 
-    this.breakpoints = new UI.ListModel.ListModel();
-    this.list = new UI.ListControl.ListControl(this.breakpoints, this, UI.ListControl.ListMode.NonViewport);
-    this.contentElement.appendChild(this.list.element);
-    this.list.element.classList.add('breakpoint-list', 'hidden');
-    UI.ARIAUtils.markAsList(this.list.element);
-    UI.ARIAUtils.setAccessibleName(this.list.element, i18nString(UIStrings.xhrfetchBreakpoints));
-    this.emptyElement = this.contentElement.createChild('div', 'gray-info-message');
-    this.emptyElement.textContent = i18nString(UIStrings.noBreakpoints);
+    this.#breakpoints = new UI.ListModel.ListModel();
+    this.#list = new UI.ListControl.ListControl(this.#breakpoints, this, UI.ListControl.ListMode.NonViewport);
+    this.contentElement.appendChild(this.#list.element);
+    this.#list.element.classList.add('breakpoint-list', 'hidden');
+    UI.ARIAUtils.markAsList(this.#list.element);
+    UI.ARIAUtils.setAccessibleName(this.#list.element, i18nString(UIStrings.xhrfetchBreakpoints));
+    this.#emptyElement = this.contentElement.createChild('div', 'gray-info-message');
+    this.#emptyElement.textContent = i18nString(UIStrings.noBreakpoints);
 
-    this.breakpointElements = new Map();
+    this.#breakpointElements = new Map();
 
-    this.addButton = new UI.Toolbar.ToolbarButton(i18nString(UIStrings.addXhrfetchBreakpoint), 'largeicon-add');
-    this.addButton.addEventListener(UI.Toolbar.ToolbarButton.Events.Click, () => {
+    this.#addButton = new UI.Toolbar.ToolbarButton(i18nString(UIStrings.addXhrfetchBreakpoint), 'largeicon-add');
+    this.#addButton.addEventListener(UI.Toolbar.ToolbarButton.Events.Click, () => {
       this.addButtonClicked();
     });
 
-    this.emptyElement.addEventListener('contextmenu', this.emptyElementContextMenu.bind(this), true);
-    this.emptyElement.tabIndex = -1;
+    this.#emptyElement.addEventListener('contextmenu', this.emptyElementContextMenu.bind(this), true);
+    this.#emptyElement.tabIndex = -1;
     this.restoreBreakpoints();
     this.update();
   }
@@ -109,7 +109,7 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
   }
 
   toolbarItems(): UI.Toolbar.ToolbarItem[] {
-    return [this.addButton];
+    return [this.#addButton];
   }
 
   private emptyElementContextMenu(event: Event): void {
@@ -127,7 +127,7 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
 
     const inputElement = inputElementContainer.createChild('span', 'breakpoint-condition-input');
     UI.ARIAUtils.setAccessibleName(inputElement, i18nString(UIStrings.urlBreakpoint));
-    this.addListElement(inputElementContainer, this.list.element.firstChild as Element | null);
+    this.addListElement(inputElementContainer, this.#list.element.firstChild as Element | null);
 
     function finishEditing(this: XHRBreakpointsSidebarPane, accept: boolean, e: Element, text: string): void {
       this.removeListElement(inputElementContainer);
@@ -153,10 +153,10 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
   }
 
   private setBreakpoint(url: string): void {
-    if (this.breakpoints.indexOf(url) !== -1) {
-      this.list.refreshItem(url);
+    if (this.#breakpoints.indexOf(url) !== -1) {
+      this.#list.refreshItem(url);
     } else {
-      this.breakpoints.insertWithComparator(url, (a, b) => {
+      this.#breakpoints.insertWithComparator(url, (a, b) => {
         if (a > b) {
           return 1;
         }
@@ -166,8 +166,8 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
         return 0;
       });
     }
-    if (!this.list.selectedItem() || !this.hasFocus()) {
-      this.list.selectItem(this.breakpoints.at(0));
+    if (!this.#list.selectedItem() || !this.hasFocus()) {
+      this.#list.selectItem(this.#breakpoints.at(0));
     }
   }
 
@@ -195,7 +195,7 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
     breakpointEntryToCheckbox.set(element, label.checkboxElement);
     label.checkboxElement.tabIndex = -1;
     element.tabIndex = -1;
-    if (item === this.list.selectedItem()) {
+    if (item === this.#list.selectedItem()) {
       element.tabIndex = 0;
       this.setDefaultFocusedElement(element);
     }
@@ -214,14 +214,14 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
       }
     });
 
-    if (item === this.hitBreakpoint) {
+    if (item === this.#hitBreakpoint) {
       element.classList.add('breakpoint-hit');
       UI.ARIAUtils.setDescription(element, i18nString(UIStrings.breakpointHit));
     }
 
     label.classList.add('cursor-auto');
     label.textElement.addEventListener('dblclick', this.labelClicked.bind(this, item), false);
-    this.breakpointElements.set(item, listItemElement);
+    this.#breakpointElements.set(item, listItemElement);
     return listItemElement;
   }
 
@@ -252,25 +252,25 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
   }
 
   private removeBreakpoint(url: string): void {
-    const index = this.breakpoints.indexOf(url);
+    const index = this.#breakpoints.indexOf(url);
     if (index >= 0) {
-      this.breakpoints.remove(index);
+      this.#breakpoints.remove(index);
     }
-    this.breakpointElements.delete(url);
+    this.#breakpointElements.delete(url);
     this.update();
   }
 
   private addListElement(element: Element, beforeNode: Node|null): void {
-    this.list.element.insertBefore(element, beforeNode);
-    this.emptyElement.classList.add('hidden');
-    this.list.element.classList.remove('hidden');
+    this.#list.element.insertBefore(element, beforeNode);
+    this.#emptyElement.classList.add('hidden');
+    this.#list.element.classList.remove('hidden');
   }
 
   private removeListElement(element: Element): void {
-    this.list.element.removeChild(element);
-    if (!this.list.element.firstElementChild) {
-      this.emptyElement.classList.remove('hidden');
-      this.list.element.classList.add('hidden');
+    this.#list.element.removeChild(element);
+    if (!this.#list.element.firstElementChild) {
+      this.#emptyElement.classList.remove('hidden');
+      this.#list.element.classList.add('hidden');
     }
   }
 
@@ -283,7 +283,7 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
     }
 
     function removeAllBreakpoints(this: XHRBreakpointsSidebarPane): void {
-      for (const url of this.breakpointElements.keys()) {
+      for (const url of this.#breakpointElements.keys()) {
         SDK.DOMDebuggerModel.DOMDebuggerManager.instance().removeXHRBreakpoint(url);
         this.removeBreakpoint(url);
       }
@@ -300,20 +300,20 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
   private checkboxClicked(url: string, checked: boolean): void {
     const hadFocus = this.hasFocus();
     SDK.DOMDebuggerModel.DOMDebuggerManager.instance().toggleXHRBreakpoint(url, !checked);
-    this.list.refreshItem(url);
-    this.list.selectItem(url);
+    this.#list.refreshItem(url);
+    this.#list.selectItem(url);
     if (hadFocus) {
       this.focus();
     }
   }
 
   private labelClicked(url: string): void {
-    const element = this.breakpointElements.get(url);
+    const element = this.#breakpointElements.get(url);
     const inputElement = document.createElement('span');
     inputElement.classList.add('breakpoint-condition');
     inputElement.textContent = url;
     if (element) {
-      this.list.element.insertBefore(inputElement, element);
+      this.#list.element.insertBefore(inputElement, element);
       element.classList.add('hidden');
     }
 
@@ -333,7 +333,7 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
         }
         SDK.DOMDebuggerModel.DOMDebuggerManager.instance().addXHRBreakpoint(text, enabled);
         this.setBreakpoint(text);
-        this.list.selectItem(text);
+        this.#list.selectItem(text);
       } else if (element) {
         element.classList.remove('hidden');
       }
@@ -351,27 +351,27 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
   }
 
   private update(): void {
-    const isEmpty = this.breakpoints.length === 0;
-    this.list.element.classList.toggle('hidden', isEmpty);
-    this.emptyElement.classList.toggle('hidden', !isEmpty);
+    const isEmpty = this.#breakpoints.length === 0;
+    this.#list.element.classList.toggle('hidden', isEmpty);
+    this.#emptyElement.classList.toggle('hidden', !isEmpty);
 
     const details = UI.Context.Context.instance().flavor(SDK.DebuggerModel.DebuggerPausedDetails);
     if (!details || details.reason !== Protocol.Debugger.PausedEventReason.XHR) {
-      if (this.hitBreakpoint) {
-        const oldHitBreakpoint = this.hitBreakpoint;
-        delete this.hitBreakpoint;
-        if (this.breakpoints.indexOf(oldHitBreakpoint) >= 0) {
-          this.list.refreshItem(oldHitBreakpoint);
+      if (this.#hitBreakpoint) {
+        const oldHitBreakpoint = this.#hitBreakpoint;
+        this.#hitBreakpoint = undefined;
+        if (this.#breakpoints.indexOf(oldHitBreakpoint) >= 0) {
+          this.#list.refreshItem(oldHitBreakpoint);
         }
       }
       return;
     }
     const url = details.auxData && details.auxData['breakpointURL'];
-    this.hitBreakpoint = url;
-    if (this.breakpoints.indexOf(url) < 0) {
+    this.#hitBreakpoint = url;
+    if (this.#breakpoints.indexOf(url) < 0) {
       return;
     }
-    this.list.refreshItem(url);
+    this.#list.refreshItem(url);
     UI.ViewManager.ViewManager.instance().showView('sources.xhrBreakpoints');
   }
 

package/front_end/panels/changes/ChangesView.ts

@@ -5,6 +5,7 @@
 import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Diff from '../../third_party/diff/diff.js';
+import * as DiffView from '../../ui/components/diff_view/diff_view.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 import changesViewStyles from './changesView.css.js';
@@ -13,13 +14,8 @@ import type * as Workspace from '../../models/workspace/workspace.js';
 import * as WorkspaceDiff from '../../models/workspace_diff/workspace_diff.js';
 
 import {ChangesSidebar, Events} from './ChangesSidebar.js';
-import {ChangesTextEditor} from './ChangesTextEditor.js';
 
 const UIStrings = {
-  /**
-  *@description Screen-reader accessible name for the code editor in the Changes tool showing the user's changes.
-  */
-  changesDiffViewer: 'Changes diff viewer',
   /**
   *@description Screen reader/tooltip label for a button in the Changes tool that reverts all changes to the currently open file.
   */
@@ -44,15 +40,20 @@ const UIStrings = {
   * lines were removed (not translatable).
   */
   sDeletions: '{n, plural, =1 {# deletion (-)} other {# deletions (-)}}',
-  /**
-  *@description Text in Changes View of the Changes tab
-  *@example {2} PH1
-  */
-  SkippingDMatchingLines: '( … Skipping {PH1} matching lines … )',
 };
 const str_ = i18n.i18n.registerUIStrings('panels/changes/ChangesView.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
+function diffStats(diff: Diff.Diff.DiffArray): string {
+  const insertions =
+      diff.reduce((ins, token) => ins + (token[0] === Diff.Diff.Operation.Insert ? token[1].length : 0), 0);
+  const deletions =
+      diff.reduce((ins, token) => ins + (token[0] === Diff.Diff.Operation.Delete ? token[1].length : 0), 0);
+  const deletionText = i18nString(UIStrings.sDeletions, {n: deletions});
+  const insertionText = i18nString(UIStrings.sInsertions, {n: insertions});
+  return `${insertionText}, ${deletionText}`;
+}
+
 let changesViewInstance: ChangesView;
 
 export class ChangesView extends UI.Widget.VBox {
@@ -60,11 +61,10 @@ export class ChangesView extends UI.Widget.VBox {
   private readonly workspaceDiff: WorkspaceDiff.WorkspaceDiff.WorkspaceDiffImpl;
   readonly changesSidebar: ChangesSidebar;
   private selectedUISourceCode: Workspace.UISourceCode.UISourceCode|null;
-  private diffRows: Row[];
-  private maxLineDigits: number;
-  private readonly editor: ChangesTextEditor;
+  private readonly diffContainer: HTMLElement;
   private readonly toolbar: UI.Toolbar.Toolbar;
   private readonly diffStats: UI.Toolbar.ToolbarText;
+  private readonly diffView: DiffView.DiffView.DiffView;
 
   private constructor() {
     super(true);
@@ -84,30 +84,11 @@ export class ChangesView extends UI.Widget.VBox {
 
     this.selectedUISourceCode = null;
 
-    this.diffRows = [];
-
-    this.maxLineDigits = 1;
-
-    this.editor = new ChangesTextEditor({
-      bracketMatchingSetting: undefined,
-      devtoolsAccessibleName: i18nString(UIStrings.changesDiffViewer),
-      lineNumbers: true,
-      lineWrapping: false,
-      mimeType: undefined,
-      autoHeight: undefined,
-      padBottom: undefined,
-      maxHighlightLength: Infinity,  // Avoid CodeMirror bailing out of highlighting big diffs.
-      placeholder: undefined,
-      lineWiseCopyCut: undefined,
-      inputStyle: undefined,
-    });
-    this.editor.setReadOnly(true);
-    const editorContainer = mainWidget.element.createChild('div', 'editor-container');
-    UI.ARIAUtils.markAsTabpanel(editorContainer);
-    this.editor.show(editorContainer);
-    this.editor.hideWidget();
+    this.diffContainer = mainWidget.element.createChild('div', 'diff-container');
+    UI.ARIAUtils.markAsTabpanel(this.diffContainer);
+    this.diffContainer.addEventListener('click', event => this.click(event));
 
-    self.onInvokeElement(this.editor.element, this.click.bind(this));
+    this.diffView = this.diffContainer.appendChild(new DiffView.DiffView.DiffView());
 
     this.toolbar = new UI.Toolbar.Toolbar('changes-toolbar', mainWidget.element);
     const revertButton =
@@ -143,15 +124,25 @@ export class ChangesView extends UI.Widget.VBox {
     this.workspaceDiff.revertToOriginal(uiSourceCode);
   }
 
-  private click(event: Event): void {
-    const selection = this.editor.selection();
-    if (!selection.isEmpty() || !this.selectedUISourceCode) {
+  private click(event: MouseEvent): void {
+    if (!this.selectedUISourceCode) {
       return;
     }
-    const row = this.diffRows[selection.startLine];
-    Common.Revealer.reveal(
-        this.selectedUISourceCode.uiLocation(row.currentLineNumber - 1, selection.startColumn), false);
-    event.consume(true);
+    for (let target: HTMLElement|null = event.target as HTMLElement; target; target = target.parentElement) {
+      if (target.classList.contains('diff-line-content')) {
+        const number = target.getAttribute('data-line-number');
+        if (number) {
+          // Unfortunately, caretRangeFromPoint is broken in shadow
+          // roots, which makes determining the character offset more
+          // work than justified here.
+          Common.Revealer.reveal(this.selectedUISourceCode.uiLocation(Number(number) - 1, 0), false);
+          event.consume(true);
+        }
+        break;
+      } else if (target.classList.contains('diff-listing')) {
+        break;
+      }
+    }
   }
 
   private revealUISourceCode(uiSourceCode: Workspace.UISourceCode.UISourceCode|null): void {
@@ -200,188 +191,25 @@ export class ChangesView extends UI.Widget.VBox {
   private hideDiff(message: string): void {
     this.diffStats.setText('');
     this.toolbar.setEnabled(false);
-    this.editor.hideWidget();
+    this.diffContainer.style.display = 'none';
     this.emptyWidget.text = message;
     this.emptyWidget.showWidget();
   }
 
   private renderDiffRows(diff: Diff.Diff.DiffArray|null): void {
-    this.diffRows = [];
-
     if (!diff || (diff.length === 1 && diff[0][0] === Diff.Diff.Operation.Equal)) {
       this.hideDiff(i18nString(UIStrings.noChanges));
-      return;
-    }
-
-    let insertions = 0;
-    let deletions = 0;
-    let currentLineNumber = 0;
-    let baselineLineNumber = 0;
-    const paddingLines = 3;
-
-    const originalLines: string[] = [];
-    const currentLines: string[] = [];
-
-    for (let i = 0; i < diff.length; ++i) {
-      const token = diff[i];
-      switch (token[0]) {
-        case Diff.Diff.Operation.Equal:
-          this.diffRows.push(...createEqualRows(token[1], i === 0, i === diff.length - 1));
-          originalLines.push(...token[1]);
-          currentLines.push(...token[1]);
-          break;
-        case Diff.Diff.Operation.Insert:
-          for (const line of token[1]) {
-            this.diffRows.push(createRow(line, RowType.Addition));
-          }
-          insertions += token[1].length;
-          currentLines.push(...token[1]);
-          break;
-        case Diff.Diff.Operation.Delete:
-          deletions += token[1].length;
-          originalLines.push(...token[1]);
-          if (diff[i + 1] && diff[i + 1][0] === Diff.Diff.Operation.Insert) {
-            i++;
-            this.diffRows.push(...createModifyRows(token[1].join('\n'), diff[i][1].join('\n')));
-            insertions += diff[i][1].length;
-            currentLines.push(...diff[i][1]);
-          } else {
-            for (const line of token[1]) {
-              this.diffRows.push(createRow(line, RowType.Deletion));
-            }
-          }
-          break;
-      }
+    } else {
+      this.diffStats.setText(diffStats(diff));
+      this.toolbar.setEnabled(true);
+      this.emptyWidget.hideWidget();
+      const mimeType = (this.selectedUISourceCode as Workspace.UISourceCode.UISourceCode).mimeType();
+      this.diffContainer.style.display = 'block';
+      this.diffView.data = {diff, mimeType};
     }
-
-    this.maxLineDigits = Math.ceil(Math.log10(Math.max(currentLineNumber, baselineLineNumber)));
-
-    const insertionText = i18nString(UIStrings.sInsertions, {n: insertions});
-    const deletionText = i18nString(UIStrings.sDeletions, {n: deletions});
-
-    this.diffStats.setText(`${insertionText}, ${deletionText}`);
-    this.toolbar.setEnabled(true);
-    this.emptyWidget.hideWidget();
-
-    this.editor.operation((): void => {
-      this.editor.showWidget();
-      this.editor.setHighlightMode({
-        name: 'devtools-diff',
-        diffRows: this.diffRows,
-        mimeType: /** @type {!Workspace.UISourceCode.UISourceCode} */ (
-                      this.selectedUISourceCode as Workspace.UISourceCode.UISourceCode)
-                      .mimeType(),
-        baselineLines: originalLines,
-        currentLines: currentLines,
-      });
-      this.editor.setText(this.diffRows
-                              .map(
-                                  (row: Row): string =>
-                                      row.tokens.map((t: {text: string, className: string}): string => t.text).join(''))
-                              .join('\n'));
-      this.editor.setLineNumberFormatter(this.lineFormatter.bind(this));
-      this.editor.updateDiffGutter(this.diffRows);
-    });
-
-    function createEqualRows(lines: string[], atStart: boolean, atEnd: boolean): Row[] {
-      const equalRows = [];
-      if (!atStart) {
-        for (let i = 0; i < paddingLines && i < lines.length; i++) {
-          equalRows.push(createRow(lines[i], RowType.Equal));
-        }
-        if (lines.length > paddingLines * 2 + 1 && !atEnd) {
-          equalRows.push(createRow(
-              i18nString(UIStrings.SkippingDMatchingLines, {PH1: (lines.length - paddingLines * 2)}), RowType.Spacer));
-        }
-      }
-      if (!atEnd) {
-        const start = Math.max(lines.length - paddingLines - 1, atStart ? 0 : paddingLines);
-        let skip = lines.length - paddingLines - 1;
-        if (!atStart) {
-          skip -= paddingLines;
-        }
-        if (skip > 0) {
-          baselineLineNumber += skip;
-          currentLineNumber += skip;
-        }
-
-        for (let i = start; i < lines.length; i++) {
-          equalRows.push(createRow(lines[i], RowType.Equal));
-        }
-      }
-      return equalRows;
-    }
-
-    function createModifyRows(before: string, after: string): Row[] {
-      const internalDiff = Diff.Diff.DiffWrapper.charDiff(before, after, true /* cleanup diff */);
-      const deletionRows = [createRow('', RowType.Deletion)];
-      const insertionRows = [createRow('', RowType.Addition)];
-
-      for (const token of internalDiff) {
-        const text = token[1];
-        const type = token[0];
-        const className = type === Diff.Diff.Operation.Equal ? '' : 'inner-diff';
-        const lines = text.split('\n');
-        for (let i = 0; i < lines.length; i++) {
-          if (i > 0 && type !== Diff.Diff.Operation.Insert) {
-            deletionRows.push(createRow('', RowType.Deletion));
-          }
-          if (i > 0 && type !== Diff.Diff.Operation.Delete) {
-            insertionRows.push(createRow('', RowType.Addition));
-          }
-          if (!lines[i]) {
-            continue;
-          }
-          if (type !== Diff.Diff.Operation.Insert) {
-            deletionRows[deletionRows.length - 1].tokens.push({text: lines[i], className});
-          }
-          if (type !== Diff.Diff.Operation.Delete) {
-            insertionRows[insertionRows.length - 1].tokens.push({text: lines[i], className});
-          }
-        }
-      }
-      return deletionRows.concat(insertionRows);
-    }
-
-    function createRow(text: string, type: RowType): Row {
-      if (type === RowType.Addition) {
-        currentLineNumber++;
-      }
-      if (type === RowType.Deletion) {
-        baselineLineNumber++;
-      }
-      if (type === RowType.Equal) {
-        baselineLineNumber++;
-        currentLineNumber++;
-      }
-
-      return {baselineLineNumber, currentLineNumber, tokens: text ? [{text, className: 'inner-diff'}] : [], type};
-    }
-  }
-
-  private lineFormatter(lineNumber: number): string {
-    const row = this.diffRows[lineNumber - 1];
-    let showBaseNumber = row.type === RowType.Deletion;
-    let showCurrentNumber = row.type === RowType.Addition;
-    if (row.type === RowType.Equal) {
-      showBaseNumber = true;
-      showCurrentNumber = true;
-    }
-    const baseText = showBaseNumber ? String(row.baselineLineNumber) : '';
-    const base = baseText.padStart(this.maxLineDigits, '\xA0');
-    const currentText = showCurrentNumber ? String(row.currentLineNumber) : '';
-    const current = currentText.padStart(this.maxLineDigits, '\xA0');
-    return base + '\xA0' + current;
   }
 }
 
-export const enum RowType {
-  Deletion = 'deletion',
-  Addition = 'addition',
-  Equal = 'equal',
-  Spacer = 'spacer',
-}
-
 let diffUILocationRevealerInstance: DiffUILocationRevealer;
 export class DiffUILocationRevealer implements Common.Revealer.Revealer {
   static instance(opts: {forceNew: boolean} = {forceNew: false}): DiffUILocationRevealer {
@@ -401,14 +229,3 @@ export class DiffUILocationRevealer implements Common.Revealer.Revealer {
     ChangesView.instance().changesSidebar.selectUISourceCode(diffUILocation.uiSourceCode, omitFocus);
   }
 }
-
-export interface Token {
-  text: string;
-  className: string;
-}
-export interface Row {
-  baselineLineNumber: number;
-  currentLineNumber: number;
-  tokens: Token[];
-  type: RowType;
-}

package/front_end/panels/changes/changes-legacy.ts

@@ -9,8 +9,6 @@ import * as ChangesModule from './changes.js';
 self.Changes = self.Changes || {};
 Changes = Changes || {};
 
-Changes.ChangesHighlighter = ChangesModule.ChangesHighlighter.ChangesHighlighter;
-
 /**
  * @constructor
  */

package/front_end/panels/changes/changes.ts

@@ -2,19 +2,13 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import './ChangesHighlighter.js';
 import './ChangesView.js';
 import './ChangesSidebar.js';
-import './ChangesTextEditor.js';
 
-import * as ChangesHighlighter from './ChangesHighlighter.js';
 import * as ChangesSidebar from './ChangesSidebar.js';
-import * as ChangesTextEditor from './ChangesTextEditor.js';
 import * as ChangesView from './ChangesView.js';
 
 export {
-  ChangesHighlighter,
   ChangesSidebar,
-  ChangesTextEditor,
   ChangesView,
 };