Assert element color in Selenium IDE

Question

I'm trying to setup a test automation that will assert an element color when clicked. However, I couldn't find the right way to do it. I'm a selenium newbie, I have tried every possible way to do it but failed.

HTML:

<a class="mg-friend-12345 friend selected" title="test" data-cid="12345" style="">

CSS:

.imweb #mgifting-dialog .mg-friends .friend.selected, .imweb #mgifting-dialog .mg-friends .non-friend.selected {
  background-color: #9DD4FD;
}

Please let us know what you have tried. – Void Ray Oct 17 '12 at 18:50 — Void Ray, Oct 17 '12 at 18:50

score 2 · Answer 1 · answered Oct 17 '12 at 19:15

IMHO the idea be the following: we simply need to get css property(color, in particulat) of element before click. and get css property(color ) of the element after click on it.

so it be like (I work on java and we will execute a piece of javascript using jsExecutor to implement getColor function. It will take css selector of the element. And get return its color):

public String jsGetColor(String css){
        JavascriptExecutor js = (JavascriptExecutor) driver;
        StringBuilder stringBuilder = new StringBuilder();
        stringBuilder.append("var x=$(\'"+css+"\');");
        stringBuilder.append("return x.css('color')");
        //stringBuilder.append("return x.css('background-color')");
        String res= (String) js.executeScript(stringBuilder.toString());
        return res;
    }

String cssSelectorLink="a[class='mg-friend-12345 friend selected']";
WebElement linkToClick = driver.findElemebt(By.cssSelector(cssSelectorLink));
String colorBeforeClick = jsGetColor(cssSelectorLink);
linkToClick.click();
String colorAfterClick = jsGetColor(cssSelectorLink);
Assert.assertFalse(colorBeforeClick.equals(colorAfterClick));

Hope it be helpful for you.

Thank you very much! However, I'm a bit confused on how to use these codes since I'm a noob lol. Can you please tell me how to simply use these codes and how to just use the command, target, and value boxes? — user1754182, Oct 17 '12 at 20:44
ohhh.. sorry. I got misconfused. You question is related to selnium IDE. And I work with selenium webdriver +java. I'm noob in selenium IDE :) I can explain you how you can set up IDE and write your tests e.g. in java — eugene.polschikov, Oct 17 '12 at 21:58
It's alright! I appreciate your help! Please teach me how I can set up IDE and write my tests e.g. in java. Thanks! — user1754182, Oct 17 '12 at 22:08

score 1 · Answer 2 · answered Oct 19 '12 at 11:16

well I work in intelij IDEA. So setUp to write selenium tests e.g. be the following:

1) install maven

Unzip the distribution archive, i.e. apache-maven-3.0.4-bin.zip to the directory you wish to install Maven 3.0.4. These instructions assume you chose C:\Program Files\Apache Software Foundation. The subdirectory apache-maven-3.0.4 will be created from the archive.
Add the M2_HOME environment variable by opening up the system properties (WinKey + Pause), selecting the "Advanced" tab, and the "Environment Variables" button, then adding the M2_HOME variable in the user variables with the value C:\Program Files\Apache Software Foundation\apache-maven-3.0.4. Be sure to omit any quotation marks around the path even if it contains spaces.
In the same dialog, add the M2 environment variable in the user variables with the value %M2_HOME%\bin.

2) install jdk 3) enter image description here

4) verify that all environment variables you've set properly enter image description here 5) run intelij IDEA select Project structure to set up installed JDK 6) press New.select jsdk. write path where we installed java, e.g C:\Program Files\Java\jdk1.6.0_29 7)create new project from scratch 8) maven module 9) 10) 11) add to POM appropriate dependencies: enter image description here

   <dependency>
 <groupId>org.seleniumhq.selenium</groupId> 
<artifactId>selenium-java</artifactId> 
<version>2.24.1</version> 
</dependency>

12) if still someting underline with red line , press alt+enter on it >> idea should automatically suggest autoimport.

13)test structure in the project enter image description here

14)common structure of selenium test

import com.thoughtworks.selenium.SeleneseTestBase;
import org.junit.After;
import org.junit.Before;
import org.junit.BeforeClass;
import org.junit.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;

import java.util.concurrent.TimeUnit;

public class HomePageTest extends SeleneseTestBase{

    static WebDriver driver;

    @Before
    public void openFirefox(){

        driver = new FirefoxDriver();
        driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);

    }

    @Test
    public void testHomePage(){
        driver.get("https://www.google.by/");
        WebElement search = driver.findElement(By.xpath("//*[@id=\"gbqfq\"]"));
        search.sendKeys("laptop");
        search.submit();

    }

    @After
    public void closeFirefox(){
        // driver.quit();
    }
}

15) also don't forget that you can export your created test in selenium IDE as JUNIT4- selenium and open them in IDEA enter image description here

Regards

Assert element color in Selenium IDE

2 Answers2