PhantomJS testing with headless browser that supports JS

For this to understand you will need to already have installed and running PhantomJS, how to do that please read here.
https://github.com/Gizra/KnowledgeBase/wiki/Behat-phantomJs-install

With that you will need to run it, open your terminal and write this to make it start

phantomjs --webdriver=4444

Also you need to add config to your behat.yml extensions part in the place where Selenium is, as PhantomJS is a GHOST, it pretends it is selenium which is browser controller. wd_host is the url of your localhost with 4444 port which we defined above when we started PhantomJS

  extensions:
    Behat\MinkExtension:
      goutte: ~
      selenium2:
        wd_host: "http://127.0.0.1:4444/wd/hub"

Then we will write custom test, which will also require custom PHP. So we go to our .feature file and add this

  @javascript
  Scenario: Search
    Given I am on the homepage
    When I search for "some term"

We need to add tag @javascript to make this work and use PhantomJS for testing. Then we write a scenario where we are on homepage and we use search box to search for a term.

PHP is needed so we go and write custom method in our FeatureContext.php file

**
 * Defines application features from the specific context.
 */
class FeatureContext extends RawDrupalContext implements SnippetAcceptingContext {

  /**
   * Initializes context.
   *
   * Every scenario gets its own context instance.
   * You can also pass arbitrary arguments to the
   * context constructor through behat.yml.
   */
  public function __construct() {
  }

  /**
   * @When I search for :searchTerm
   *
   */
  public function iSearchFor($searchTerm){
    $session = $this->getSession();
    $page = $session->getPage();

    $searchField = $page->find('css', 'input.form-search');
    $searchField->click();
    $searchField->setValue($searchTerm);

    $searchButton = $page->find('css', 'input.form-submit');
    $searchButton->click();

    $session->wait(100);

    $this->saveScreenshot("test.png", "/Users/some_user/Drupal");
  }
}

What we do here is open session, find a form search input field, click on it and set value to our search term, then we find a button and click on it to make a search. We wait for some 100 milliseconds and then we make a screenshot of what the search results page look like and save it to set path.

With this we will conclude our first PhantomJS test, just run your tests and you should see a test run and have a screenshot in your drupal root folder.

Drupal 8

Testing