You want to verify that a button has a border radius of 5 pixels and a background color of blue. Which Cypress code correctly asserts both CSS properties?

hard📝 Application Q8 of 15

Cypress - Assertions

Acy.get('button').should('contain.css', 'border-radius', '5px').and('contain.css', 'background-color', 'rgb(0, 0, 255)')

Bcy.get('button').should('have.css', 'border-radius', 5).and('have.css', 'background-color', 'blue')

Ccy.get('button').should('have.attr', 'border-radius', '5px').and('have.attr', 'background-color', 'blue')

Dcy.get('button').should('have.css', 'border-radius', '5px').and('have.css', 'background-color', 'rgb(0, 0, 255)')

Step-by-Step Solution

Solution:

Step 1: Use correct assertion methods for CSS
Use have.css to assert CSS properties, not have.attr or contain.css.
Step 2: Use correct value formats
Border radius requires units as string '5px'. Background color should be in rgb format 'rgb(0, 0, 255)'.
Final Answer:
cy.get('button').should('have.css', 'border-radius', '5px').and('have.css', 'background-color', 'rgb(0, 0, 255)') -> Option D
Quick Check:
Multiple CSS assertions with correct syntax = D [OK]

Quick Trick: Chain multiple 'have.css' assertions with .and() [OK]

Common Mistakes:

Passing numeric values without units
Using 'have.attr' for CSS properties
Using incorrect color formats

Master "Assertions" in Cypress

9 interactive learning modes - each teaches the same concept differently

Learn Why Deep Trace Try Challenge Automate Recall Frame

Want More Practice?

15+ quiz questions · All difficulty levels · Free

Free Signup - Practice All Questions

More Cypress Quizzes

You want to verify that a button has a border radius of 5 pixels and a background color of blue. Which Cypress code correctly asserts both CSS properties?

Step 1: Use correct assertion methods for CSS

Step 2: Use correct value formats

Final Answer:

Quick Check:

Want More Practice?