refactor(web-ts-results): fix warnings & errors

Author: nakrovati

webdriver-ts-results/src/Common.ts

@@ -1,7 +1,5 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const jStat = require('jstat').jStat;
+import { jStat } from "jstat"
 
 export enum StatisticResult {Slower, Undecided, Faster}
 export enum DisplayMode { DisplayMean, DisplayMedian, BoxPlot }

webdriver-ts-results/src/ResultTable.tsx

@@ -34,7 +34,7 @@ const ResultTable = ({type}: Props): JSX.Element|null => {
         <div key={texts[type].label}>
           <h1>{texts[type].label}</h1>
           <p>{texts[type].description}</p>
-          {cpuDurationMode==CpuDurationMode.Script && <h3>Warning: This is an experimental view. Don't rely on those values yet.</h3>}
+          {cpuDurationMode==CpuDurationMode.Script && <h3>Warning: This is an experimental view. Don&apos;t rely on those values yet.</h3>}
             {
         displayMode === DisplayMode.BoxPlot ?
                 (

webdriver-ts-results/src/index.tsx

@@ -3,13 +3,14 @@ import App from './App';
 import {Provider} from 'react-redux'
 import { createStore } from 'redux'
 import { reducer } from './reducer';
+import { createRoot } from 'react-dom/client';
 
 const store = createStore(reducer)
 
-import { createRoot } from 'react-dom/client';
 
 window.onload = () => {
 
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const root = createRoot(document.getElementById('root')!);
 
   root.render(

webdriver-ts-results/src/reducer.ts

@@ -1,13 +1,12 @@
-import { Benchmark, BenchmarkType, convertToMap, DisplayMode, Framework, FrameworkType, RawResult, Result, ResultTableData, SORT_BY_GEOMMEAN_CPU, Severity, ResultValues, CpuDurationMode, knownIssues } from "./Common"
+import { Benchmark, BenchmarkType, convertToMap, DisplayMode, Framework, FrameworkType, RawResult, Result, ResultTableData, SORT_BY_GEOMMEAN_CPU, ResultValues, CpuDurationMode, knownIssues } from "./Common"
 import { benchmarks as benchmark_orig, frameworks, results as rawResults } from './results';
+import { jStat } from "jstat";
 
 // Temporarily disable script bootup time
 //const benchmarks = benchmark_orig;
 const benchmarks = benchmark_orig.filter(b => b.id !== '32_startup-bt'
         && b.id !== '33_startup-mainthreadcost');
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const jStat = require('jstat').jStat;
+        
 
 const results: Result[] = (rawResults as RawResult[]).map(res => {
   const values: {[k: string]: ResultValues} = {};
@@ -29,7 +28,7 @@ const removeKeyedSuffix = (value: string) => {
   else if (value.endsWith('-keyed')) return value.substring(0, value.length - 6)
   return value;
 }
-const mappedFrameworks = frameworks.map((f:any) => ({ name: f.name, dir: f.dir, displayname: removeKeyedSuffix(f.name), issues: f.issues ?? [], type: f.keyed ? FrameworkType.KEYED : FrameworkType.NON_KEYED, frameworkHomeURL: f.frameworkHomeURL }));
+const mappedFrameworks = frameworks.map((f) => ({ name: f.name, dir: f.dir, displayname: removeKeyedSuffix(f.name), issues: f.issues ?? [], type: f.keyed ? FrameworkType.KEYED : FrameworkType.NON_KEYED, frameworkHomeURL: f.frameworkHomeURL }));
 
 const allBenchmarks = benchmarks.reduce((set, b) => set.add(b), new Set<Benchmark>());
 const allFrameworks = mappedFrameworks.reduce((set, f) => set.add(f), new Set<Framework>());

webdriver-ts-results/src/results.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-loss-of-precision */
 import {RawResult} from './Common';
 
 export const results: RawResult[]=[

webdriver-ts-results/src/tables/BoxPlotTable.tsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useRef } from 'react'
 import {SORT_BY_NAME, Benchmark, Framework, ResultLookup, CpuDurationMode} from '../Common'; 
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const Plotly = require('plotly.js-cartesian-dist');
+import Plotly from 'plotly.js-cartesian-dist';
 
 interface BoxPlotData {
     framework: string;

webdriver-ts-results/src/tables/CpuResultsTable.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import {ResultTableData, SORT_BY_NAME, SORT_BY_GEOMMEAN_CPU, BenchmarkType, Framework} from '../Common'; 
+import {ResultTableData, SORT_BY_NAME, SORT_BY_GEOMMEAN_CPU, BenchmarkType} from '../Common'; 
 import GeomMeanRow from './GeomMeanRow'
 import CompareRow from './CompareRow'
 import ValueResultRow from './ValueResultRow'

webdriver-ts-results/src/types/jstat.d.ts

@@ -0,0 +1,5 @@
+declare module "jstat" {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const jStat: any;
+  export { jStat };
+}

webdriver-ts-results/src/types/plotly.d.ts

@@ -0,0 +1,5 @@
+declare module "plotly.js-cartesian-dist" {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const Plotly: any;
+  export = Plotly;
+}