cypress-element
TypeScript icon, indicating that this package has built-in type declarations

0.2.0 • Public • Published

🎁 cypress-element

Test status License: MIT TypeScript npm version

Composition api for cypress

cypress-element – Simple, Composable, Customisable, Reusable, Friendly for developer library written on TypeScript for writing tests on Cypress

Screenshot

Main concept

  • Simple: Everything is an element
  • 🌳Composable: element can be organized by composition of elements hierarchy
  • 🛠Customisable: You can create own elements
  • Reusable: You can save elements hierarchy
  • Friendly: TypeScript first, autocomplete, auto type

Installing

npm i -D cypress-element
# or
yarn add -D cypress-element

Usage

Then, in your test, you can write

import { el } from "cypress-element";
// or
// import el from 'cypress-element';

// ...

const page = el("div", {
  button: el("button"),
});

it("test", () => {
  page.visit("/test.html");
  page.button.click();
});

Additional information

Read more in documentation;

Motivation

Today real app usually work on one of frameworks: React, Vue, Agular. All popular frontend framework base on two concepts: composition structures and idea of everything is a component. We can use same ideas in tests for real app, and take benefits of this.

Examples

You found examples of usage in test folder

Readme

Keywords

Package Sidebar

Install

npm i cypress-element

Weekly Downloads

0

Version

0.2.0

License

ISC

Unpacked Size

12.4 kB

Total Files

17

Last publish

Collaborators

  • dragorww