1. karma-webkit-launcher
A Karma plugin. Launcher for Webkit.
karma-webkit-launcher
Package: karma-webkit-launcher
Created by: google
Last modified: Mon, 04 Dec 2023 17:23:40 GMT
Version: 2.4.0
License: Apache-2.0
Downloads: 30,283
Repository: https://github.com/google/karma-webkit-launcher

Install

npm install karma-webkit-launcher
yarn add karma-webkit-launcher

karma-webkit-launcher

Build status: Playwright (MacOS)
Build status: Playwright (Ubuntu)
Build status: Playwright (Windows)
Build status: Epiphany
NPM version

NPM

Karma Launcher for Apple's Webkit

Installation

The easiest way is to keep karma-webkit-launcher as a devDependency in your package.json, by running

 npm install karma-webkit-launcher --save-dev

Supported WebKit-Launcher

This karma-webkit-launcher provides the following browser launcher.

Karma Runner Browsers ENV Type CI note
WebKit WEBKIT_BIN Native / Playwright / Safari (MacOS only) -
WebKitHeadless WEBKIT_HEADLESS_BIN Native / Playwright -
Safari SAFARI_BIN Native MacOS only not supported
Epiphany EPIPHANY_BIN Native Ubuntu only needs xvfb-run

Configuration

For the configuration just add Webkit or WebkitHeadless in your browser list.

 // karma.conf.js
export default (config) => {
  config.set({
    browsers: ['Webkit'],  // You may use 'WebkitHeadless' or other supported browser

You can pass the list of browsers as a CLI argument too:

 karma start --browsers Webkit

Headless Webkit with Playwright / Playwright-Webkit

Playwright is a Node.js library to automate Chromium, Firefox and WebKit with a single API. Playwright is built to enable cross-browser web automation that is ever-green, capable, reliable and fast.

Headless execution is supported for all the browsers on all platforms.
Check out system requirements for details.

If no environment variable is set and Playwright is available, it will be automatically utilized.
Additionally, if you exclusively intend to perform WebKit testing, you can install 'playwright-webkit' exclusively for that purpose.

Example Usage

Installing Playwright and karma-webkit-launcher

 npm install playwright karma-webkit-launcher --save-dev

Example Karma configuration

 // karma.conf.js
module.exports = function (config) {
  config.set({
    browsers: ["WebkitHeadless"],
  });
};

Manually define Playwright executable

To force the use of Playwright over an local Webkit instance, just overwrite the WEBKIT_HEADLESS_BIN or WEBKIT_BIN environment variable.

 // karma.conf.js
import playwright from "playwright";
process.env.WEBKIT_HEADLESS_BIN = playwright.webkit.executablePath();

module.exports = function (config) {
  config.set({
    browsers: ["WebkitHeadless"],
  });
};

Advanced Topics

Detected if Safari or Playwright is used

In some instances it is helpful to detect if Playwright or a real Safari Browser is used.
For this reason it's possible to detect which kind of browser is currently running the tests over this runner.

 if (
  new URLSearchParams(document.referrer || window.location.search).get(
    "test_browser"
  ) == "Playwright"
) {
  // Playwright specific tests
}

See: Playwright Karma Test

 if (
  new URLSearchParams(document.referrer || window.location.search).get(
    "test_browser"
  ) == "Safari"
) {
  // Safari specific tests
}

See: Safari Karma Test

For more information on Karma see the Karma Homepage.

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code