Verify HTML Style

I would like to verify an HTML element's style and extract it for use later in the test.

Solution

This is possible with a coded solution. First, be aware that if you're simply verifying a style, that can be accomplished without code using an Advanced Verification.

The example below is against this W3Schools site. Two styles are verified, retrieved as strings, and set as extracted values to use later in the test through data binding (either attached to an input value or a verification).

Browser frame = ActiveBrowser.Frames["view"];
HtmlControl paragraph = frame.Find.ByTagIndex<HtmlControl>("p", 0);
Assert.IsNotNull(paragraph);

string family = paragraph.Styles.Get("font-family");
Log.WriteLine(family);
SetExtractedValue("familyVar", family);

string color = paragraph.Styles.Get("color");
Log.WriteLine(color);
SetExtractedValue("colorVar", color);

paragraph.AssertStyle().Font(HtmlStyleFont.Family, "verdana", HtmlStyleType.Computed, StringCompareType.Exact);
paragraph.AssertStyle().ColorAndBackground(HtmlStyleColorAndBackground.Color, "#FF0000", HtmlStyleType.Computed, StringCompareType.Exact);

Dim frame As Browser = ActiveBrowser.Frames("view")
Dim paragraph As HtmlControl = frame.Find.ByTagIndex(Of HtmlControl)("p", 0)
Assert.IsNotNull(paragraph)

Dim family As String = paragraph.Styles.[Get]("font-family")
Log.WriteLine(family)
SetExtractedValue("familyVar", family)

Dim color As String = paragraph.Styles.[Get]("color")
Log.WriteLine(color)
SetExtractedValue("colorVar", color)

paragraph.AssertStyle().Font(HtmlStyleFont.Family, "verdana", HtmlStyleType.Computed, StringCompareType.Exact)
paragraph.AssertStyle().ColorAndBackground(HtmlStyleColorAndBackground.Color, "#FF0000", HtmlStyleType.Computed, StringCompareType.Exact)