【WebUI自动化测试】Katalon ：Get CSS Value关键字，校验元素CSS样式

当我们做UI自动化测试时，可能会有这样的需求，需要检验某个元素的文本颜色、字体大小等等

若使用katalon工具，我们可以用Get CSS Value关键字，获取一个元素对象的CSS样式

再配合使用Verify Equal关键字进行断言确认

定义：

Get CSS Value关键字：Get CSS Value(TestObject to, String css) 获取某个页面某个元素的CSS样式的值，可以进行样式的校验，如页面元素的文本颜色、字体大小等，并可以保存到一个变量中（自己可定义）

Verify Equal关键字：verify Equal(Object actualObject, Object expectedObject, FailureHandling flowControl) 确认两个对象相等

用法：

Get CSS Value关键字

①value中输入你需要获取的样式：如font-size、color、margin-top等

②在Output中自定义输入一个变量名，用于存储本次获取到的CSS样式值，比如我输入的dlsize（可任意输入，建议使用英文，不过不能输css样式的名称，会报错）

Verify Equal关键字

①actualObject中，value Type根据你的需求选择，这里我们选择MethodCall，为了将变量转换成统一格式才好去进行对比

②点击actualObject-value，会弹出Method Call Input页面，在此页面选择设置需要转化格式的对象

③Object中手动输入CSS样式值存储的变量名（如我设置的dlsize）

④我们知道，获取得到的CSS样式值是字符串类型，所以Method字段选择toString，这样就将dlsize的值转换成了string类型

到这里，我们将完成了actualObject的取值：就是通过Get CSS Value方法获取到值，并将其转换为了string类型

⑤expectedObject中，Value Type为string，Value手动输入为预期的正确CSS样式值，点击ok

                           

 

结果：

'获取用户登录页面“用户登录”文字大小'
dlsize = WebUI.getCSSValue(findTestObject('Page_/p_'), 'font-size')

'判断用户登录文字是否=28px'
WebUI.verifyEqual(dlsize.toString(), '28px')