Prithvi
Prithvi

Reputation: 11

In Cypress how to check if the element contains the specific text

In Cypress how to check if the element contains the specific text Eg. In search box I have entered some name ( pav)

Drop-down list displayed with some options( eg. Mayuk pavi S )

Here the name contains pav. And it should pass . Need to check this scenario

Need to checke whether the drop-down lists contains the specific text or not

Upvotes: 1

Views: 1743

Answers (3)

Achtung
Achtung

Reputation: 202

Checking all the option in the dropdown requires .each() command.

First use .find() to pick all the option elements

Something like this test would confirm that the text you search for is contained in every dropdown option -

const searchText = 'pav'
cy.get('#search').type(searchText)

cy.get('#search-options').find('option')
  .each($option => {
    cy.wrap($option).should('contain', searchText)
  })

Upvotes: 5

eaglehuntt
eaglehuntt

Reputation: 53

Ultimately, it depends on what you want. I would need to see some code, but I can give some general insight:

If you want a tests to check if the element contains certain text:

cy.get('your HTML element here').contains('your text here');

If you want to do something conditionally if the text exists, you would do something like this:

cy.get('body').then($body =>
    if ($body.find('your HTML element here').contains('your text here')) { 
        cy.get("your HTML element here").then($el => {
            if ($el.is(':visible')){
                // do something if element contains text and visible
            } else{
                // do something if element contains text and is not
            }
        });
    }
});

Upvotes: 0

Mahsum Akbas
Mahsum Akbas

Reputation: 1583

For overall search:

cy.contains('pav')

To search in a specific element:

cy.get(elem).contains('pav') 

here "elem" is your element selector

Upvotes: 0

Related Questions