Update browser tests in k6/foundations

k6/foundations/11.composability.js

@@ -2,10 +2,10 @@ import http from "k6/http";
 import { check, sleep } from "k6";
 import { Trend, Counter } from "k6/metrics";
 import { textSummary } from "https://jslib.k6.io/k6-summary/0.0.2/index.js";
-import { SharedArray } from 'k6/data';
-import { browser } from "k6/experimental/browser";
+import { SharedArray } from "k6/data";
+import { browser } from "k6/browser";
 
-const BASE_URL = __ENV.BASE_URL || 'http://localhost:3333';
+const BASE_URL = __ENV.BASE_URL || "http://localhost:3333";
 
 export const options = {
   scenarios: {
@@ -19,9 +19,9 @@ export const options = {
       exec: "getPizza",
       executor: "ramping-vus",
       stages: [
-        { duration: '5s', target: 5 },
-        { duration: '10s', target: 5 },
-        { duration: '5s', target: 0 },
+        { duration: "5s", target: 5 },
+        { duration: "10s", target: 5 },
+        { duration: "5s", target: 0 },
       ],
       startTime: "10s",
     },
@@ -35,27 +35,29 @@ export const options = {
           type: "chromium",
         },
       },
-    }
+    },
   },
   thresholds: {
-    http_req_failed: ['rate<0.01'],
-    http_req_duration: ['p(95)<500', 'p(99)<1000'],
-    quickpizza_ingredients: [{ threshold: 'avg<8', abortOnFail: false }],
-    checks: ["rate > 0.95"]
+    http_req_failed: ["rate<0.01"],
+    http_req_duration: ["p(95)<500", "p(99)<1000"],
+    quickpizza_ingredients: [{ threshold: "avg<8", abortOnFail: false }],
+    checks: ["rate > 0.95"],
   },
 };
 
-const pizzas = new Counter('quickpizza_number_of_pizzas');
-const ingredients = new Trend('quickpizza_ingredients');
+const pizzas = new Counter("quickpizza_number_of_pizzas");
+const ingredients = new Trend("quickpizza_ingredients");
 
-const customers = new SharedArray('all my customers', function () {
-  return JSON.parse(open('./data/customers.json')).customers;
+const customers = new SharedArray("all my customers", function () {
+  return JSON.parse(open("./data/customers.json")).customers;
 });
 
 export function setup() {
-  let res = http.get(BASE_URL)
+  let res = http.get(BASE_URL);
   if (res.status !== 200) {
-    throw new Error(`Got unexpected status code ${res.status} when trying to setup. Exiting.`)
+    throw new Error(
+      `Got unexpected status code ${res.status} when trying to setup. Exiting.`
+    );
   }
 }
 
@@ -66,49 +68,55 @@ export function getPizza() {
     excludedIngredients: ["pepperoni"],
     excludedTools: ["knife"],
     maxNumberOfToppings: 6,
-    minNumberOfToppings: 2
-  }
+    minNumberOfToppings: 2,
+  };
   let res = http.post(`${BASE_URL}/api/pizza`, JSON.stringify(restrictions), {
     headers: {
-      'Content-Type': 'application/json',
-      'X-User-ID': customers[Math.floor(Math.random() * customers.length)],
+      "Content-Type": "application/json",
+      "X-User-ID": customers[Math.floor(Math.random() * customers.length)],
     },
   });
   check(res, { "status is 200": (res) => res.status === 200 });
-  console.log(`${res.json().pizza.name} (${res.json().pizza.ingredients.length} ingredients)`);
+  console.log(
+    `${res.json().pizza.name} (${
+      res.json().pizza.ingredients.length
+    } ingredients)`
+  );
   pizzas.add(1);
   ingredients.add(res.json().pizza.ingredients.length);
   sleep(1);
 }
 
 export async function checkFrontend() {
-  const page = browser.newPage();
-
+  let checkData;
+  const page = await browser.newPage();
   try {
-    await page.goto(BASE_URL)
+    await page.goto(BASE_URL);
+    checkData = await page.locator("h1").textContent();
     check(page, {
-      'header': page.locator('h1').textContent() == 'Looking to break out of your pizza routine?',
+      header: checkData == "Looking to break out of your pizza routine?",
     });
 
     await page.locator('//button[. = "Pizza, Please!"]').click();
-    page.waitForTimeout(500);
-    page.screenshot({ path: `screenshots/${__ITER}.png` });
+    await page.waitForTimeout(500);
+    await page.screenshot({ path: "screenshot.png" });
+    checkData = await page.locator("div#recommendations").textContent();
     check(page, {
-      'recommendation': page.locator('div#recommendations').textContent() != '',
+      recommendation: checkData != "",
     });
   } finally {
-    page.close();
+    await page.close();
   }
 }
 
 export function teardown() {
   // TODO: Send notification to Slack
-  console.log("That's all folks!")
+  console.log("That's all folks!");
 }
 
 export function handleSummary(data) {
   return {
-    'summary.json': JSON.stringify(data, null, 2),
+    "summary.json": JSON.stringify(data, null, 2),
     stdout: textSummary(data, { indent: " ", enableColors: true }),
-  }
+  };
 }

k6/foundations/lib/frontend/basic.js

@@ -1,22 +1,25 @@
-import { browser } from 'k6/experimental/browser';
+import { browser } from 'k6/browser';
 import { check } from "k6";
 
 export async function LoadAndCheck(url, headless) {
-  const page = browser.newPage();
+  let checkData;
+  const page = await browser.newPage();
 
   try {
     await page.goto(url)
+    checkData = await page.locator("h1").textContent();
     check(page, {
-      'header': page.locator('h1').textContent() == 'Looking to break out of your pizza routine?',
+      header: checkData == "Looking to break out of your pizza routine?",
     });
 
     await page.locator('//button[. = "Pizza, Please!"]').click();
-    page.waitForTimeout(500);
-    page.screenshot({ path: `screenshots/${__ITER}.png` });
+    await page.waitForTimeout(500);
+    await page.screenshot({ path: `screenshots/${__ITER}.png` });
+    checkData = await page.locator("div#recommendations").textContent();
     check(page, {
-      'recommendation': page.locator('div#recommendations').textContent() != '',
+      recommendation: checkData != "",
     });
   } finally {
-    page.close();
+    await page.close();
   }
 }