Registry / testing / cypress-runner-themes

cypress-runner-themes

library1.0.4jsnpmunverified

Cypress Runner Themes is a utility package providing alternative visual themes for the Cypress Test Runner, supporting versions 10 and higher. Its current stable version is v1.0.4, with releases occurring periodically to maintain compatibility with new Cypress major versions or address bug fixes. The package offers 'dark', 'light', and 'colorblind' modes, consolidating functionality often found in separate packages like `cypress-dark` or `cypress-light-theme`. A key differentiator is its specific colorblind mode designed for Deutan and Protan types, which changes passing tests to yellow and failing to red. Users enable themes by setting an environment variable in `cypress.config.js` and importing the package for its side effects, though themes currently only apply after the first test run.

testing

npm install cypress-runner-themes

github ↗package ↗

INSTALL

IMPORT

SIG · CYPRESS-RUNNER-THE

cypress-runner-themes

testingjavascriptv1.0.4

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

Side Effect Import

✓ import 'cypress-runner-themes';

✗ const theme = require('cypress-runner-themes');

This package is imported for its side effects (applying CSS themes) and does not export any symbols for direct use. It is primarily used in ESM contexts within Cypress support files.

Installs the package, configures a dark theme via `cypress.config.js`, and imports the theme plugin in the `support/e2e.js` file, demonstrating how to apply visual themes to the Cypress Test Runner.

npm install --save-dev cypress-runner-themes // cypress.config.js const { defineConfig } = require('cypress'); module.exports = defineConfig({ e2e: { setupNodeEvents(on, config) { // implement node event listeners here }, specPattern: 'cypress/e2e/**/*.cy.{js,jsx,ts,tsx}', }, env: { theme: 'dark' // Set your desired theme here: 'dark', 'light', or 'colorblind' } }); // cypress/support/e2e.js (or equivalent support file) import 'cypress-runner-themes';

Debug

Known issues

gotchaThemes may break unexpectedly with future Cypress Test Runner updates. The package relies on internal Cypress UI structures, which are subject to change.

fix

Monitor the package's GitHub repository for updates and compatibility fixes after upgrading Cypress. Report issues if a theme breaks following a Cypress update.

affects: >=1.0.0

gotchaThe applied theme will only become visible in the Cypress Test Runner after the first test has started running. There is currently no hook to inject the theme on initial runner load.

fix

After launching the Cypress Test Runner, start or run any test to see the theme applied. It will not appear immediately upon opening the runner.

affects: >=1.0.0

deprecatedThe `colorblind` theme is explicitly named. Future versions plan to remove explicit theme names like 'Colorblind' and integrate toggle functionality within the runner itself, potentially changing how themes are selected.

fix

Be aware that the current `env.theme` configuration method for the `colorblind` theme might evolve in future major versions. Consult the package's changelog for migration guides when updating.

affects: >=1.0.0

Errors

Common errors & fixes

Cypress Test Runner appears with default theme despite configuration.

The theme is applied only after the first test begins, or configuration/import is missing.

fix

Ensure `env.theme` is correctly set in `cypress.config.js` (e.g., `theme: 'dark'`) and `import 'cypress-runner-themes';` is present in your primary Cypress support file (e.g., `cypress/support/e2e.js`). Then, run at least one test in the Cypress Test Runner.

Upgrade

Version history

1.0.4latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

6 hits · last 30 days

node

Resources

githubhttps://github.com/dingraham/cypress-runner-themes ↗

packagehttps://www.npmjs.com/package/cypress-runner-themes ↗