fix linting-issues found by nes version of tslint

src/ts/file-reader.ts

@@ -16,15 +16,15 @@ export function readFile(file: File,
 
   function parseJson(rawData) {
     try {
-      let harData = JSON.parse(rawData);
+      const harData = JSON.parse(rawData);
       callback(null, harData.log);
     } catch (e) {
       callback(e);
     }
   }
 
   /** start reading the file */
-  let extension = fileName.match(/\.[0-9a-z]+$/i)[0];
+  const extension = fileName.match(/\.[0-9a-z]+$/i)[0];
   if ([".zhar", ".zip"].indexOf(extension) !== -1) {
     /** zhar */
     zip.createReader(new zip.BlobReader(file), (zipReader) => {
@@ -38,7 +38,7 @@ export function readFile(file: File,
     });
   } else {
 
-    let reader = new FileReader();
+    const reader = new FileReader();
 
     /** try to parse the file once uploaded to browser */
     reader.addEventListener("load", (e: any) => {

src/ts/helpers/dom.ts

@@ -44,7 +44,7 @@ export function getParentByClassName(base: Element, className: string) {
     return base.parentElement;
   }
   return getParentByClassName(base.parentElement, className);
-};
+}
 
 /**
  * Removes all child DOM nodes from `el`

src/ts/helpers/icons.ts

@@ -123,7 +123,7 @@ export function svg(x: number, y: number, title: string, scale: number = 1): SVG
   return image(x, y, title, scale);
 }
 
-  export function html(x: number, y: number, title: string, scale: number = 1): SVGElement {
+export function html(x: number, y: number, title: string, scale: number = 1): SVGElement {
   return toSvg(x, y, title, "icon-html", scale, `<path d="m 5.62623,13.310467 -0.491804,0.4919 q -0.09836,0.098
     -0.226229,0.098 -0.127869,0 -0.22623,-0.098 L 0.098361,9.218667 Q 0,9.120367 0,8.992467 q 0,-0.1279 0.09836,-0.2262
     l 4.583606,-4.5836 q 0.09836,-0.098 0.22623,-0.098 0.127869,0 0.226229,0.098 l 0.491804,0.4918 q 0.09836,0.098

src/ts/helpers/misc.ts

@@ -7,8 +7,8 @@
  * @param  {string} url
  */
 function parseUrl(url: string) {
-  let pattern = RegExp("^(([^:/?#]+):)?(//([^/?#]*))?([^?#]*)(\\?([^#]*))?(#(.*))?");
-  let matches = url.match(pattern);
+  const pattern = RegExp("^(([^:/?#]+):)?(//([^/?#]*))?([^?#]*)(\\?([^#]*))?(#(.*))?");
+  const matches = url.match(pattern);
   return {
     authority: matches[4],
     fragment: matches[9],
@@ -32,7 +32,7 @@ export function contains<T>(arr: T[], item: T): boolean {
  * @param arr Array to search
  * @param predicate Function that returns true for a match
  */
-export function findIndex<T>(arr: T[], predicate: {(el: T, index: number): Boolean}) {
+export function findIndex<T>(arr: T[], predicate: (el: T, index: number) => boolean) {
   let i = 0;
   if (!arr || arr.length < 1) {
     return undefined;
@@ -52,7 +52,7 @@ export function findIndex<T>(arr: T[], predicate: {(el: T, index: number): Boole
  * @param arr Array to search
  * @param predicate Function that returns true for a match
  */
-export function find<T>(arr: T[], predicate: {(el: T, index: number): Boolean}) {
+export function find<T>(arr: T[], predicate: (el: T, index: number) => boolean) {
   const index = findIndex(arr, predicate);
   if (index === undefined) {
     return undefined;
@@ -71,7 +71,7 @@ export function resourceUrlFormatter(url: string, maxLength: number): string {
     return url.replace(/https?:\/\//, "");
   }
 
-  let matches = parseUrl(url);
+  const matches = parseUrl(url);
 
   if ((matches.authority + matches.path).length < maxLength) {
     return matches.authority + matches.path;
@@ -80,7 +80,7 @@ export function resourceUrlFormatter(url: string, maxLength: number): string {
   const maxAuthLength = Math.floor(maxLength / 2) - 3;
   const maxPathLength = Math.floor(maxLength / 2) - 5;
   // maybe we could fine tune these numbers
-  let p = matches.path.split("/");
+  const p = matches.path.split("/");
   if (matches.authority.length > maxAuthLength) {
     return matches.authority.substr(0, maxAuthLength) + "..." + p[p.length - 1].substr(-maxPathLength);
   }

src/ts/helpers/parse.ts

@@ -176,13 +176,13 @@ export function toInt(input: string | number): number {
 
 /** Validates the `ChartOptions` attributes types */
 export function validateOptions(options: ChartRenderOption): ChartRenderOption {
-  let validateInt = (name: keyof ChartRenderOption) => {
+  const validateInt = (name: keyof ChartRenderOption) => {
     options[name] = toInt(options[name] as any);
     if (options[name] === undefined) {
       throw TypeError(`option "${name}" needs to be a number`);
     }
   };
-  let ensureBoolean = (name: keyof ChartRenderOption) => {
+  const ensureBoolean = (name: keyof ChartRenderOption) => {
     options[name] = !!options[name];
   };
 

src/ts/helpers/svg.ts

@@ -3,13 +3,13 @@
  */
 
 import { addClass } from "./dom";
-export type StringToStringOrNumberMap = {[key: string]: string|number};
+export interface StringToStringOrNumberMap { [key: string]: string|number; }
 export type DomAttributeMap = StringToStringOrNumberMap;
 export type CssStyleMap = StringToStringOrNumberMap;
 
 function entries(obj: StringToStringOrNumberMap): Array<[string, string]> {
   const entries: Array<[string, string]> = [];
-  for (let k of Object.keys(obj)) {
+  for (const k of Object.keys(obj)) {
     entries.push([k, String((obj[k]))]);
   }
   return entries;
@@ -100,7 +100,7 @@ export function newTextEl(text: string, attributes: DomAttributeMap = {},
 }
 
 /** temp SVG element for size measurements  */
-let getTestSVGEl = (() => {
+const getTestSVGEl = (() => {
   /** Reference to Temp SVG element for size measurements */
   let svgTestEl: SVGSVGElement;
   let removeSvgTestElTimeout;
@@ -145,7 +145,7 @@ let getTestSVGEl = (() => {
  * @returns number
  */
 export function getNodeTextWidth(textNode: SVGTextElement, skipClone: boolean = false): number {
-  let tmp = getTestSVGEl();
+  const tmp = getTestSVGEl();
   let tmpTextNode: SVGTextElement;
   let shadow;
   if (skipClone) {

src/ts/legend/legend.ts

@@ -2,7 +2,7 @@
  * Creates the html for diagrams legend
  */
 export function makeLegend(): HTMLUListElement {
-  let ulNode = document.createElement("ul");
+  const ulNode = document.createElement("ul");
   ulNode.className = "resource-legend";
 
   ulNode.innerHTML = `

src/ts/main.ts

@@ -38,14 +38,14 @@ function PerfCascade(waterfallDocsData: WaterfallDocs, chartOptions: Partial<Cha
   const options: ChartRenderOption = validateOptions({ ...defaultChartOptions, ...chartOptions } as ChartRenderOption);
 
   // setup paging helper
-  let paging = new Paging(waterfallDocsData, options.selectedPage);
+  const paging = new Paging(waterfallDocsData, options.selectedPage);
 
   let doc = createWaterfallSvg(paging.getSelectedPage(), options);
 
   // page update behaviour
   paging.onPageUpdate((_pageIndex, pageDoc) => {
-    let el = doc.parentElement;
-    let newDoc = createWaterfallSvg(pageDoc, options);
+    const el = doc.parentElement;
+    const newDoc = createWaterfallSvg(pageDoc, options);
     el.replaceChild(newDoc, doc);
     doc = newDoc;
   });
@@ -81,5 +81,5 @@ export function fromHar(harData: Har, options: ChartOptions = {}): SVGSVGElement
 
 // aditional imported members that get exported via UMD
 export {
-  ChartOptions
+  ChartOptions,
 };

src/ts/paging/paging.ts

@@ -51,7 +51,7 @@ export default class Paging {
     }
 
     this.selectedPageIndex = pageIndex;
-    let selectedPage = this.doc.pages[this.selectedPageIndex];
+    const selectedPage = this.doc.pages[this.selectedPageIndex];
     this.onPageUpdateCbs.forEach((cb) => {
       cb(this.selectedPageIndex, selectedPage);
     });
@@ -82,13 +82,13 @@ export default class Paging {
     // remove all existing options, like placeholders
     removeChildren(selectbox);
     this.doc.pages.forEach((p, i) => {
-      let option = new Option(p.title, i.toString(), false, i === this.selectedPageIndex);
+      const option = new Option(p.title, i.toString(), false, i === this.selectedPageIndex);
       selectbox.add(option);
     });
 
     selectbox.style.display = "block";
     selectbox.addEventListener("change", (evt) => {
-      let val = parseInt((evt.target as HTMLOptionElement).value, 10);
+      const val = parseInt((evt.target as HTMLOptionElement).value, 10);
       self.setSelectedPageIndex(val);
     });
   }

src/ts/transformers/extract-details-keys.ts

@@ -98,7 +98,7 @@ function parseResponseDetails(entry: Entry): KvTuple[] {
   };
 
   const contentLength = getHeader(headers, "Content-Length");
-  let contentSize = undefined;
+  let contentSize;
   if (content.size !== -1 && contentLength !== content.size.toString()) {
     contentSize = content.size;
   }

src/ts/transformers/har-heuristics.ts

@@ -89,7 +89,7 @@ export function documentIsSecure(data: Entry[]) {
 /** Scans `entry` for noteworthy issues or infos and highlights them */
 export function collectIndicators(entry: Entry, docIsTLS: boolean, requestType: RequestType) {
   // const harEntry = entry;
-  let output: WaterfallEntryIndicator[] = [];
+  const output: WaterfallEntryIndicator[] = [];
 
   if (isPush(entry)) {
     output.push({

src/ts/transformers/har-tabs.ts

@@ -25,7 +25,7 @@ import { makeDefinitionList } from "./helpers";
 export function makeTabs(entry: Entry, requestID: number, requestType: RequestType,
                          startRelative: number, endRelative: number,
                          indicators: WaterfallEntryIndicator[]): WaterfallEntryTab[] {
-  let tabs = [] as WaterfallEntryTab[];
+  const tabs = [] as WaterfallEntryTab[];
 
   const tabsData = getKeys(entry, requestID, startRelative, endRelative);
   tabs.push(makeGeneralTab(tabsData.general, indicators));
@@ -68,14 +68,14 @@ function makeGeneralTab(generalData: KvTuple[], indicators: WaterfallEntryIndica
   let content = "";
 
   // Make indicator sections
-  let errors = indicators
+  const errors = indicators
     .filter((i) => i.type === "error")
     .map((i) => [i.title, i.description] as KvTuple);
-  let warnings = indicators
+  const warnings = indicators
     .filter((i) => i.type === "warning")
     .map((i) => [i.title, i.description] as KvTuple);
   // all others
-  let info = indicators
+  const info = indicators
     .filter((i) => i.type !== "error" && i.type !== "warning")
     .map((i) => [i.title, i.description] as KvTuple);
 

src/ts/transformers/har.ts

@@ -36,7 +36,7 @@ import {
  */
 export function transformDoc(harData: Har | Log, options: HarTransformerOptions): WaterfallDocs {
   // make sure it's the *.log base node
-  let data = (harData["log"] !== undefined ? harData["log"] : harData) as Log;
+  const data = (harData["log"] !== undefined ? harData["log"] : harData) as Log;
   const pages = getPages(data);
 
   return {
@@ -96,7 +96,7 @@ export function transformPage(harData: Har | Log,
                               pageIndex: number = 0,
                               options: HarTransformerOptions): WaterfallData {
   // make sure it's the *.log base node
-  let data = (harData["log"] !== undefined ? harData["log"] : harData) as Log;
+  const data = (harData["log"] !== undefined ? harData["log"] : harData) as Log;
 
   const pages = getPages(data);
   const currPage = pages[pageIndex];
@@ -172,13 +172,13 @@ const getMarks = (pageTimings: PageTiming, currPage: Page, options: HarTransform
  * @param {HarTransformerOptions} options - HAR-parser-specific options
  */
 const getUserTimimngs = (currPage: Page, options: HarTransformerOptions) => {
-  let baseFilter = options.showUserTimingEndMarker ?
+  const baseFilter = options.showUserTimingEndMarker ?
     (k: string) => k.indexOf("_userTime.") === 0 :
     (k: string) => k.indexOf("_userTime.") === 0 && k.indexOf("_userTime.endTimer-") !== 0;
   let filterFn = baseFilter;
 
   if (Array.isArray(options.showUserTiming)) {
-    let findTimings = options.showUserTiming;
+    const findTimings = options.showUserTiming;
     filterFn = (k: string) => (
       baseFilter(k) &&
       findTimings.indexOf(k.replace(/^_userTime\./, "")) >= 0
@@ -224,9 +224,9 @@ const getUserTimimngs = (currPage: Page, options: HarTransformerOptions) => {
  * @returns Array
  */
 const buildDetailTimingBlocks = (startRelative: number, harEntry: Entry): WaterfallEntryTiming[] => {
-  let t = harEntry.timings;
+  const t = harEntry.timings;
   return ["blocked", "dns", "connect", "send", "wait", "receive"].reduce((collect: WaterfallEntryTiming[],
-    key: TimingType) => {
+                                                                          key: TimingType) => {
 
     const time = getTimePair(key, harEntry, collect, startRelative);
 

src/ts/transformers/helpers.ts

@@ -21,11 +21,11 @@ import { makeIcon } from "../waterfall/row/svg-indicators";
  * @returns {string} stringified HTML definition list
  */
 export function makeDefinitionList(dlKeyValues: KvTuple[], addClass: boolean = false) {
-  let makeClass = (key: string) => {
+  const makeClass = (key: string) => {
     if (!addClass) {
       return "";
     }
-    let className = toCssClass(key) || "no-colour";
+    const className = toCssClass(key) || "no-colour";
     return `class="${className}"`;
   };
   return dlKeyValues
@@ -44,7 +44,7 @@ export function mimeToRequestType(mimeType: string): RequestType {
   if (mimeType === undefined) {
     return "other";
   }
-  let types = mimeType.split("/");
+  const types = mimeType.split("/");
   let part2 = types[1];
   // take care of text/css; charset=UTF-8 etc
   if (part2 !== undefined) {
@@ -169,7 +169,7 @@ export function makeMimeTypeIcon(status: number,
  * @param nestedKvPairs - nested `KvTuple`s (possibly sub-nested)
  */
 export const flattenKvTuple = (nestedKvPairs: Array<(KvTuple | KvTuple[])>): KvTuple[] => {
-  let returnKv: KvTuple[] = [];
+  const returnKv: KvTuple[] = [];
   nestedKvPairs.forEach((maybeKv) => {
     if (maybeKv === undefined || maybeKv.length === 0) {
       return;

src/ts/typing/index.ts

@@ -1,5 +1,5 @@
-export * from "./open-overlay"
-export * from "./options"
-export * from "./paging"
-export * from "./rect-data"
-export * from "./waterfall"
+export * from "./open-overlay";
+export * from "./options";
+export * from "./paging";
+export * from "./rect-data";
+export * from "./waterfall";

src/ts/waterfall/details-overlay/html-details-body.ts

@@ -11,8 +11,8 @@ import { WaterfallEntry } from "../../typing/waterfall";
  */
 export function createDetailsBody(requestID: number, detailsHeight: number, entry: WaterfallEntry) {
 
-  let html = document.createElement("html") as HTMLHtmlElement;
-  let body = document.createElement("body");
+  const html = document.createElement("html") as HTMLHtmlElement;
+  const body = document.createElement("body");
   body.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
   html.setAttributeNS("http://www.w3.org/2000/xmlns/", "xmlns", "http://www.w3.org/2000/xmlns/");
 

src/ts/waterfall/details-overlay/overlay-manager.ts

@@ -134,17 +134,17 @@ class OverlayManager {
   private renderOverlays(detailsHeight: number, rowItems: SVGAElement[]) {
     /** shared variable to keep track of heigth */
     let currY = 0;
-    let updateHeight = (overlay, y, currHeight) => {
+    const updateHeight = (overlay, y, currHeight) => {
       currY += currHeight;
       overlay.actualY = y;
       overlay.height = currHeight;
     };
 
-    let addNewOverlay = (overlayHolder: SVGGElement, overlay: OpenOverlay) => {
-      let y = overlay.defaultY + currY;
-      let infoOverlay = createRowInfoOverlay(overlay, y, detailsHeight);
+    const addNewOverlay = (overlayHolder: SVGGElement, overlay: OpenOverlay) => {
+      const y = overlay.defaultY + currY;
+      const infoOverlay = createRowInfoOverlay(overlay, y, detailsHeight);
       // if overlay has a preview image show it
-      let previewImg = infoOverlay.querySelector("img.preview") as HTMLImageElement;
+      const previewImg = infoOverlay.querySelector("img.preview") as HTMLImageElement;
       if (previewImg && !previewImg.src) {
         previewImg.setAttribute("src", previewImg.attributes.getNamedItem("data-src").value);
       }
@@ -155,7 +155,7 @@ class OverlayManager {
       overlayHolder.appendChild(infoOverlay);
       updateHeight(overlay, y, infoOverlay.getBoundingClientRect().height);
     };
-    let updateRow = (rowItem: SVGAElement, index: number) => {
+    const updateRow = (rowItem: SVGAElement, index: number) => {
       const overlay = find(this.openOverlays, (o) => o.index === index);
       const overlayEl = rowItem.nextElementSibling.firstElementChild as SVGGElement;
       this.realignRow(rowItem, currY);
@@ -188,9 +188,9 @@ class OverlayManager {
     };
     rowItems.forEach(updateRow);
   }
-};
+}
 
 export {
-  OverlayManager
+  OverlayManager,
 };
 export default OverlayManager;