Cypress: Reusing spec.js files to reduce code and being more DRY

[kwoxer]

Current behavior:

1. Create e.g. a registration.spec.js (does a full registration process)
2. Create e.g. a offer.spec.js (does click on a offer link and starts booking, then coming to the register page and doing a full registration process)

Desired behavior:

1. Create e.g. a registration.spec.js (does a full registration process)
2. Create e.g. a offer.spec.js (does click on a offer link and imports the registration.spec.js)

Versions

Cypress 3.2.0
Ubuntu 18.04

Why that procedure?

Because I would like to reduce core. DRY principle. Is there a proper way to solve this. Or is rewriting specs and repeating stuff the best and already a proper way to solve this in cypress?

I was not able to find a good solution. The only way I could think of is to create a custom function. But with reusing spec.js files I think this would be more modular.

[Lakitna]

You can take a look at custom commands https://on.cypress.io/custom-commands#Best-Practices

You could use plain old javascript imports to create dynamically generated tests https://on.cypress.io/writing-and-organizing-tests#Dynamically-Generate-Tests For example:

// offer.spec.js
before(function() {
    require('registration.spec.js');
});

Also take a look at best practices, specifically this part about skipping ui in certain cases https://on.cypress.io/best-practices#Organizing-Tests-Logging-In-Controlling-State

[kwoxer]

Sounds great. Gonna test it.

[brian-mann]

Read through the best practices and watch this talk I gave last year: https://on.cypress.io/best-practices#Organizing-Tests-Logging-In-Controlling-State

[kwoxer]

I think I need some help. Here is what I tried out and yeah it did not work. I'm not sure what my issue is.

_First I tried:_

const cypress = require('cypress')
cypress.run({
  spec: './cypress/integration/examples/actions.spec.js'
})

that says: Error: Your OS "browser" is currently not supported by node-cachedir.
I'm not sure what that message has to do with an require. Tested with Chrome 71 and Chromium 73.

_Afterwards I tried:_

before(function() {
    require('registration.spec.js');
});

that says: Error: Cannot find module 'registration.spec.js' from '/opt/cypress/cypress/integration'

The spec file exists.

Do you have any idea? I'm totally out of ideas currently.

[jennifer-shehane]

What file did you add the require('cypress') code in?

[kwoxer]

The are both .spec.js files. One is for the registration only. The other one as I said should contain that registration specs and add some more.

Both are located in the same folder.

[kwoxer]

Would be awesome to get just one hint on this. I think this is important for all the developers who want to write clean code and reusing code fragments.

[cwellmer-daparto]

_Afterwards I tried:_

before(function() {
    require('registration.spec.js');
});

that says: Error: Cannot find module 'registration.spec.js' from '/opt/cypress/cypress/integration'

The spec file exists.

Do you have any idea? I'm totally out of ideas currently.

Use simplified:

require('/opt/cypress/cypress/integration/registration.spec.js')

or if you like it relative:

require('./registration.spec.js')