Permalink
Browse files

Adding examples about phantomjs and casperjs

  • Loading branch information...
1 parent ca18155 commit 5c5686cbbded09a5d73eeb3869a592f321b941da @robertbasic committed Jan 29, 2013
Showing with 140 additions and 0 deletions.
  1. +4 −0 frontend-testing/ajax.php
  2. +53 −0 frontend-testing/index.php
  3. +23 −0 frontend-testing/login.php
  4. +60 −0 frontend-testing/tests.js
@@ -0,0 +1,4 @@
+<?php
+echo json_encode(array('response' => 'Just some ajax response.'));
+exit;
+?>
@@ -0,0 +1,53 @@
+<?php
+if (!isset($_COOKIE['logged_in']) && $_COOKIE['logged_in'] != 1) {
+ header("Location: login.php");
+ exit;
+}
+
+$email = false;
+if (isset($_COOKIE['email']) && $_COOKIE['email'] != '') {
+ $email = filter_input(INPUT_COOKIE, 'email', FILTER_SANITIZE_EMAIL);
+ $email = filter_var($email, FILTER_VALIDATE_EMAIL);
+}
+?>
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Frontend testing examples!</title>
+ <script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
+ <script type="text/javascript">
+ $(document).ready(function() {
+ $("#do_ajax").on('click', function (event) {
+ if ($("#enable_ajax").is(":checked")) {
+ $.get(
+ 'ajax.php',
+ function (data) {
+ $("#ajax_result").text(data.response);
+ },
+ "json"
+ );
+ }
+ event.preventDefault();
+ });
+
+ $("#clear_ajax").on('click', function (event) {
+ $("#ajax_result").text('');
+ event.preventDefault();
+ });
+ });
+ </script>
+</head>
+<body>
+
+<p>Hello <?php echo $email ? $email : "Anon" ?>.</p>
+
+<label for="enable_ajax"><input type="checkbox" name="enable_ajax" id="enable_ajax"> Enable ajax?</label>
+
+<a id="do_ajax" href="#">Do an ajax request</a>
+
+<div>Result of an ajax request will go here: <span id="ajax_result"></span><div>
+
+<a id="clear_ajax" href="#">Clear ajax response</a>
+
+</body>
+</html>
@@ -0,0 +1,23 @@
+<?php
+if (count($_POST) and isset($_POST['login'])) {
+ setcookie('logged_in', 1, time() + 3600, '/');
+ $email = filter_input(INPUT_POST, 'email', FILTER_SANITIZE_EMAIL);
+ if (filter_var($email, FILTER_VALIDATE_EMAIL)) {
+ setcookie('email', $email, time() + 3600, '/');
+ }
+ header("Location: index.php");
+ exit;
+}
+?>
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Frontend testing examples! Login page.</title>
+</head>
+<body>
+ <form name="login_form" id="login_form" method="POST">
+ <input type="text" name="email" id="email" placeholder="Set an email!">
+ <input type="submit" name="login" id="login" value="Log in!">
+ </form>
+</body>
+</html>
@@ -0,0 +1,60 @@
+var casper = require('casper').create();
+phantom.cookiesEnabled = true;
+
+casper.start('http://localhost/frontend-testing', function () {
+ this.test.assertUrlMatch(/login.php$/, 'Redirected to login page');
+ this.test.assertExist("#login_form", 'Login form exists');
+
+ this.fill('#login_form', {
+ 'email': 'email@example.com'
+ }, false); // false means don't autosubmit the form
+
+ this.test.assertField('email', 'email@example.com');
+});
+
+casper.thenClick('#login', function () {
+ this.test.assertUrlMatch(/index.php$/, 'Redirected to index page after login');
+});
+
+casper.then(function () {
+ this.test.assertTextExist('Hello email@example.com.', 'Greeting message exists');
+ // I could swear I had this one working
+ // this.test.assertEquals(this.getElementAttribute('#enable_ajax', 'checked'), '', 'Checkbox is not checked');
+ this.test.assertFalse(this.evaluate(function () {
+ return document.getElementById("enable_ajax").checked;
+ }), 'Checkbox is not checked');
+});
+
+casper.thenClick('#do_ajax', function () {
+ this.test.assertTextDoesntExist('Just some ajax response.', 'Ajax request was not made');
+});
+
+casper.thenClick('#enable_ajax', function () {
+ // I could swear I had this one working
+ // this.test.assertEquals(this.getElementAttribute('#enable_ajax', 'checked'), 'checked', 'Checkbox is checked');
+ this.test.assertTrue(this.evaluate(function () {
+ return document.getElementById("enable_ajax").checked;
+ }), 'Checkbox is checked');
+});
+
+casper.thenClick('#do_ajax', function () {
+ this.waitForResource('http://localhost/frontend-testing/ajax.php');
+});
+
+casper.then(function () {
+ // Sometimes we need to wait a bit more for ajax requests ...
+ this.wait(50);
+});
+
+casper.then(function () {
+ this.test.assertTextExist('Just some ajax response.', 'Ajax request was made');
+});
+
+casper.thenClick('#clear_ajax', function () {
+ this.test.assertTextDoesntExist('Just some ajax response.', 'Ajax request response was cleared');
+});
+
+casper.run(function () {
+ this.test.done();
+ this.test.renderResults(true); // true means exit when it's done
+});

0 comments on commit 5c5686c

Please sign in to comment.