Monday, 18 March 2013

Headless Browser Testing using PhantomJS - GhostDriver | WebDriver


PhantomJS is a Headless Webkit with JavaScript API. It has fast & native support for various Web Standards: DOM handling, CSS selector, JSON, canvas and SVG.  GhostDriver is a Webdriver wire protocol in simple JS for PhantomJS.  PhantomJS is used for Headless Testing of Web Applications that comes with in-built GhostDriver.

Involves,
1| General command-line based testing.
2| As a part of a Continuous Integration System.

PhantomJS is not a Test framework, it is used only to LAUNCH the tests via a suitable Test Runner.

Framework used: WebDriver
Test Runner: GhostDriver

CI systems: Make sure PhantomJS is installed properly on the slave/build agent and it is ready to go. Headless Browser is a Web Browser without a GUI (Graphical User Interface). It access Web Pages but doesn't show them to any human being. Headless Browser should be able to parse JavaScript.



Configure PhantomJS

1. Download phantomjs.exe
2. Extract the phantomjs-1.8.x-windows.zip folder and locate phantomjs.exe file to C:/ folder
3. Add the following imports to your code:

import org.openqa.selenium.phantomjs.PhantomJSDriver;
import org.openqa.selenium.phantomjs.PhantomJSDriverService;
import org.openqa.selenium.remote.DesiredCapabilities;

4. Replace the object, "driver" specifying "FirefoxDriver" with "PhantomJSDriver".

Replace the code,
WebDriver driver = new FirefoxDriver

with
DesiredCapabilities caps = new DesiredCapabilities();
caps.setJavascriptEnabled(true); // not really needed: JS enabled by default
caps.setCapability(PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY, "C:/phantomjs.exe");
WebDriver driver = new PhantomJSDriver(caps);

5. Run Test.

Note|
PhantomJSDriver-1.0.x.jar can also be downloaded and configured in Eclipse manually.



PhantomJS | Screen Capture

DesiredCapabilities caps = new DesiredCapabilities();
caps.setJavascriptEnabled(true); // not really needed: JS enabled by default
caps.setCapability(PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY, "C://phantomjs.exe");
caps.setCapability("takesScreenshot", true);
driver = new PhantomJSDriver(caps);  
baseUrl = "http://www.xyz.com";
driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
}

@Test
public void test01() throws Exception {
driver.get(baseUrl + "/");   
long iStart = System.currentTimeMillis(); // start timing
<your script>
File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
FileUtils.copyFile(scrFile, new File("c:\\sample.jpeg"),true);    
System.out.println("Single Page Time:" + (System.currentTimeMillis() - iStart)); // end timing    
}

18 comments:

  1. Hey Prashanth,

    I've been looking for this solution everywhere. Thank you so much. Since it's designed to hide all of the actions from the user, is there anyway to make sure this works besides using print statements in the code? Again, thank you.

    ReplyDelete
    Replies
    1. I guess PhantomJS supports screenshots as well.

      Delete
    2. Hi Max,

      Phantomjs supports Screen capture as well. Please find the example I have given above.

      Cheers
      _
      Prashanth Sams

      Delete
  2. Thanks a lot for great tutorial. Highly appreciated.

    ReplyDelete
  3. Can you give me a real time example where we use this in Automation? Like some example application

    ReplyDelete
  4. Thanks a lot .... best tut about phantom on the net ..

    ReplyDelete
  5. Nice article, prashanth!!
    Althought I'm new to selenium and phantoms.. i'm trying something with nodejs , but not getting what i expect..

    can you please help me on this..

    http://stackoverflow.com/q/24556738/2958224

    Much appreciated..!!

    ReplyDelete
  6. Hi Prashanth,

    This is very nice and helpful article.

    Now, can you please tell me, how can i enable cookie using selenium and phantoms?

    ReplyDelete
  7. here's how i do cookies in my GebConfig.groovy....

    DesiredCapabilities dCaps = new DesiredCapabilities()
    dCaps.setJavascriptEnabled(true);
    dCaps.setCapability("takesScreenshot", false);
    dCaps.setCapability(PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY,
    '/Users/en032339/Desktop/phantomjs-1.9.7-windows/phantomjs.exe')
    dCaps.setCapability(PhantomJSDriverService.PHANTOMJS_CLI_ARGS,
    ['--cookies-file=phantomjs_cookies.txt', '--load-images=no'] as String[])
    WebDriver driver = new PhantomJSDriver(dCaps)

    ReplyDelete
  8. HI can you please tell me how to handle download s in headless testing.
    eg: we have a link to download excel file .In selenium we are using autoit script to handle the download windows but here i have no guess can anyone please help me on this

    ReplyDelete
  9. This comment has been removed by the author.

    ReplyDelete
  10. How to use PhantomJS with maven?

    ReplyDelete
  11. Thanks for the great information in your blog Selenium Training in Chennai

    ReplyDelete
  12. thank you so much..
    very useful documnet..
    so many thanks

    ReplyDelete
  13. very good Article. Is there such kind of write-up for PhantomJS, Selenium on Linux OS?

    ReplyDelete
  14. can we use phantomjs in grid, please help me with that

    ReplyDelete
  15. Hello,

    I found this site just now. Your code has been a good help for me but there are two things:

    1. FileUtils.copyFile doesn't work for me. I saw this on several sites but I have to use FileCopyUtils.copyFile() otherwise I get an compilation error that this method does not exist.

    2. Open a site and make a screenshot isn't enough for me. For a test I have to click buttons, insert values in text fields,..
    But whatever I do I always get a NoSuchElementException. I tried

    - driver.findElementBy.id/xpath/tagName/cssSelector
    - actions.moveToElement(driver.findElementBy.id/xpath/tagName/cssSelector)
    - both with 30 seconds timeout

    I'm sick of it. Maybe you have an idea how to find a webelement with PhantomJSDriver?

    Thanks and a nice day
    Achim

    ReplyDelete