0
132
ViewsCheck label found in modal had a specific status
I have to validate that when I click on the button submit a popup opens with a specific label. The label which will show has to have a specific status.
For example:This is the button submit html
<button class="btn btn-primary" type="button">submit</button>
When I click on the button, another modal will open with a label on top of it.
The label which will open in the modal should have the status positive
"abc" can be the label and "positive" is the status. All these are on a table. Basically, if the modal opens and has the label abc, this means that abc had the status positive
This is what I have done so far:
cy.get('.btn').and('have.class', 'btn-primary').contains('submit').click()
cy.get('.form-header').should('contain.text', 'abc')
cy.get('.close-modal').click()
cy.contains('td', 'abc...').scrollIntoView()
cy.get('.badge-label').and('contain.text', 'positive').should('be.visible')
This is not good as I am checking that the label has the status. I want to check that the label found in the modal after clicking on submit has the status positive. Please do let me know if any other info is required. Thank you
2 answers
Answer question0
Usually a modal is a separate block of code in the DOM, appended to the end of the page after you click your submit button.
So, you'd have to find something unique on that modal. It looks like you tried with these lines
cy.get('.form-header').should('contain.text', 'abc')
cy.get('.close-modal').click()
What you need to do now is manually inspect in chrome devtools
- in normal browser, clikc open the model
- open devtool, scroll down to the bottom to find the block for modal
- or right-click the modal to take you there
- identify the elements with the status
Maybe you will end up with something like
cy.get('.form-header').should('contain.text', 'abc')
cy.get('.badge-label').should('contain.text', 'positive') // here cehck status in modal
cy.get('.close-modal').click()
0
Does this work for you:
cy.get('.btn').and('have.class', 'btn-primary').contains('submit').click()
cy.get('.form-header').should('contain.text', 'abc')
cy.contains('td', 'abc')
.parent('tr')
.within(() => {
cy.get('div.badge-label').should('include.text', 'positive')
})