Merge pull request #397 from aldryn/feature/migrate-integration-tests

Migrate integration tests

.travis.yml

@@ -18,13 +18,12 @@ env:
     #   PY strategy: do not test 3.3 at all.
     #   DB stragegy: we use raw queries, so good coverage is required. Test on
     #                each django/cms combination.
-    #   FE strategy: only test on Django/CMS3.2 combinations, but place tests on
+    #   FE strategy: only test on Django/CMS3.3 combinations, but place tests on
     #                different Python ENVs if possible. Also, test against all
     #                DB backends
-    # NOTE: FE-TESTS ARE DISABLED UNTIL THEY ARE FIXED FOR CMS 3.2
     # NOTE: MYSQL AND POSTGRES TESTS ARE DISABLED UNTIL #339 IS MERGED.
     - TOXENV=flake8
-    - TOXENV=py35-dj19-sqlite-cms33
+    - TOXENV=py35-dj19-sqlite-cms33-fe FE=1
     - TOXENV=py35-dj19-sqlite-cms32
     - TOXENV=py34-dj19-sqlite-cms33
     - TOXENV=py34-dj19-sqlite-cms32
@@ -35,7 +34,7 @@ env:
     - TOXENV=py34-dj18-sqlite-cms33
     - TOXENV=py34-dj18-sqlite-cms32
     - TOXENV=py34-dj18-sqlite-cms31
-    - TOXENV=py27-dj18-sqlite-cms33
+    - TOXENV=py27-dj18-sqlite-cms33-fe FE=1
     - TOXENV=py27-dj18-sqlite-cms32
     - TOXENV=py27-dj18-sqlite-cms31
     - TOXENV=py34-dj17-sqlite-cms32
@@ -61,17 +60,17 @@ cache:
   directories:
     - $HOME/.wheelhouse
 
-before_install:
-  - npm install -g npm
-
 install:
   - pip install tox
   - pip install coveralls
 
 before_script:
-  - npm install -g gulp
-  - npm install -g codeclimate-test-reporter
-  - npm install
+  - if [ "$FE" == 1 ]; then nvm install 0.12.7 && nvm use 0.12.7; fi
+  - if [ "$FE" == 1 ]; then npm config set spin false; fi
+  - if [ "$FE" == 1 ]; then npm install -g npm@2; fi
+  - if [ "$FE" == 1 ]; then npm install -g gulp@3.9.0; fi
+  - if [ "$FE" == 1 ]; then npm install -g codeclimate-test-reporter; fi
+  - if [ "$FE" == 1 ]; then npm install; fi
 
 after_script:
   - codeclimate < tests/coverage/**/lcov.info

aldryn_newsblog/tests/frontend/.jshintrc

@@ -0,0 +1,6 @@
+{
+    "node": true,
+    "predef": [
+        "casper"
+    ]
+}

aldryn_newsblog/tests/frontend/casperjs.conf.js

@@ -0,0 +1,27 @@
+'use strict';
+
+// #############################################################################
+// CasperJS options
+
+module.exports = {
+    init: function () {
+        this.viewportSize();
+        this.timeout(20000);
+    },
+
+    viewportSize: function (width, height) {
+        var viewportWidth = width || 1280;
+        var viewportHeight = height || 1024;
+
+        casper.echo('Current viewport size is ' + viewportWidth + 'x' + viewportHeight + '.', 'INFO');
+
+        casper.options.viewportSize = {
+            width: viewportWidth,
+            height: viewportHeight
+        };
+    },
+
+    timeout: function (timeout) {
+        casper.options.waitTimeout = timeout || 10000;
+    }
+};

aldryn_newsblog/tests/frontend/integration/handlers/externalMissing.js

@@ -0,0 +1,12 @@
+'use strict';
+
+// #############################################################################
+// Handles external resources load failures
+
+module.exports = {
+    bind: function () {
+        casper.on('resource.error', function (resource) {
+            casper.echo('Resource failed to load: ' + resource.url, 'ERROR');
+        });
+    }
+};

aldryn_newsblog/tests/frontend/integration/handlers/loadFailures.js

@@ -0,0 +1,12 @@
+'use strict';
+
+// #############################################################################
+// Handles load failure errors
+
+module.exports = {
+    bind: function () {
+        casper.on('load.failed', function (error) {
+            casper.echo(JSON.stringify(error), 'ERROR');
+        });
+    }
+};

aldryn_newsblog/tests/frontend/integration/handlers/missingPages.js

@@ -0,0 +1,16 @@
+'use strict';
+
+// #############################################################################
+// Handles 404 and 500 pages
+
+module.exports = {
+    bind: function () {
+        casper.on('http.status.404', function (resource) {
+            casper.echo('404 page found: ' + resource.url, 'ERROR');
+        });
+
+        casper.on('http.status.500', function (resource) {
+            casper.echo('500 page found: ' + resource.url, 'ERROR');
+        });
+    }
+};

aldryn_newsblog/tests/frontend/integration/handlers/pageErrors.js

@@ -0,0 +1,12 @@
+'use strict';
+
+// #############################################################################
+// Handles JavaScript page errors
+
+module.exports = {
+    bind: function () {
+        casper.on('page.error', function (msg) {
+            casper.echo('Error on page: ' + JSON.stringify(msg), 'ERROR');
+        });
+    }
+};

aldryn_newsblog/tests/frontend/integration/handlers/suiteFailures.js

@@ -0,0 +1,22 @@
+'use strict';
+
+// #############################################################################
+// Handles test suite errors (assert and waitFor)
+
+module.exports = {
+    bind: function () {
+        casper.on('step.error', function (error) {
+            casper.die('assert failed: ' + error.message);
+        });
+
+        casper.on('waitFor.timeout', function (timeout, error) {
+            if (error.selector) {
+                casper.die('waitFor failed, couldn\'t find ' + error.selector + ' within ' + timeout + 'ms');
+            } else if (error.visible) {
+                casper.die('waitFor failed, couldn\'t find ' + error.visible + ' within ' + timeout + 'ms');
+            } else {
+                casper.die('waitFor failed with error', JSON.stringify(error, null, 4));
+            }
+        });
+    }
+};

aldryn_newsblog/tests/frontend/integration/loginAdmin.js

@@ -0,0 +1,52 @@
+/* globals localStorage, casper */
+'use strict';
+
+// #############################################################################
+// User login via the admin panel
+
+var helpers = require('djangocms-casper-helpers');
+var globals = helpers.settings;
+var cms = helpers();
+
+casper.test.tearDown(function (done) {
+    casper.start()
+        .then(cms.logout())
+        .run(done);
+});
+
+casper.test.begin('User Login (via Admin Panel)', function (test) {
+    casper
+        .start(globals.adminUrl, function () {
+            // we explicitly kill the session id cookie to reset the login state
+            // and localstorage data to reset the ui state (sideframe, toolbar, etc)
+            this.page.deleteCookie('sessionid');
+            this.evaluate(function () {
+                localStorage.clear();
+            });
+
+            this.echo('The currently set cookies are: ' + JSON.stringify(this.page.cookies), 'INFO');
+        })
+        .then(function () {
+            var titleRegExp = new RegExp(globals.adminTitle, 'g');
+
+            test.assertTitleMatch(titleRegExp, 'The CMS is available and admin panel title is correct');
+            test.assertExists('#login-form', 'Admin login form is available');
+
+            this.fill('#login-form', {
+                username: 'fake',
+                password: 'credentials'
+            }, true);
+        })
+        .waitForSelector('.errornote', function () {
+            test.assertExists('.errornote', 'login with wrong credentials failed');
+
+            this.fill('#login-form', globals.credentials, true);
+        })
+        .waitForResource(/login/)
+        .thenOpen(globals.baseUrl, function () {
+            test.assertExists('.cms-toolbar', 'Login via the admin form done');
+        })
+        .run(function () {
+            test.done();
+        });
+});

aldryn_newsblog/tests/frontend/integration/setup.js

@@ -0,0 +1,13 @@
+// #############################################################################
+// Init all settings and event handlers on suite start
+'use strict';
+
+require('./../casperjs.conf').init();
+
+require('./handlers/pageErrors').bind();
+require('./handlers/loadFailures').bind();
+require('./handlers/missingPages').bind();
+require('./handlers/externalMissing').bind();
+require('./handlers/suiteFailures').bind();
+
+casper.test.done();

aldryn_newsblog/tests/frontend/unit/test.cl.newsblog.js

@@ -4,7 +4,7 @@
  */
 
 'use strict';
-/* global Cl, describe, it, expect, beforeEach, afterEach, fixture, spyOn */
+/* global Cl, $, describe, window, it, expect, beforeEach, afterEach, fixture, spyOn */
 
 // #############################################################################
 // UNIT TEST

gulpfile.js

@@ -9,14 +9,12 @@
 // IMPORTS
 var gulp = require('gulp');
 var gutil = require('gulp-util');
-var karma = require('karma').server;
-var protractor = require('gulp-protractor').protractor;
+var KarmaServer = require('karma').Server;
 var jshint = require('gulp-jshint');
 var jscs = require('gulp-jscs');
-var webdriverUpdate = require('gulp-protractor').webdriver_update;
-var SauceTunnel = require('sauce-tunnel');
-var tunnel;
-var isTunnelCreated;
+var integrationTests = require('djangocms-casper-helpers/gulp');
+
+var argv = require('minimist')(process.argv.slice(2)); // eslint-disable-line
 
 // #############################################################################
 // SETTINGS
@@ -35,7 +33,12 @@ var PROJECT_PATTERNS = {
     ]
 };
 
-var PORT = parseInt(process.env.PORT, 10) || 8000;
+var INTEGRATION_TESTS = [
+    [
+        'loginAdmin'
+    ]
+];
+
 
 // #############################################################################
 // LINTING
@@ -58,77 +61,31 @@ gulp.task('lint', function () {
 gulp.task('tests', ['tests:unit', 'tests:lint', 'tests:integration']);
 gulp.task('tests:lint', ['lint']);
 gulp.task('tests:unit', function (done) {
-    // run javascript tests
-    karma.start({
+    var server = new KarmaServer({
         configFile: PROJECT_PATH.tests + '/karma.conf.js',
         singleRun: true
     }, done);
-});
-
-gulp.task('tests:sauce:start', function (done) {
-    if (!process.env.CI) {
-        done();
-        return;
-    }
-    tunnel = new SauceTunnel(
-        process.env.SAUCE_USERNAME,
-        process.env.SAUCE_ACCESS_KEY,
-        process.env.TRAVIS_JOB_NUMBER
-    );
 
-    tunnel.start(function (isCreated) {
-        isTunnelCreated = isCreated;
-        if (!isCreated) {
-            console.log('Failed to create Sauce tunnel, returning error code');
-            // force the process to exit with error code if couldn't create the tunnel
-            process.exit(1);
-            return false;
-        }
-        console.log('Connected to Sauce Labs.');
-        done();
-    });
+    server.start();
 });
 
-gulp.task('tests:sauce:end', function (done) {
-    if (!process.env.CI) {
-        done();
-        return;
-    }
-    tunnel.stop(function () {
-        console.log('Stopping the server.');
-        done();
-    });
-});
+// gulp tests:integration [--clean] [--screenshots] [--tests=loginAdmin,toolbar]
+gulp.task('tests:integration', integrationTests({
+    tests: INTEGRATION_TESTS,
+    pathToTests: PROJECT_PATH.tests,
+    argv: argv,
+    dbPath: 'local.sqlite',
+    serverCommand: 'test_settings.py server',
+    logger: gutil.log.bind(gutil)
+}));
 
-gulp.task('tests:webdriver', webdriverUpdate);
-gulp.task('tests:integration', ['tests:webdriver', 'tests:sauce:start'], function () {
-    if (process.env.CI && !isTunnelCreated) {
-        // force the process to exit with error code if couldn't create the tunnel
-        process.exit(1);
-        return false;
-    }
-    return gulp.src([PROJECT_PATH.tests + '/integration/specs/*.js'])
-        .pipe(protractor({
-            configFile: PROJECT_PATH.tests + '/protractor.conf.js',
-            args: ['--baseUrl', 'http://127.0.0.1:' + PORT]
-        }))
-        .on('error', function (error) {
-            gutil.log(gutil.colors.red(
-                'Error (' + error.plugin + '): ' + error.message
-            ));
-            // force the process to exit with error code
-            process.exit(1);
-        })
-        .on('end', function () {
-            gulp.run('tests:sauce:end');
-        });
-});
 
-gulp.task('tests:watch', function () {
-    // run javascript tests
-    karma.start({
+gulp.task('tests:unit:watch', function () {
+    var server = new KarmaServer({
         configFile: PROJECT_PATH.tests + '/karma.conf.js'
     });
+
+    server.start();
 });
 
 // #############################################################################