# @serenity-js/web

> Serenity/JS Screenplay Pattern library offering a flexible, web driver-agnostic approach for interacting with web-based user interfaces and components, suitable for various testing contexts

Latest version **3.48.0** (published 2026-09-15) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install @serenity-js/web
pnpm add @serenity-js/web
yarn add @serenity-js/web
bun add @serenity-js/web
```

## Health

**Score 75/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 3.48.0 |
| Published | 2026-09-15 |
| First published | 2021-12-08 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | ^22.22.2 \|\| ^24.15.0 |
| Dependencies | 3 |
| Unpacked size | 1.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 616 |
| Author | Jan Molak |
| Maintainers | jan-molak |
| Keywords | automation, browser, component, e2e, end-to-end, integration, serenity, serenity-js, screenplay, screenplay-pattern, tdd, bdd, test, testing, web |

## Links

- npm: https://www.npmjs.com/package/@serenity-js/web
- Repository: https://github.com/serenity-js/serenity-js
- Homepage: https://serenity-js.org
- Issues: https://github.com/serenity-js/serenity-js/issues
- Funding: https://github.com/sponsors/serenity-js
- npm.io page: https://npm.io/package/@serenity-js/web

## Dependencies (3)

- [tiny-types](https://npm.io/package/tiny-types.md) 2.0.5
- [@serenity-js/core](https://npm.io/package/@serenity-js/core.md) 3.48.0
- [@serenity-js/assertions](https://npm.io/package/@serenity-js/assertions.md) 3.48.0

## Alternatives

- [duck](https://npm.io/package/duck.md) — 4.2M weekly downloads
- [ava](https://npm.io/package/ava.md) — 560.2K weekly downloads
- [storybook-addon-module-mock](https://npm.io/package/storybook-addon-module-mock.md) — 71.7K weekly downloads
- [vest](https://npm.io/package/vest.md) — 50.1K weekly downloads
- [@ethereum-waffle/mock-contract](https://npm.io/package/@ethereum-waffle/mock-contract.md) — 40.0K weekly downloads

## Recent versions

- 3.48.0 (latest) — 2026-09-15
- 3.47.2 — 2026-09-10
- 3.47.0 — 2026-09-09
- 3.46.1 — 2026-09-04
- 3.46.0 — 2026-08-30
- 3.45.9 — 2026-08-20
- 3.45.8 — 2026-08-20
- 3.45.7 — 2026-08-18
- 3.45.6 — 2026-08-15
- 3.45.5 — 2026-08-14
- 3.45.4 — 2026-08-13
- 3.45.3 — 2026-08-13
- 3.45.2 — 2026-08-13
- 3.45.1 — 2026-08-13
- 3.45.0 — 2026-08-13
- … 178 more at https://npm.io/package/@serenity-js/web/versions

## README

# Serenity/JS Web

[![NPM Version](https://badge.fury.io/js/%40serenity-js%2Fweb.svg)](https://badge.fury.io/js/%40serenity-js%2Fweb)
[![Build Status](https://github.com/serenity-js/serenity-js/actions/workflows/main.yaml/badge.svg?branch=main)](https://github.com/serenity-js/serenity-js/actions)
[![Maintainability](https://qlty.sh/gh/serenity-js/projects/serenity-js/maintainability.svg)](https://qlty.sh/gh/serenity-js/projects/serenity-js)
[![Code Coverage](https://qlty.sh/gh/serenity-js/projects/serenity-js/coverage.svg)](https://qlty.sh/gh/serenity-js/projects/serenity-js)
[![Contributors](https://img.shields.io/github/contributors/serenity-js/serenity-js.svg)](https://github.com/serenity-js/serenity-js/graphs/contributors)
[![Known Vulnerabilities](https://snyk.io/test/npm/@serenity-js/web/badge.svg)](https://snyk.io/test/npm/@serenity-js/web)
[![GitHub stars](https://img.shields.io/github/stars/serenity-js/serenity-js?style=flat)](https://github.com/serenity-js/serenity-js)

[![Follow Serenity/JS on LinkedIn](https://img.shields.io/badge/Follow-Serenity%2FJS%20-0077B5?logo=linkedin)](https://www.linkedin.com/company/serenity-js)
[![Watch Serenity/JS on YouTube](https://img.shields.io/badge/Watch-@serenity--js-E62117?logo=youtube)](https://www.youtube.com/@serenity-js)
[![Join Serenity/JS Community Chat](https://img.shields.io/badge/Chat-Serenity%2FJS%20Community-FBD30B?logo=matrix)](https://matrix.to/#/#serenity-js:gitter.im)
[![Support Serenity/JS on GitHub](https://img.shields.io/badge/Support-@serenity--js-703EC8?logo=github)](https://github.com/sponsors/serenity-js)

[`@serenity-js/web`](https://serenity-js.org/api/web/) provides a
unified, [Screenplay Pattern](https://serenity-js.org/handbook/design/screenplay-pattern)–based library for interacting
with web applications,
enabling maintainable end-to-end and component-level tests across multiple automation engines, including Playwright and
WebdriverIO.

Learn more about [web testing with Serenity/JS](https://serenity-js.org/handbook/web-testing/)!

## Features

- Offers a consistent API for web interactions across different automation engines, making your tests maintainable and
  portable.
- Supports both end-to-end and component-level testing of web applications.
- Integrates seamlessly with popular test runners like
  [Playwright Test](https://serenity-js.org/handbook/test-runners/playwright-test/),
  [WebdriverIO](https://serenity-js.org/handbook/test-runners/webdriverio/),
  [Mocha](https://serenity-js.org/handbook/test-runners/mocha/),
  [Jasmine](https://serenity-js.org/handbook/test-runners/jasmine/),
  and [Cucumber.js](https://serenity-js.org/handbook/test-runners/cucumber/).
- Supports all [Serenity/JS reporting features](https://serenity-js.org/handbook/reporting/)
- TypeScript-first design with strong typing for safer and more predictable test code.

## Installation

```sh
npm install --save-dev @serenity-js/core @serenity-js/web
```

See the [Serenity/JS Installation Guide](https://serenity-js.org/handbook/installation/).

## Quick Start

### Usage with Playwright Test

```ts
import { describe, it } from '@serenity-js/playwright-test'
import { Navigate, Page } from '@serenity-js/web'
import { Ensure, startsWith } from '@serenity-js/assertions'

describe('Website', () => {

    it('should have a title', async ({ actor }) => {

        await actor.attemptsTo(
            Navigate.to('https://serenity-js.org/'),
            Ensure.that(Page.current().title(), startsWith('Serenity/JS')),
        )
    })
})
```

### Usage with WebdriverIO and Mocha

```ts
import { describe, it } from 'mocha'
import { Navigate, Page } from '@serenity-js/web'
import { Ensure, startsWith } from '@serenity-js/assertions'

describe('Website', () => {

    it('should have a title', async () => {

        await actorCalled('Alice').attemptsTo(
            Navigate.to('https://serenity-js.org/'),
            Ensure.that(Page.current().title(), startsWith('Serenity/JS')),
        )
    })
})
```

## Documentation

- [API Reference](https://serenity-js.org/api/)
- [Screenplay Pattern Guide](https://serenity-js.org/handbook/design/screenplay-pattern/)
- [Serenity/JS Project Templates](https://serenity-js.org/handbook/project-templates/)
- [More examples and reference implementations](https://github.com/serenity-js/serenity-js/tree/main/examples)
- [Tutorial: First Web Scenario](https://serenity-js.org/handbook/tutorials/your-first-web-scenario/)
- [Tutorial: First API Scenario](https://serenity-js.org/handbook/tutorials/your-first-api-scenario/)

## Contributing

Contributions of all kinds are welcome! Get started with the [Contributing Guide](https://serenity-js.org/community/contributing/).

## Community

- [Community Chat](https://matrix.to/#/#serenity-js:gitter.im)
- [Discussions Forum](https://github.com/orgs/serenity-js/discussions)
  - Visit the [💡How to... ?](https://github.com/orgs/serenity-js/discussions/categories/how-to) section for answers to common questions

If you enjoy using Serenity/JS, make sure to star ⭐️ [Serenity/JS on GitHub](https://github.com/serenity-js/serenity-js) to help others discover the framework!

## License

The Serenity/JS code base is licensed under the [Apache-2.0](https://opensource.org/license/apache-2-0) license,
while its documentation and the [Serenity/JS Handbook](https://serenity-js.org/handbook/) are licensed under the [Creative Commons BY-NC-SA 4.0 International](https://creativecommons.org/licenses/by-nc-sa/4.0/).

See the [Serenity/JS License](https://serenity-js.org/legal/license/).

## Support

Support ongoing development through [GitHub Sponsors](https://github.com/sponsors/serenity-js). Sponsors gain access to [Serenity/JS Playbooks](https://github.com/serenity-js/playbooks)
and priority help in the [Discussions Forum](https://github.com/orgs/serenity-js/discussions).

For corporate sponsorship or commercial support, please contact [Jan Molak](https://www.linkedin.com/in/janmolak/).

[![GitHub Sponsors](https://img.shields.io/badge/Support%20@serenity%2FJS-703EC8?style=for-the-badge&logo=github&logoColor=white)](https://github.com/sponsors/serenity-js)

---
_Source: https://npm.io/package/@serenity-js/web · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._