首页 > 解决方案 > 如何验证“页脚顶部”(Web 元素)背景图像颜色?

问题描述

我只是想验证“页脚顶部”背景图像的颜色。

“页脚顶部”图标的控制台视图是“

在样式下:

footer .footer-top {
    background: #1571c9;
    float: left;
    margin-top: 55px;
    padding: 25px 0;
    width: 100%;

在元素下:

<div class="footer-top">
<div class="sw-layout">
<div class="footer-section">
<h5>More Information</h5>
<ul>
<li><a href="/about-us">About Us</a></li>
<li><a href="/contact-us">Contact Us</a></li>
<li><a href="/faq">FAQ</a></li>
</ul>
</div>
<div class="footer-section hide-for-xs">
<h5>Finance Cards</h5>
<ul>
<div>
<li><a href="/finance-cards/cash-back-cards">Cash Back Finance Cards</a></li></div>
<li><a href="/finance-cards/points-rewards-cards">Points / Rewards Credit Cards</a></li>
<li><a href="/finance-cards/travel-air-miles-cards">Travel / Air Miles Credit Cards</a></li>
<li><a href="/finance-cards/islamic-cards">Islamic Cards</a></li>
<li><a href="/finance-cards/business-cards">Business Credit Cards</a></li>
</li>
</ul>
</div><div class="footer-section hide-for-xs">
<h5>Personal Loans</h5>
<ul>
<li><a href="salary-transfer-loans">Salary Transfer Loans</a></li>
<li><a href="loans-without-salary-transfer">Loans Without Salary Transfer</a>
</li>
</ul>

我正在使用以下代码行:

  String FooterTopSectionColour =    
  driver.findElement(By.className("footer-top")).getCssValue("background");         
   try {    
         Assert.assertEquals("#1571c9", FooterTopSectionColour);
         System.out.println("Colour matches with : "+ 
         FooterTopSectionColour);
       } 
   catch (Error e) 
       {e.printStackTrace();

        }

在 DOM 中,颜色以十六进制值给出,但 Selenium 以 rgb 形式返回。您可以在控制台中检查以下错误是否相同:

java.lang.AssertionError: expected [rgb(21, 113, 201) none repeat scroll 0% 0% / auto padding-box border-box] but found [#1571c9]
    at org.testng.Assert.fail(Assert.java:94)
    at org.testng.Assert.failNotEquals(Assert.java:513)
    at org.testng.Assert.assertEqualsImpl(Assert.java:135)
    at org.testng.Assert.assertEquals(Assert.java:116)
    at org.testng.Assert.assertEquals(Assert.java:190)
    at org.testng.Assert.assertEquals(Assert.java:200)
    at tests.homepage.HomePageStepDefinitions.vefify_colour_for_footer_top_section(HomePageStepDefinitions.java:378)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.lang.reflect.Method.invoke(Method.java:498)
    at cucumber.runtime.Utils$1.call(Utils.java:40)
    at cucumber.runtime.Timeout.timeout(Timeout.java:16)
    at cucumber.runtime.Utils.invoke(Utils.java:34)
    at cucumber.runtime.java.JavaStepDefinition.execute(JavaStepDefinition.java:38)
    at cucumber.runtime.StepDefinitionMatch.runStep(StepDefinitionMatch.java:37)
    at cucumber.runtime.Runtime.runStep(Runtime.java:300)
    at cucumber.runtime.model.StepContainer.runStep(StepContainer.java:44)
    at cucumber.runtime.model.StepContainer.runSteps(StepContainer.java:39)
    at cucumber.runtime.model.CucumberScenario.run(CucumberScenario.java:44)
    at cucumber.runtime.model.CucumberFeature.run(CucumberFeature.java:165)
    at cucumber.api.testng.TestNGCucumberRunner.runCucumber(TestNGCucumberRunner.java:63)
    at cucumber.api.testng.AbstractTestNGCucumberTests.feature(AbstractTestNGCucumberTests.java:21)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.lang.reflect.Method.invoke(Method.java:498)
    at org.testng.internal.MethodInvocationHelper.invokeMethod(MethodInvocationHelper.java:86)
    at org.testng.internal.Invoker.invokeMethod(Invoker.java:643)
    at org.testng.internal.Invoker.invokeTestMethod(Invoker.java:820)
    at org.testng.internal.Invoker.invokeTestMethods(Invoker.java:1128)
    at org.testng.internal.TestMethodWorker.invokeTestMethods(TestMethodWorker.java:129)
    at org.testng.internal.TestMethodWorker.run(TestMethodWorker.java:112)
    at org.testng.TestRunner.privateRun(TestRunner.java:782)
    at org.testng.TestRunner.run(TestRunner.java:632)
    at org.testng.SuiteRunner.runTest(SuiteRunner.java:366)
    at org.testng.SuiteRunner.runSequentially(SuiteRunner.java:361)
    at org.testng.SuiteRunner.privateRun(SuiteRunner.java:319)
    at org.testng.SuiteRunner.run(SuiteRunner.java:268)
    at org.testng.SuiteRunnerWorker.runSuite(SuiteRunnerWorker.java:52)
    at org.testng.SuiteRunnerWorker.run(SuiteRunnerWorker.java:86)
    at org.testng.TestNG.runSuitesSequentially(TestNG.java:1244)
    at org.testng.TestNG.runSuitesLocally(TestNG.java:1169)
    at org.testng.TestNG.run(TestNG.java:1064)
    at org.testng.remote.AbstractRemoteTestNG.run(AbstractRemoteTestNG.java:114)
    at org.testng.remote.RemoteTestNG.initAndRun(RemoteTestNG.java:251)
    at org.testng.remote.RemoteTestNG.main(RemoteTestNG.java:77)

那么,我该如何调试呢?请检查我使用的代码是否正确!还让我知道如何将十六进制转换为 rgb 并使用 selenium 进行比较?谢谢!

标签: listseleniumfor-loopxpathheader

解决方案


由于您的 DOM 颜色和 CSS 颜色不同,您需要将一种格式转换为另一种格式,然后您需要比较或断言它。

在下面的代码中,我添加了将 RGB 值转换为 Hexa 十进制然后断言条件的步骤。我假设,如果您打印“footerTopSelectionColour”值,那么它会以以下格式打印:

rgb(21, 113, 201) 无重复滚动 0% 0% / 自动填充框边框框

在下面找到修改后的代码行:

String footerTopSectionColour = driver.findElement(By.className("footer-top")).getCssValue("background");
try {
    // I'm assuming that the value of 'footerTopSelectionColour' value will be like below
    // rgb(21, 113, 201) none repeat scroll 0% 0% / auto padding-box border-box

    // So first we need to convert colour code from rgb to hexa decimal
    String value = footerTopSectionColour.trim();
    String[] rgbs = value.split("\\)")[0].split("\\(")[1].split(", ");
    long r = Long.parseLong(rgbs[0]);
    long g = Long.parseLong(rgbs[1]);
    long b = Long.parseLong(rgbs[2]);
    String hex = String.format("#%02x%02x%02x", r, g, b);
    System.out.println("=> The hex conversion is : "+hex);

    // After converting you can assert like below
    Assert.assertEquals("#1571c9", hex);
    System.out.println("Colour matches with : "+ footerTopSectionColour);
} catch (Exception e) {
        e.printStackTrace();
}

我希望这个答案有帮助...


推荐阅读