Codeception Acceptance tests with Javascript

I had an issue on this old legacy site in work where I was writing a basic acceptance test where it clicks all the links in the top section of the home page. The problem was that one of the links opened another window using JavaScript. So I had to reconfigure Codeception to get it running.

There are various different drivers that codeception uses, PhpBrowser which doesn’t do JS, Selenium WebDriver does, and you have several options; you could install Selenium, chrome headless browser, or phantomjs. I chose phantomjs, as it was easiest (for me) to get up and running on a non X Server.

First up, you’ll need phantomjs. Go download it, unpack the zip, move the folder somewhere, and then symlink the bin/phantomjs to /usr/bin/phantomjs.

Next, launch phantomjs like so:

phantomjs --webdriver=4444 --ignore-ssl-errors=true --ssl-protocol=any

Now, in your YAML:

# Codeception Test Suite Configuration

# suite for acceptance tests.
# Run the following command FIRST:
# phantomjs --webdriver=4444 --ignore-ssl-errors=true --ssl-protocol=any

# RUN `build` COMMAND AFTER ADDING/REMOVING MODULES.

class_name: WebGuy
modules:
     enabled:
         - WebDriver
         - WebHelper
     config:
         WebDriver:
             url: 'https://USER:PASS@YOUR_URL_HERE'
             browser: phantomjs
             capabilities:
                 acceptSslCerts: true

If you have a site using HTTP Basic Auth, put USER:PASSWORD@ in yopur URL, if not, remove it.

Now in your acceptance test, you can write:

$i->click('Nouvel abonnement');
$i->switchToWindow('webformswin');

Note that, in your Javascript, when you run the open window function, you specify a name. This is the name you use, and not the title from the HTML <head> section!

And there you have it! We can now test with javascript functionality!

Debug Codeception from a remote Vagrant box in PHPStorm

Configuring this REALLY did my head in,but in reality there are only a few steps to hook up your puPHPet Vagrant box (however miss something and you’ll be left scratching your head)  so here’s the quick vibe:

First up create a file in your site root called debugrun.php or whatever:

require_once 'vendor/codeception/codeception/autoload.php';

use Symfony\Component\Console\Application;

$app = new Application('Codeception', Codeception\Codecept::VERSION);
$app->add(new Codeception\Command\Run('run'));

$app->run();

Then goto Edit configurations in the debug menu.

Screen Shot 2015-09-28 at 23.44.41
replacing ‘yoursite’ with a valid path of course. Ok that and then go into your preferences. Click on deployment and connect with SFTP using your ssh key  puphpet/files/dot/ssh/id_rsa :
Set the path mappings tab to /var/www/yoursite or whatever.

Screen Shot 2015-09-28 at 23.47.31

Goto Languages > PHP and add a remote interpreter:

Screen Shot 2015-09-28 at 23.50.33

Lastly go into Tools SSH Terminal and choose default remote interpreter. Now hit the debug button and codeception should launch! Dont ask me how to change the terminal colours!