How to do CSS verification of HTML Elements in Test Studio

In this post, we will take a look on doing CSS Verification of HTML element in Test Studio. You can put verification on CSS while recording the test. Let us say on following page you want to do CSS verification on highlighted element.

image

While recording the test click on Enable or Disable Hover.

image

After selecting that select element and click on blue bubble. Select “Build Verification

image

 

In DOM Explorer, select HTML element and click on Style.

image

In Style, you have option to select

  1. Computed Style
  2. Inline Style

You can create verification step by choosing different options from the drop down.

image

Let us say you want to create a verification step “Font size of element is 2em”. You can do that selecting Font and Size from drop down.

image

After selecting value from drop downs click on Validation Rules. You will get a message that “Validation Passed”

image

After closing DOM Explorer and stopping the recording, you will find a CSS verification step has been added to the Test Steps.

image

In this way you can do CSS verification on HTML elements. I hope you find this post useful. Thanks for reading.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s