Merge pull request #7 from grafana/browser-tests

Browser tests

.github/workflows/browser.yml

@@ -0,0 +1,44 @@
+name: Browser Workflow
+on: [push]
+
+jobs:
+  k6_browser_test:
+    name: k6 browser test
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Install k6 in Ubuntu
+        run: |  
+          sudo gpg -k
+          sudo gpg --no-default-keyring --keyring /usr/share/keyrings/k6-archive-keyring.gpg --keyserver hkp://keyserver.ubuntu.com:80 --recv-keys C5AD17C747E3415A3642D57D77C6C491D6AC1D69
+          echo "deb [signed-by=/usr/share/keyrings/k6-archive-keyring.gpg] https://dl.k6.io/deb stable main" | sudo tee /etc/apt/sources.list.d/k6.list
+          sudo apt-get update
+          sudo apt-get install k6
+
+      # Install Chrome (or chromium) when using ACT, as the default ACT image does not include it.
+      # Note that running the browser in a container like Snap or Flatpak is not supported.
+      - name: Install chrome
+        if: ${{ env.ACT }}
+        run: |  
+          wget -q -O - https://dl.google.com/linux/linux_signing_key.pub | sudo apt-key add -
+          sudo sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google-chrome.list'
+          sudo apt update && sudo apt install -y google-chrome-stable
+
+      # If you plan to run ACT on Apple Silicon, be aware that Chrome has not yet released an arm64 version. In this case, you have to:
+      # 1. Enable the option on Docker Desktop: `Use Rosetta for x86/amd64 emulation on Apple Silicon`
+      # 2. Run ACT using the `--container-architecture linux/amd64` flag. For example: 
+      #    act -W .github/workflows/browser.yml --container-architecture linux/amd64
+
+      - name: Run browser test
+        run: |
+          export K6_BROWSER_HEADLESS=true 
+          export K6_BROWSER_ARGS='no-sandbox' 
+          if [ "$ACT" = "true" ]; then
+            export K6_BROWSER_EXECUTABLE_PATH=/usr/bin/google-chrome
+          fi
+          k6 run browser/script.js 
+        env:
+          ACT: ${{ env.ACT }}

README.md

@@ -15,6 +15,7 @@ Examples:
 | [.github/workflows/docker.yml](.github/workflows/docker.yml)              | Runs on ubuntu-latest, in a docker container created from the official k6 docker image |
 | [.github/workflows/k6_extension.yml](.github/workflows/k6_extension.yml)  | Runs on golang:1.17-alpine, an environment suitable for running k6 extensions          |
 | [.github/workflows/local-service.yml](.github/workflows/local-service.yml)  | Runs side by side with the system under test, Quickpizza          |
+| [.github/workflows/browser.yml](.github/workflows/browser.yml)  | Runs browser tests         |
 
 More complex examples could be combined from the basic examples from the list above.
 

browser/script.js

@@ -0,0 +1,31 @@
+import { browser } from "k6/experimental/browser";
+import { check } from "k6";
+
+export const options = {
+  scenarios: {
+    ui: {
+      executor: "shared-iterations",
+      options: {
+        browser: {
+          type: "chromium",
+        },
+      },
+    },
+  },
+};
+
+export default async function () {
+  const page = browser.newPage();
+
+  try {
+    await page.goto('https://test.k6.io/');
+    check(page, {
+      header:
+        page.locator("title").textContent() ==
+        "Demo website for load testing",
+    });
+
+  } finally {
+    page.close();
+  }
+}