-
-
Save flashvnn/417a517c953135125e972ea22cf76602 to your computer and use it in GitHub Desktop.
This sample accompanies a blog post series about CasperJS found at http://fourword.fourkitchens.com/article/testing-drupal-casperjs
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * @file | |
| * Testing a demo of Drupal. The script will log in and check for various | |
| * features in Drupal core. This demo was inspired by a similar script for | |
| * a Wordpress site. The original script was written by Henrique Vicente. | |
| * | |
| * @see https://github.com/henvic/phantom-casper-simple-talk/blob/master/wordpress.js | |
| */ | |
| // Set up variables to visit a URL and log in. | |
| var config = { | |
| 'host': 'http://demo.opensourcecms.com/drupal', | |
| 'form': { | |
| 'name': 'admin', | |
| 'pass': 'demo123' | |
| } | |
| }; | |
| // In one of the tests we want to set some content up, then test it in the | |
| // following block of code. Setting this content up as a global variable helps | |
| // keep the testing code DRY and reliable. | |
| var nodeContents = { | |
| 'title': 'Hello, World!', | |
| 'body[und][0][value]': 'This content was added by CasperJS!' | |
| }; | |
| // Define the suite of tests and give it the following properties: | |
| // - Title, which shows up before any of the pass/fails. | |
| // - Number of tests, must be changed as you add tests. | |
| // - suite(), which contains all of your tests. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/tester.html#begin | |
| casper.test.begin('Testing Drupal demo site', 8, function suite(test) { | |
| // casper.start() always wraps your first action. The first argument should | |
| // be the URL of the page you want to test. Instead of being hard-coded, ours | |
| // comes from the config object we defined above. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/casper.html#start | |
| casper.start(config.host, function() { | |
| // casper.fill() allows you to populate and submit forms. | |
| // | |
| // The first argument is any selector that can uniquely identify your form. | |
| // | |
| // The second argument is an object containing the data you want to submit | |
| // using this form. Our config.form variable was defined at the beginning of | |
| // this file. Each property name of the object you supply should be identical | |
| // to the `name` attr on the form you're filling out. | |
| // | |
| // The third argument is a boolean that tells Casper whether the form should | |
| // be submitted automatically. There are other ways of submitting forms, | |
| // such as finding the submit button and running the click() operation on it. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/casper.html#fill | |
| casper.fill('form#user-login-form', config.form, true); | |
| // You can output comments at any point in your script. Sometimes it's good | |
| // to add a message when you're attempting an operation that might take a | |
| // few moments to respond, such as this login attempt. | |
| test.comment('Logging in...'); | |
| }); | |
| // casper.then() allows us to wait until previous tests and actions are | |
| // completed before moving on to the next steps. This is useful for many | |
| // situations and authenticated sessions are a prime candidate, since we | |
| // cannot perform any further actions if we failed to authenticate. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/casper.html#then | |
| casper.then(function() { | |
| // test.assertHttpStatus() determines which HTTP response code was sent from | |
| // the server. All of the tests in this file are checking for 200, which is | |
| // a normal, successful response. But there's nothing stopping someone from | |
| // intentionally checking for 403, 404, or even 500 errors from the server. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/tester.html#asserthttpstatus | |
| test.assertHttpStatus(200, "Authentication successful"); | |
| // Now that we're logged in, check for the `logged-in` class that is appended | |
| // to the <body> tag for all authenticated Drupal traffic. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/tester.html#assertexists | |
| test.assertExists('body.logged-in', 'Drupal class for logged-in users was found.'); | |
| // We want to browse the content list that is available to Drupal admins, | |
| // so we are clicking the Content link in the admin toolbar. The next series | |
| // of steps assumes that Overlay module is enabled, which is the default for | |
| // the Standard installation profile in Drupal 7. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/casper.html#click | |
| this.click('a[href="/drupal/admin/content"]'); | |
| // Log the click to the console so we know why it's pausing momentarily. | |
| test.comment('Clicking the Content admin link...'); | |
| }); | |
| // Now that we've authenticated and loaded the content page, it's time to look | |
| // for some content. | |
| casper.then(function() { | |
| // First we see if the Overlay updated the page title correctly. The first | |
| // argument is a regex that is run against <title> tag. The second argument | |
| // is optional and can be used to provide a more descriptive test result. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/tester.html#asserttitlematch | |
| test.assertTitleMatch(/Content | Drupal Demo Install/, 'Overlay changed page title to contain the word "Content"'); | |
| // We also check that the URL is updated as expected. For science. Arguments | |
| // are the same as test.assertTitleMatch() | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/tester.html#asserturlmatch | |
| test.assertUrlMatch(/drupal\/node#overlay=admin\/content/, 'Overlay updated the URL to drupal/node#overlay=admin/content'); | |
| // Instead of clicking another link, we want to load the node/add/page page | |
| // without our dear friend, the Overlay. casper.open() simply loads a new | |
| // URL. We put this at the end of the code block and use casper.then() to | |
| // ensure that the next tests are run after the page is finished opening. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/casper.html#open | |
| this.open(config.host + '/node/add/page'); | |
| // Log this action to the console as an informational courtesy to the user. | |
| test.comment('Adding Basic page...'); | |
| }); | |
| // With our fresh node/add page, we want to populate and submit another form. | |
| casper.then(function() { | |
| // Check that the page loaded properly. | |
| test.assertHttpStatus(200, 'Opened the node/add/page page.'); | |
| // Look for the node form that we want to populate. | |
| test.assertExists('form#page-node-form', 'Found the node/add/page form.'); | |
| // Populate the form with the content we prepared at the beginning of this | |
| // file. As the notes above explain, we do not want to repeat the values we | |
| // submit here in the next test, because if we update these values later and | |
| // forget to change both simultaneously, then it will appear that the site | |
| // broke when it is actually our test that is broken. | |
| casper.fill('form#page-node-form', nodeContents, true); | |
| // Once again, report that we're saving the node to keep the user informed. | |
| test.comment('Saving new node...'); | |
| }); | |
| // Drupal automatically redirects to the published node on success. With the | |
| // form submitted, we check to see what the published content looks like. | |
| casper.then(function() { | |
| // Check the page title of the published node. Since we don't want to hard- | |
| // code any of the test values, we use the `new RegExp` syntax which allows | |
| // the regex to contain variables. | |
| test.assertTitleMatch(new RegExp(nodeContents.title), 'Our custom title was found on the published page.'); | |
| // Now we do some very light screen scraping to find the text that we added | |
| // to the body field of this node. Since Drupal 7 has jQuery 1.4.4 out of | |
| // the box, it is safe to rely on it to extract our text. | |
| // | |
| // test.assertEvalEquals() allows us to execute arbitrary code and compare | |
| // the results with a pre-defined value. The first argument is a function | |
| // containing our code that will be evaluated in the context of the testing | |
| // environment. The second argument (which is sourced from our variable at | |
| // the beginning of the file) is the expected result. The third argument is | |
| // optional and allows us to provide a more descriptive test result. | |
| // | |
| // @see http://casperjs.readthedocs.org/en/latest/modules/tester.html#assertevalequals | |
| test.assertEvalEquals(function () { | |
| return jQuery('.node-page .content p').text(); | |
| }, nodeContents['body[und][0][value]'], 'Our custom text was found on the published page.'); | |
| }); | |
| // This code runs all the tests that we defined above. | |
| casper.run(function () { | |
| test.done(); | |
| }); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment