All Projects → NoelDeMartin → cypress-laravel

NoelDeMartin / cypress-laravel

Licence: MIT License
Cypress plugin to test Laravel applications

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language
shell
77523 projects

Projects that are alternatives of or similar to cypress-laravel

cypress-dotenv
Cypress plugin that enables compatability with dotenv
Stars: ✭ 47 (+80.77%)
Mutual labels:  cypress
cypress-plugin-stripe-elements
A small Cypress plugin that assists you in filling in Stripe Elements inputs
Stars: ✭ 22 (-15.38%)
Mutual labels:  cypress
awesome-address-book
This project shows a basic address book built with ReactJS, Redux Toolkit and Typescript 📖
Stars: ✭ 20 (-23.08%)
Mutual labels:  cypress
split-tests
Split test files in Jest and Cypress into parallel CI jobs
Stars: ✭ 22 (-15.38%)
Mutual labels:  cypress
eslint-config-adjunct
A reasonable collection of plugins to use alongside your main esLint configuration
Stars: ✭ 39 (+50%)
Mutual labels:  cypress
vue3-realworld-example-app
Explore the charm of Vue composition API! Vite?
Stars: ✭ 364 (+1300%)
Mutual labels:  cypress
nextjs-starter-kit
NextJS Starter Kit with Testing Frameworks and CI/CD
Stars: ✭ 30 (+15.38%)
Mutual labels:  cypress
cypress-websocket-testing
Test WebSocket connections with Cypress
Stars: ✭ 65 (+150%)
Mutual labels:  cypress
cypress-xhr-responses-recording
No description or website provided.
Stars: ✭ 19 (-26.92%)
Mutual labels:  cypress
babel-plugin-remove-test-ids
🐠 Babel plugin to strip `data-test-id` HTML attributes
Stars: ✭ 40 (+53.85%)
Mutual labels:  cypress
cypress-faq
As perguntas mais frequentes sobre Cypress respondidas em PT-BR
Stars: ✭ 101 (+288.46%)
Mutual labels:  cypress
example-percy-cypress
Example app demonstrating Percy's Cypress integration.
Stars: ✭ 48 (+84.62%)
Mutual labels:  cypress
metasfresh-webui-frontend-legacy
metasfresh Webui Frontend
Stars: ✭ 57 (+119.23%)
Mutual labels:  cypress
todo-graphql-example
Example Todo app on top of json-graphql-server
Stars: ✭ 20 (-23.08%)
Mutual labels:  cypress
daruma-backend
🎎 Shared Expense Manager (Backend) - NestJS+DDD+CQRS+Event Sourcing 🎎
Stars: ✭ 70 (+169.23%)
Mutual labels:  cypress
Ocelot-Social
Free and open-source social network for active citizenship.
Stars: ✭ 49 (+88.46%)
Mutual labels:  cypress
next-ts-graphql-apollo-starter
An opiniated Next powered starter which include support for Apollo with GraphQL SSR support, codegen, styled component / system, framer motion and Cypress
Stars: ✭ 18 (-30.77%)
Mutual labels:  cypress
cypress-auto-stub-example
Example project to demonstrate how to record/replay API with Cypress.
Stars: ✭ 52 (+100%)
Mutual labels:  cypress
cypress-mochawesome-reporter
Zero config Mochawesome reporter for Cypress with screenshots
Stars: ✭ 48 (+84.62%)
Mutual labels:  cypress
cypress-example-docker-compose
Example running Cypress tests against Apache server via docker-compose
Stars: ✭ 106 (+307.69%)
Mutual labels:  cypress

Cypress Laravel

This Cypress plugin exposes commands and functions to test Laravel applications. In order to use it, the Laravel app must have the laravel-cypress package installed.

You can read the following article to learn how this works: Testing Laravel Applications Using Cypress.

Installation

Install the package using npm:

npm install cypress-laravel --save-dev

And add the following at the beginning of your setup file at cypress/support/index.js:

import { useCypressLaravel } from 'cypress-laravel';

useCypressLaravel();

// ...

Swapping env files

If you want to use a specific environment file to run Cypress tests, you can create a .env.cypress file in your Laravel application and it will be swapped when the tests are running.

For this to work properly, Cypress should be installed in the root of the Laravel application. Additionally, you should register the plugin in your cypress/plugins/index.js file like this:

module.exports = (on, config) => {
    require('cypress-laravel/plugins')(on, config);

    return config;
};

Custom Laravel url

By default, the plugin assumes that the frontend under test is being served on the same domain as the laravel application.

If that's not the case, you can specify a different url setting the env.laravelUrl property in your cypress.json config file:

{
    "baseUrl": "http://frontend.test",
    "env": {
        "laravelUrl": "http://backend.test"
    }
}

You can also override this value by setting the CYPRESS_LARAVEL_URL env variable:

CYPRESS_LARAVEL_URL=http://backend.test npm run cypress

Commands

This package includes typescript definitions, check them out to learn about the full API.

create

Create models using Laravel factories.

cy.create('App\\User', 3, { is_admin: false })
  .then(users => {
      // ...
  });

Quantity and attributes are optional arguments.

login / logout

Login or logout a user with Laravel's authentication. User id and authentication guard can be specified.

The user object will also be wrapped as user, so it can be retrieved later on calling cy.get('@user').

cy.login().then(user => {
    // ...
});

// ...

cy.logout();

artisan

Call an artisan command.

cy.artisan('migrate:fresh');

This yields the output of the artisan command, so it can be used to get json output of some commands, for example:

cy.artisan('route:list --json').then(routes => {
    // `routes` will be an array of objects.
});

Define your own commands

If you need a command that isn't included in this package, you can define it using some helpers.

In the Laravel app, register the command in a Service Provider:

public function boot() {
    Cypress::command('greet', function (string $name) {
        return "Hello $name!";
    });
}

And declare it in your Cypress setup file:

useCypressLaravel({ commands: ['greet'] });

You can call custom commands in the same way that you call other commands:

cy.greet('Guest').then(greeting => {
    expect(greeting).to.equal('Hello Guest!');
});

Functions

useDatabaseMigrations

This function can be used in tests that interact with the database. It will reset the database before each test is executed.

describe('Feature', () => {

    useDatabaseMigrations();

    it('should do something with the database', () => {
        //...
    });

})

Sandbox project

To see a working example with different use-cases, check out the following project: laravel-cypress-sandbox.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].