I use JavaScript files in our Cypress testing.

In mands.js I created a custom mand:

Cypress.Commands.add('selectDropdown', (dropdown) => {
    cy.get('#' + dropdown).click();
})

And in my test file I call it:

cy.selectDropdown('dropdown1');

This is working fine when I run the test in test runner. The only issue is, that my IDE (PhpStorm) doesn't recognize that mand.

Unresolved function or method selectDropdown()

How to 'tell' the IDE, that such mand exists?

UPDATE:

I created an index.d.ts file under support folder (however I use only JS files with Cypress and I have index.js there already).

In that ts file I put:

/// <reference types="cypress" />

declare namespace Cypress {
    interface Chainable<Subject> {
        selectDropdownValue(dropdown, value): Chainable<(string)>;
    }
}

Now the cy.selectDropdownValue mand is recognized in IDE and it seems working fine in test runner, but there are some problems:

1. I'll better avoid creating a new TypeScript file, as I have there index.js already and I am using only JS files in the project

2. declare namespace - 'namespace' and 'module' are disallowed(no-namespace) - this is a Lint warning, so this needs to be replaced somehow

3. Unused interface Chainable. Not sure if I need to have Chainable there as it is unused, and also here selectDropdownValue(dropdown, value): Chainable<(string)>;

Can anyone help, how to recognize the custom mand by IDE in JavaScript way, not TypeScript?

I use JavaScript files in our Cypress testing.

In mands.js I created a custom mand:

Cypress.Commands.add('selectDropdown', (dropdown) => {
    cy.get('#' + dropdown).click();
})

And in my test file I call it:

cy.selectDropdown('dropdown1');

This is working fine when I run the test in test runner. The only issue is, that my IDE (PhpStorm) doesn't recognize that mand.

Unresolved function or method selectDropdown()

How to 'tell' the IDE, that such mand exists?

UPDATE:

I created an index.d.ts file under support folder (however I use only JS files with Cypress and I have index.js there already).

In that ts file I put:

/// <reference types="cypress" />

declare namespace Cypress {
    interface Chainable<Subject> {
        selectDropdownValue(dropdown, value): Chainable<(string)>;
    }
}

Now the cy.selectDropdownValue mand is recognized in IDE and it seems working fine in test runner, but there are some problems:

1. I'll better avoid creating a new TypeScript file, as I have there index.js already and I am using only JS files in the project

2. declare namespace - 'namespace' and 'module' are disallowed(no-namespace) - this is a Lint warning, so this needs to be replaced somehow

3. Unused interface Chainable. Not sure if I need to have Chainable there as it is unused, and also here selectDropdownValue(dropdown, value): Chainable<(string)>;

Can anyone help, how to recognize the custom mand by IDE in JavaScript way, not TypeScript?

• javascript
• typescript
• phpstorm
• cypress
• cypress-cucumber-preprocessor

4 Answers 4

Ok, so I solved it this way as I wrote in my update, just disabled the lint check.

I have checked the built in cypress chainable for some original cypress mands, and there is the same structure so I did it the same way and it works.

// tslint:disable-next-line:no-namespace
declare namespace Cypress {
    interface Chainable<Subject = any> {
        selectDropdownValue(dropdown: string, value: string): Chainable<Subject>;
    }
}

If you are expecting your IDE to get IntelliSense for your custom mands. Check out this document. thanks https://github./cypress-io/cypress-example-todomvc#cypress-intellisense

Double check you have this in your tsconfig.ts

  "include": ["cypress/**/*.ts"]

then your IDE should be able to find the custom cypress mands

You can install "Test Automation" plugin by jetbrains, and then your IDE will work correctly with helpers such cy.selectDropdown('dropdown1').

Find information about the plugin and install it - https://plugins.jetbrains./plugin/20175-test-automation

In my case it helped me. So I didnt have to edit any project files