[turbolizer] Improve TypeScript types

This CL adds more TypeScript types and inserts some instanceof checks to
ensure typing. The CL also selects es2018 as target and loads es6/es2018
libs for TypeScript types. This ensures that RegExp groups matching
results are properly typed.

Notry: true
Bug: v8:7327
Change-Id: I1a59a1047188a49579c975149b336cc232c05eef
Reviewed-on: https://chromium-review.googlesource.com/c/1396095Reviewed-by: Georg Neis <neis@chromium.org>
Commit-Queue: Sigurd Schneider <sigurds@chromium.org>
Cr-Commit-Position: refs/heads/master@{#58553}

tools/turbolizer/src/code-view.ts

@@ -30,11 +30,10 @@ export class CodeView extends View {
     return sourceContainer;
   }
 
-  constructor(parentId, broker, sourceResolver, sourceFunction, codeMode: CodeMode) {
-    super(parentId);
+  constructor(parent: HTMLElement, broker: SelectionBroker, sourceResolver: SourceResolver, sourceFunction: Source, codeMode: CodeMode) {
+    super(parent);
     let view = this;
     view.broker = broker;
-    view.source = null;
     view.sourceResolver = sourceResolver;
     view.source = sourceFunction;
     view.codeMode = codeMode;
@@ -207,12 +206,14 @@ export class CodeView extends View {
         const spans = currentLineElement.childNodes;
         for (let j = 0; j < spans.length; ++j) {
           const currentSpan = spans[j];
+          if (currentSpan instanceof HTMLSpanElement) {
             const pos = base + current;
             const end = pos + currentSpan.textContent.length;
             current += currentSpan.textContent.length;
             this.insertSourcePositions(currentSpan, lineNumber, pos, end, newlineAdjust);
             newlineAdjust = 0;
           }
+        }
 
         this.insertLineNumber(currentLineElement, lineNumber);
 
@@ -232,6 +233,7 @@ export class CodeView extends View {
     for (const sourcePosition of sps) {
       this.sourceResolver.addAnyPositionToLine(lineNumber, sourcePosition);
       const textnode = currentSpan.tagName == 'SPAN' ? currentSpan.lastChild : currentSpan;
+      if (!(textnode instanceof Text)) continue;
       const splitLength = Math.max(0, sourcePosition.scriptOffset - pos - offset);
       offset += splitLength;
       const replacementNode = textnode.splitText(splitLength);
@@ -258,12 +260,12 @@ export class CodeView extends View {
     }
   }
 
-  insertLineNumber(lineElement, lineNumber) {
+  insertLineNumber(lineElement: HTMLElement, lineNumber: number) {
     const view = this;
     const lineNumberElement = document.createElement("div");
     lineNumberElement.classList.add("line-number");
-    lineNumberElement.dataset.lineNumber = lineNumber;
-    lineNumberElement.innerText = lineNumber;
+    lineNumberElement.dataset.lineNumber = `${lineNumber}`;
+    lineNumberElement.innerText = `${lineNumber}`;
     lineElement.insertBefore(lineNumberElement, lineElement.firstChild)
     // Don't add lines to source positions of not in backwardsCompatibility mode.
     if (this.source.backwardsCompatibility === true) {

tools/turbolizer/src/disassembly-view.ts

@@ -236,7 +236,7 @@ export class DisassemblyView extends TextView {
     }
   }
 
-  initializeCode(sourceText, sourcePosition) {
+  initializeCode(sourceText, sourcePosition: number = 0) {
     let view = this;
     view.addr_event_counts = null;
     view.total_event_counts = null;

tools/turbolizer/src/graph.ts

@@ -20,7 +20,7 @@ export class Graph {
     this.minGraphY = 0;
     this.maxGraphY = 1;
 
-    data.nodes.forEach((n) => {
+    data.nodes.forEach((n: any) => {
       n.__proto__ = GNode.prototype;
       n.visible = false;
       n.x = 0;

tools/turbolizer/src/sequence-view.ts

@@ -42,7 +42,7 @@ export class SequenceView extends TextView implements PhaseView {
     this.search_info = [];
     this.divNode.addEventListener('click', (e:MouseEvent) => {
       if (!(e.target instanceof HTMLElement)) return;
-      const instructionId = e.target.dataset.instructionId;
+      const instructionId = Number.parseInt(e.target.dataset.instructionId, 10);
       if (!instructionId) return;
       if (!e.shiftKey) this.broker.broadcastClear(null);
       this.broker.broadcastInstructionSelect(null, [instructionId], true);

tools/turbolizer/src/source-resolver.ts

@@ -16,9 +16,9 @@ function sourcePositionEq(a, b) {
     a.scriptOffset == b.scriptOffset;
 }
 
-export function sourcePositionToStringKey(sourcePosition): string {
+export function sourcePositionToStringKey(sourcePosition: AnyPosition): string {
   if (!sourcePosition) return "undefined";
-  if (sourcePosition.inliningId && sourcePosition.scriptOffset)
+  if ('inliningId' in sourcePosition && 'scriptOffset' in sourcePosition)
     return "SP:" + sourcePosition.inliningId + ":" + sourcePosition.scriptOffset;
   if (sourcePosition.bytecodePosition)
     return "BCP:" + sourcePosition.bytecodePosition;

tools/turbolizer/src/tabs.ts

@@ -72,7 +72,8 @@ export class Tabs {
         this.tabBar.parentNode.appendChild(tabDiv);
     }
 
-    tabBarOnDrop(e) {
+    tabBarOnDrop(e: DragEvent) {
+        if (!(e.target instanceof HTMLElement)) return;
         e.preventDefault();
         const tabId = e.dataTransfer.getData("text");
         const tab = document.getElementById(tabId) as HTMLLIElement;
@@ -90,7 +91,8 @@ export class Tabs {
         e.preventDefault();
     }
 
-    tabOnDragStart(e) {
+    tabOnDragStart(e: DragEvent) {
+        if (!(e.target instanceof HTMLElement)) return;
         e.dataTransfer.setData("text", e.target.id);
     }
 

tools/turbolizer/tsconfig.json

@@ -2,13 +2,14 @@
   "compilerOptions": {
     "outDir": "build/",
     "allowJs": false,
-        "target": "es2017",
+    "target": "es2018",
     "module": "es2015",
     "sourceMap": true,
     "experimentalDecorators": true,
     "emitDecoratorMetadata": true,
     "moduleResolution": "node",
-        "noUnusedLocals": true
+    "noUnusedLocals": true,
+    "lib": ["dom", "es6", "dom.iterable", "scripthost", "es2018"]
   },
   "files": [
     "src/util.ts",