Campaign tests

.gitignore

@@ -1,3 +1,4 @@
+tmp/
 .vagrant
 *.DS_Store
 html/

scripts/tests/before_tests.sh

@@ -5,36 +5,51 @@
 # Tasks to run before functional testing.
 # ==============================================================================
 
-printf "\n\033[1;33mPerforming pre-test steps...\033[00m\n"
+printf "\033[1;33mPerforming pre-test steps...\033[00m\n"
 
 cd /var/www/vagrant/html
 
 # Clear out localhost from flood table (prevents "more than 5 failed login attempts" error)
+echo "Clearing localhost from flood table..."
 drush sql-query "DELETE FROM flood WHERE identifier LIKE '%127.0.0.1';"
 
-
 # Create fresh test accounts
+drush_get_uid_from_email() {
+  drush user-information $1 | grep "User ID" | sed -e 's/[ ]*User ID[ ]*\:[ ]*//g' | sed -e 's/[ ]*//g'
+}
+
 drush_create_test_user() {
-  {
-    USERNAME=$1
-    drush user-create $USERNAME --mail="$USERNAME@example.com" --password="$USERNAME"
-  } &> /dev/null
+  USERNAME=$1
+  drush user-create $USERNAME --mail="$USERNAME@example.com" --password="$USERNAME"
 }
 
 drush_delete_user_with_email() {
+  uid=$(drush_get_uid_from_email $1)
   {
-    drush user-information $1 | grep "User ID" | sed -e 's/[ ]*User ID[ ]*\:[ ]*//g' | xargs -i drush user-cancel {} -y  &> /dev/null
+    if [[ $uid -ne 0 ]]
+    then
+      drush user-cancel "$uid" -y --quiet
+    fi
   } &> /dev/null
 }
 
-echo "Creating fresh test accounts..."
-## Delete users created during previous test runs...
+drush_signup_user() {
+  uid=$(drush_get_uid_from_email $2)
+  drush php-eval "dosomething_signup_create($1, $uid)"
+}
+
+echo "Deleting users created during previous test runs..."
 drush_delete_user_with_email QA_TEST_ACCOUNT@example.com
 drush_delete_user_with_email QA_TEST_USER_REGISTER@example.com
 drush_delete_user_with_email QA_TEST_CAMPAIGN_SIGNUP_EXISTING@example.com 
 drush_delete_user_with_email QA_TEST_CAMPAIGN_SIGNUP_NEW@example.com
+drush_delete_user_with_email QA_TEST_CAMPAIGN_ACTION@example.com
 
-## Make fresh test accounts...
+echo "Making fresh test accounts..."
 drush_create_test_user QA_TEST_ACCOUNT
 drush_create_test_user QA_TEST_CAMPAIGN_SIGNUP_EXISTING
+drush_create_test_user QA_TEST_CAMPAIGN_ACTION
 
+echo "Signing action page test account up for test campaign..."
+example_campaign_nid=1261
+drush_signup_user $example_campaign_nid QA_TEST_CAMPAIGN_ACTION@example.com

scripts/tests/common.js

@@ -9,14 +9,18 @@ var url = casper.cli.get('url');
 casper.options.viewportSize = { width: 1280, height: 1024 };
 
 // Use to log in before performing a test.
-casper.login = function() {
-  this.echo("Logging in as test user.");
+casper.login = function(username, password) {
+  // If no arguments are given, log in using default test account
+  username = typeof username == "string" ? username : "QA_TEST_ACCOUNT@example.com";
+  password = typeof password == "string" ? password : "QA_TEST_ACCOUNT";
+
+  this.echo("Logging in as: " + username);
 
   // Go home and login.
   casper.thenOpen(url + "/user", function() {
     this.fill('form[action="/user/login"]', {
-      name: 'QA_TEST_ACCOUNT@example.com',
-      pass: 'QA_TEST_ACCOUNT'
+      name: username,
+      pass: password
     }, true);
   });
 }
@@ -29,6 +33,11 @@ casper.logout = function() {
   });
 }
 
+// We want to start at the homepage on each test.
+casper.test.setUp(function() {
+  casper.start(url);
+});
+
 // We want to clear session after every test.
 casper.test.tearDown(function() {
   phantom.clearCookies();

tests/campaign/action.js

@@ -0,0 +1,123 @@
+/**
+ * action.js
+ * Test action page is rendered correctly
+ */
+
+var x = require('casper').selectXPath;
+
+casper.test.begin("Test action page is rendered correctly", 22, function suite(test) {
+  casper.login("QA_TEST_CAMPAIGN_ACTION@example.com", "QA_TEST_CAMPAIGN_ACTION");
+
+  // ## Header 
+  casper.thenOpen(url + "/campaigns/test-campaign", function() {
+    // We expect to see the title and subtitle of the campaign
+    test.assertSelectorHasText("header[role='banner'].-hero .__title", "Test Campaign", "Title of campaign is printed in H1.");
+    test.assertSelectorHasText("header[role='banner'].-hero .__subtitle", "This is a test unsponsored campaign.", "Subtitle of campaign is printed in H2.");
+  });
+
+  // ## Know It
+  casper.then(function() {
+    test.assertSelectorHasText("#know .container__title", "Step 1: Know It", "\"Know It\" banner exists.");
+    this.captureSelector("tmp/tests/step1.png", "#know");
+
+    test.assertNotVisible("[data-modal]", "Modals are hidden on page load.")
+
+    casper.click(x('//*[text()="Check out our FAQs"]'));
+    this.waitUntilVisible("#modal-faq", function() {
+      test.assertSelectorHasText("#modal-faq", "Why is 'fee awesome?", "FAQ modal displays on click.");
+    });
+  });
+
+  casper.then(function() {
+    casper.click("#modal-faq .js-close-modal");
+    this.waitWhileVisible("#modal-faq", function() {
+      test.assert(true, "Clicking the close button hides the modal.")
+    });
+  });
+
+  casper.then(function() {
+    casper.click(x('//*[text()="Learn more about Coffee"]'));
+    this.waitUntilVisible("#modal-facts", function() {
+      test.assertSelectorHasText("#modal-facts", "1 in 3 teenagers have slept through math", "Fact modal displays on click.");
+    });
+  });
+
+  // ## Plan It
+  casper.then(function() {
+    test.assertSelectorHasText("#plan .container__title", "Step 2: Plan It", "\"Plan It\" banner exists.");
+    this.captureSelector("tmp/tests/step2.png", "#plan");
+  });
+
+  // ## Do It
+  casper.then(function() {
+    test.assertSelectorHasText("#do .container__title", "Step 3: Do It", "\"Do It\" banner exists.");
+    this.captureSelector("tmp/tests/step3.png", "#do");
+
+
+    // @NOTE: Can't use assertVisible() because of "visually-hidden" mixin trickiness.
+    test.assertExists("#tip-1.is-active", "First tip is visible on page load.");
+    test.assertDoesntExist("#tip-2.is-active", "Second tip is hidden on page load.");
+
+    casper.click(x('//*[text()="Give Him \'Fee"]'));
+
+    test.assertDoesntExist("#tip-1.is-active", "First tip is hidden after clicking second tip link.");
+    test.assertExists("#tip-2.is-active", "Second tip is visible after clicking second tip link.");
+  });
+
+  // ## Prove It
+  casper.then(function() {
+    test.assertSelectorHasText("#prove .container__title", "Step 4: Prove It", "\"Prove It\" banner exists.");
+    this.captureSelector("tmp/tests/step4.png", "#prove");
+
+    casper.click(".info-bar .help a");
+    this.waitUntilVisible("#modal-contact-form", function() {
+      test.assertSelectorHasText("#modal-contact-form", "Enter your question below.", "Zendesk modal displays on click.");
+    });
+  });
+
+  casper.then(function() {
+    casper.click("#modal-contact-form .js-close-modal");
+  });
+
+  // ## Report Back
+  casper.then(function() {
+    casper.click(x('//*[text()="Submit Your Pic"]'));
+    this.waitUntilVisible("[data-modal]", function() {
+      test.assertSelectorHasText("#modal-report-back", "Prove It", "Report Back modal displays on click.");
+    });
+  });
+
+  casper.then(function() {
+    this.fill("form[action='/campaigns/test-campaign']", {
+      "files[reportback_file]": "tests/fixtures/reportback-image.png",
+      "quantity": "10",
+      "why_participated": "Test response."
+    }, true);
+  });
+
+
+  // Confirmation page
+  casper.then(function() {
+    test.assertSelectorHasText("header[role='banner'] .__title", "You did it!", "Confirmation page shown after report back.");
+    test.assertSelectorHasText("header[role='banner'] .__subtitle", "You sure drank that 'fee. Good work!", "Campaign confirmation message is shown in subtitle.");
+
+    test.assertElementCount(".gallery .gallery-item", 3, "Three suggested campaigns are shown.");
+
+    casper.click(x('//*[text()="Back to Test Campaign"]'));
+  });
+
+  // Check that reportback submitted successfully.
+  casper.then(function() {
+    casper.click(x('//*[text()="Update Submission"]'));
+    this.waitUntilVisible("[data-modal]", function() {
+      test.assertExists("#modal-report-back .submitted-image img", "Submitted report back image is shown.")
+      test.assertField("quantity", "10", "Submitted quantity is shown for editing.")
+      test.assertField("why_participated", "Test response.", "Submitted 'Why Participated?' is shown for editing.")
+    });
+  });
+
+  casper.run(function() {
+    test.done();
+  });
+});
+

tests/campaign/signup.js → tests/campaign/pitch.js

@@ -27,9 +27,12 @@ casper.test.begin("Test that an unregistered user can register & sign up for a c
 
   casper.thenOpen(url + "/campaigns/test-campaign", function(){
     // We expect to see a sign up button, and to be able to click it to sign up.
-    this.click("#link--campaign-signup-login");
+
+    this.waitUntilVisible("#link--campaign-signup-login", function() {
+      this.click("#link--campaign-signup-login");
+    });
 
-    this.waitUntilVisible(".modal-content", function() {
+    this.waitUntilVisible("[data-modal]", function() {
       this.click("#link--register");
     });
   });
@@ -60,9 +63,11 @@ casper.test.begin("Test that a logged-out user can log in & sign up for a campai
 
   casper.thenOpen(url + "/campaigns/test-campaign", function(){
     // We expect to see a sign up button, and to be able to click it to sign up.
-    this.click("#link--campaign-signup-login");
+    this.waitUntilVisible("#link--campaign-signup-login", function() {
+      this.click("#link--campaign-signup-login");
+    });
 
-    this.waitUntilVisible(".modal-content", function() {
+    this.waitUntilVisible("[data-modal]", function() {
       this.fill("form#user-login-form", {
         name: 'QA_TEST_CAMPAIGN_SIGNUP_EXISTING@example.com',
         pass: 'QA_TEST_CAMPAIGN_SIGNUP_EXISTING'

tests/user/login.js

@@ -16,8 +16,8 @@ casper.test.begin('Test that a user can authenticate correctly.', 6, function su
     this.click("#link--login");
 
     // We should see a modal with the login form.
-    this.waitUntilVisible(".modal-content", function() {
-      test.assertExists(".modal-content form[action='/user/login']", "Clicking the login link shows modal login form");
+    this.waitUntilVisible("[data-modal]", function() {
+      test.assertExists("[data-modal] form[action='/user/login']", "Clicking the login link shows modal login form");
     });
   });
 
@@ -36,10 +36,12 @@ casper.test.begin('Test that a user can authenticate correctly.', 6, function su
 
   casper.thenOpen(url, function() {
     // Now let's go back home and login using the login modal.
-    this.click("#link--login");
+    this.waitUntilVisible("#link--login", function() {
+      this.click("#link--login");
+    });
 
     // We should see a modal with the login form.
-    this.waitUntilVisible(".modal-content", function() {
+    this.waitUntilVisible("[data-modal]", function() {
       this.fill('form[action="/user/login"]', {
         name: 'QA_TEST_ACCOUNT@example.com',
         pass: 'QA_TEST_ACCOUNT'

tests/user/register.js

@@ -3,6 +3,8 @@
  * Test that a user can create an account.
  */
 
+var REGISTER_SUCCESSFUL_MESSAGE = "You've created an account";
+
 casper.test.begin("Test that a user can create an account.", 4, function suite(test) {
   casper.start(url);
 
@@ -13,7 +15,7 @@ casper.test.begin("Test that a user can create an account.", 4, function suite(t
     // Click the login link in the header navigation menu.
     this.click("#link--login");
 
-    this.waitUntilVisible(".modal-content", function() {
+    this.waitUntilVisible("[data-modal]", function() {
       this.click("#link--register");
 
       // Enter with some incorrect fields (email and confirmation)
@@ -44,7 +46,7 @@ casper.test.begin("Test that a user can create an account.", 4, function suite(t
 
     // This should be fine, so let's look for a successful confirmation message.
     casper.waitForSelector(".messages", function() {
-      test.assertSelectorHasText(".messages", "Registration successful");
+      test.assertSelectorHasText(".messages", REGISTER_SUCCESSFUL_MESSAGE);
     });
   });