top of page
Search

Custom Commands in Cypress

Writer's picture: Coding CampCoding Camp

You can add your own command or overwrite an existing command using custom commands in cypress.


You can see two '.js' files under support folder,




In command.js file you can add your own commands. To add a new command, you can use,


Cypress.Commands.add('commandName',()=>{
        //Implementation
})

In your test file, you can use


cy.commandName()

to call your own command in test file.


To overwrite an existing command,


Cypress.Commands.overwrite('commandName',(arguments)=>{
        //Implementation
})

to use that overwritten function, write the command as usual and add the options parameter as you custom your command.

Code:

Cypress.Commands.add('contact',()=>{
 cy.visit('https://coderscamp.wixsite.com/codeit')
 cy.contains('Contact').click()
 cy.get('#input_comp-kntvy6i7').type('coderscamp')
 cy.get('#input_comp-kntvy6ir').type('coderscampindia@gmail.com')
 cy.get('#input_comp-kntvy6j4').type('testing custom commands')
 cy.get('#textarea_comp-kntvy6jb').type('All the best',{sensitive:true})
 cy.get('[data-testid=buttonElement]').click()
})

Cypress.Commands.overwrite('type',(originalFn,element,text,options)=>{
if(options && options.sensitive){
 options.log = false

 Cypress.log({
 $el: element,
 name: 'type',
 message: '*'.repeat(text.length),
    })
}

return originalFn(element,text,options)
})

So you have learned how to add or overwrite custom commands in cypress. Happy Testing!!!

































148 views0 comments

Recent Posts

See All

Comments


bottom of page