1. @web/test-runner
Test runner for web applications
@web/test-runner
Package: @web/test-runner
Created by: modernweb-dev
Last modified: Wed, 06 Mar 2024 12:18:11 GMT
Version: 0.18.1
License: MIT
Downloads: 193,855
Repository: https://github.com/modernweb-dev/web

Install

npm install @web/test-runner
yarn add @web/test-runner

Web Test Runner

Test runner for web applications.

👉   Headless browsers with Puppeteer, Playwright, or Selenium.

🚧   Reports logs, 404s, and errors from the browser.

🔍   Debug opens a real browser window with devtools.

📦   Mock es modules using Import Maps.

🔧   Exposes browser properties like viewport size and dark mode.

⏱  Runs tests in parallel and isolation.

👀   Interactive watch mode.

🏃   Fast development by rerunning only changed tests.

🚀   Powered by esbuild and rollup plugins

See our website for full documentation.

Installation

Install the web test runner:

npm i --save-dev @web/test-runner

Basic commands

Do a single test run:

web-test-runner test/**/*.test.js --node-resolve
wtr test/**/*.test.js --node-resolve

Run in watch mode, reloading on file changes:

web-test-runner test/**/*.test.js --node-resolve --watch
wtr test/**/*.test.js --node-resolve --watch

Run with code coverage profiling (this is slower):

web-test-runner test/**/*.test.js --node-resolve --coverage
wtr test/**/*.test.js --node-resolve --coverage

Transform JS to a compatible syntax based on user agent:

web-test-runner test/**/*.test.js --node-resolve --esbuild-target auto
wtr test/**/*.test.js --node-resolve --esbuild-target auto

Guide

Check out this step by step guide to get started.

Example projects

Check out the example projects for a fully integrated setup.

Documentation

See our website for full documentation.

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin