Merge branch 'master' of github.com:krausest/js-framework-benchmark

Author: krausest

webdriver-ts-results/src/results.ts

@@ -284,14 +284,16 @@ if (process.env.HOST) {
 async function main() {
   let runBenchmarksArgs: string[] =  (args.benchmark && args.benchmark.length > 0) ? args.benchmark : [""];
   let runBenchmarks: Array<BenchmarkInfo> = benchmarkInfos.filter((b) =>
+    // afterframe currently only targets CPU benchmarks
+    (config.BENCHMARK_RUNNER !== BENCHMARK_RUNNER.WEBDRIVER_AFTERFRAME || b.type == BenchmarkType.CPU) && 
     runBenchmarksArgs.some((name) => b.id.toLowerCase().indexOf(name) > -1)
   );
 
 
   let runFrameworks: FrameworkData[];
   let matchesDirectoryArg = (directoryName: string) =>
     frameworkArgument.length == 0 || frameworkArgument.some((arg: string) => arg == directoryName);
-  runFrameworks = await initializeFrameworks(matchesDirectoryArg);
+  runFrameworks = (await initializeFrameworks(matchesDirectoryArg)).filter(f => f.keyed || config.BENCHMARK_RUNNER !== BENCHMARK_RUNNER.WEBDRIVER_AFTERFRAME);
 
   console.log("ARGS.smotest", args.smoketest)
   if (args.smoketest) {

webdriver-ts-results/table.html

@@ -5,6 +5,7 @@ import { config, FrameworkData } from "./common.js";
 import {
   clickElementById,
   clickElementByXPath,
+  findById,
   findByXPath,
   getTextByXPath, mainRoot, retry, testClassContains, testElementLocatedById, testElementLocatedByXpath,
   testElementNotLocatedByXPath, testTextContains
@@ -92,15 +93,15 @@ async function measureClickForElement(driver: WebDriver, elem: WebElement) {
 }
 
 async function measureClickElementById(driver: WebDriver, id: string, isInButtonArea: boolean) {
-  let elem = await mainRoot(driver, isInButtonArea);
-  elem = await elem.findElement(By.id(id));
-  measureClickForElement(driver, elem);
+  let elem = await findById(driver, id, isInButtonArea);
+  console.log("measureClickElementById: ", elem);
+  await measureClickForElement(driver, elem);
 }
 
 async function measureClickElementByXPath(driver: WebDriver, xpath: string, isInButtonArea: boolean) {
   let elem = await findByXPath(driver, xpath, isInButtonArea);
   if (!elem) throw `measureClickElementById ${xpath} failed. Element was not found.`;
-  measureClickForElement(driver, elem);
+  await measureClickForElement(driver, elem);
 }
 
 

webdriver-ts/results.json

@@ -9,7 +9,7 @@ import { BenchmarkType, DurationMeasurementMode } from "./benchmarksCommon.js";
 let config: TConfig = defaultConfig;
 
 // necessary to launch without specifiying a path
-require("chromedriver");
+import "chromedriver";
 
 interface Timingresult {
   type: string;

webdriver-ts/src/benchmarkRunner.ts

@@ -54,24 +54,33 @@ async function runCPUBenchmark(
   console.log("benchmarking ", framework, benchmark.benchmarkInfo.id);
   let driver: WebDriver = null;
   try {
+    // let driver = buildDriver(benchmarkOptions); 
     let driver = await new Builder()
       .forBrowser(benchmarkOptions.browser)
       .build(); 
+    console.log(`using afterframe measurement with ${benchmarkOptions.browser}`)
     await driver.manage().window().maximize();
 
     for (let i = 0; i < benchmarkOptions.batchSize; i++) {
       setUseShadowRoot(framework.useShadowRoot);
       setUseRowShadowRoot(framework.useRowShadowRoot);
       setShadowRootName(framework.shadowRootName);
       setButtonsInShadowRoot(framework.buttonsInShadowRoot);
+      console.log("runCPUBenchmark: before loading page")
       // must be run with an IP adress otherwise Safari crashes with an error. 
       // Use the HOST env variable to set the HOST to an IP adress for safari!
       await driver.get(`http://${benchmarkOptions.HOST}:${benchmarkOptions.port}/${framework.uri}/index.html`);
+      // Needed for Firefox
+      await driver.sleep(50);
+      console.log("runCPUBenchmark: initBenchmark")
       await initBenchmark(driver, benchmark, framework);
+      console.log("runCPUBenchmark: runBenchmark")
       await runBenchmark(driver, benchmark, framework);
+      console.log("runCPUBenchmark: getAfterframeDurations")
       results.push(...getAfterframeDurations());              
+      console.log("runCPUBenchmark: loop end")
     }
-    console.log("quit");
+    console.log("runCPUBenchmark: driver.quit");
     await driver.quit();
     return { error, warnings, result: results };
   } catch (e) {

webdriver-ts/src/benchmarksWebdriverAfterframe.ts

@@ -28,9 +28,9 @@ export function setButtonsInShadowRoot(val: boolean) {
   buttonsInShadowRoot = val;
 }
 
-function convertPath(path: string): Array<PathPart> {
+function convertPath(path: string): string {
   let parts = path.split(/\//).filter((v) => !!v);
-  let res: Array<PathPart> = [];
+  let res = [];
   for (let part of parts) {
     let components = part.split(/\[|]/).filter((v) => !!v);
     let tagName = components[0];
@@ -44,54 +44,29 @@ function convertPath(path: string): Array<PathPart> {
     } else {
       index = 1;
     }
-    res.push({ tagName, index });
+    res.push(`${tagName}:nth-of-type(${index})`);
   }
-  return res;
+  return res.join(" ");
 }
 
-async function shadowRoot(driver: WebDriver, selector: string): Promise<WebElement> {
-  const el = await driver.findElement(By.css(selector));
-  return driver.executeScript(`return arguments[0].shadowRoot`, el);
+export async function findById(driver: WebDriver, id: string, isInButtonArea: boolean): Promise<WebElement> 
+{
+  let root= mainRoot(driver, isInButtonArea);
+  if (config.LOG_DEBUG) console.log("findById selector ", `${root}.querySelector('#${id}')`);
+  return await (driver.executeScript(`return ${root}.querySelector('#${id}')`) as Promise<WebElement>)
 }
 
 // Fake findByXPath for simple XPath expressions to allow usage with shadow dom
 export async function findByXPath(driver: WebDriver, path: string, isInButtonArea: boolean): Promise<WebElement> {
-  let root = await mainRoot(driver, isInButtonArea);
   let paths = convertPath(path);
-  let n = root;
+  let root = mainRoot(driver, isInButtonArea);
   try {
-    for (let p of paths) {
-      let elem;
-      if (useRowShadowRoot && p.tagName === "tr") {
-        try {
-          const shadowHost = await shadowRoot(driver, `benchmark-row:nth-of-type(${p.index})`);
-          elem = await shadowHost.findElement(By.tagName("tr"));
-          if (elem === null) {
-            return null;
-          }
-        } catch (err) {
-          return null;
-        }
-      } else {
-        let elems = await n.findElements(By.css(p.tagName + ":nth-of-type(" + p.index + ")"));
-        if (elems == null || elems.length == 0) {
-          return null;
-        }
-        elem = elems[0];
-      }
-
-      n = elem;
-    }
+    if (config.LOG_DEBUG) console.log("findByXPath: selector = ", `return ${root}.querySelector('${paths}')`);
+     return await driver.executeScript(`return ${root}.querySelector('${paths}')`) 
   } catch (e) {
     //can happen for StaleElementReferenceError
     return null;
   }
-  return n;
-}
-
-function elemNull(v: any) {
-  console.log("*** ELEMENT WAS NULL");
-  return false;
 }
 
 function waitForCondition(driver: WebDriver) {
@@ -107,6 +82,7 @@ export async function testTextContains(driver: WebDriver, xpath: string, text: s
     `testTextContains ${xpath} ${text}`,
     async function (driver) {
       try {
+        if (config.LOG_DEBUG) console.log("testTextContains", xpath);
         let elem = await findByXPath(driver, xpath, isInButtonArea);
         if (elem == null) return false;
         let v = await elem.getText();
@@ -119,8 +95,8 @@ export async function testTextContains(driver: WebDriver, xpath: string, text: s
   );
 }
 
-export function testTextNotContained(driver: WebDriver, xpath: string, text: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
-  return waitForCondition(driver)(
+export async function testTextNotContained(driver: WebDriver, xpath: string, text: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
+  return await waitForCondition(driver)(
     `testTextNotContained ${xpath} ${text}`,
     async function (driver) {
       try {
@@ -136,8 +112,8 @@ export function testTextNotContained(driver: WebDriver, xpath: string, text: str
   );
 }
 
-export function testClassContains(driver: WebDriver, xpath: string, text: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
-  return waitForCondition(driver)(
+export async function testClassContains(driver: WebDriver, xpath: string, text: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
+  return await waitForCondition(driver)(
     `testClassContains ${xpath} ${text}`,
     async function (driver) {
       try {
@@ -153,8 +129,8 @@ export function testClassContains(driver: WebDriver, xpath: string, text: string
   );
 }
 
-export function testElementLocatedByXpath(driver: WebDriver, xpath: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
-  return waitForCondition(driver)(
+export async function testElementLocatedByXpath(driver: WebDriver, xpath: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
+  return await waitForCondition(driver)(
     `testElementLocatedByXpath ${xpath}`,
     async function (driver) {
       try {
@@ -168,12 +144,13 @@ export function testElementLocatedByXpath(driver: WebDriver, xpath: string, time
   );
 }
 
-export function testElementNotLocatedByXPath(driver: WebDriver, xpath: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
-  return waitForCondition(driver)(
+export async function testElementNotLocatedByXPath(driver: WebDriver, xpath: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
+  return await waitForCondition(driver)(
     `testElementNotLocatedByXPath ${xpath}`,
     async function (driver) {
       try {
         let elem = await findByXPath(driver, xpath, isInButtonArea);
+        if (config.LOG_DEBUG) console.log("testElementNotLocatedByXPath", xpath, elem);
         return elem ? false : true;
       } catch (err) {
         console.log("ignoring error in testElementNotLocatedByXPath for xpath = " + xpath, err.toString().split("\n")[0]);
@@ -183,14 +160,15 @@ export function testElementNotLocatedByXPath(driver: WebDriver, xpath: string, t
   );
 }
 
-export function testElementLocatedById(driver: WebDriver, id: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
-  return waitForCondition(driver)(
+export async function testElementLocatedById(driver: WebDriver, id: string, timeout = config.TIMEOUT, isInButtonArea: boolean) {
+  return await waitForCondition(driver)(
     `testElementLocatedById ${id}`,
     async function (driver) {
       try {
-        let elem = await mainRoot(driver, isInButtonArea);
-        elem = await elem.findElement(By.id(id));
-        return true;
+        let root= mainRoot(driver, isInButtonArea);
+        if (config.LOG_DEBUG) console.log("testElementLocatedById selector ",`return ${root}.querySelector('#${id}')`);
+        let elem = await driver.executeScript(`return ${root}.querySelector('#${id}')`)
+        return !!elem;
       } catch (err) {
         // console.log("ignoring error in testElementLocatedById for id = "+id,err.toString().split("\n")[0]);
       }
@@ -212,16 +190,16 @@ export async function retry<T>(retryCount: number, driver: WebDriver, fun: (driv
 
 // Stale element prevention. For aurelia even after a testElementLocatedById clickElementById for the same id can fail
 // No idea how that can be explained
-export function clickElementById(driver: WebDriver, id: string, isInButtonArea: boolean) {
-  return retry(5, driver, async function (driver) {
-    let elem = await mainRoot(driver, isInButtonArea);
-    elem = await elem.findElement(By.id(id));
+export async function clickElementById(driver: WebDriver, id: string, isInButtonArea: boolean) {
+  return await retry(5, driver, async function (driver) {
+    let elem = await findById(driver, id, isInButtonArea);
+    if (config.LOG_DEBUG) console.log("clickElementById: ", elem);
     await elem.click();
   });
 }
 
-export function clickElementByXPath(driver: WebDriver, xpath: string, isInButtonArea: boolean) {
-  return retry(5, driver, async function (driver, count) {
+export async function clickElementByXPath(driver: WebDriver, xpath: string, isInButtonArea: boolean) {
+  return await retry(5, driver, async function (driver, count) {
     if (count > 1 && config.LOG_DETAILS) console.log("clickElementByXPath ", xpath, " attempt #", count);
     let elem = await findByXPath(driver, xpath, isInButtonArea);
     await elem.click();
@@ -238,15 +216,15 @@ export async function getTextByXPath(driver: WebDriver, xpath: string, isInButto
   });
 }
 
-export async function mainRoot(driver: WebDriver, isInButtonArea: boolean): Promise<WebElement> {
+export function mainRoot(driver: WebDriver, isInButtonArea: boolean): string {
   if (useShadowRoot) {
     if (!buttonsInShadowRoot && isInButtonArea) {
-      return await driver.findElement(By.tagName("body"));
+      return "document.querySelector('body')";
     } else {
-      return shadowRoot(driver, shadowRootName);
+      return `document.querySelector('${shadowRootName}').shadowRoot`
     }
   } else {
-    return driver.findElement(By.tagName("body"));
+      return "document.querySelector('body')"
   }
 }
 
@@ -259,6 +237,7 @@ export function buildDriver(benchmarkOptions: BenchmarkDriverOptions): WebDriver
   let args = [
     "--js-flags=--expose-gc",
     "--enable-precise-memory-info",
+    "--flag-switches-begin","--enable-zero-copy","--enable-features=RawDraw","--flag-switches-end",
     // "--enable-gpu-rasterization",
     "--no-first-run",
     "--disable-background-networking",