Advanced Search

Testing JS code

/ Published in: JavaScript
Save to your folder(s)
written test in yui for my jquery code. :)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset=utf-8 />
  5. <title>JS Bin</title>
  6. <!--[if IE]>
  7.   <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  8. <![endif]-->
  9.  
  10. <style>
  11.   article, aside, figure, footer, header, hgroup, 
  12.   menu, nav, section { display: block; }
  13. .yui3-skin-sam .yui3-console-entry-pass .yui3-console-entry-cat {
  14.     background-color: green;
  15.     color: #fff;
  16. }
  17.  
  18. .yui3-skin-sam .yui3-console-entry-fail .yui3-console-entry-cat {
  19.     background-color: red;
  20.     color: #fff;
  21. }
  22.  
  23. .yui3-skin-sam .yui3-console-entry-ignore .yui3-console-entry-cat {
  24.     background-color: #666;
  25. }
  26.  
  27.  
  28. </style>
  29.  
  30. </head>
  31. <body class="yui3-skin-sam  yui-skin-sam">
  32.   <p id="hello">Hello World</p>
  33.   <div id="testLogger"></div>
  34.   <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  35.   <script type="text/javascript" src="http://yui.yahooapis.com/3.2.0/build/yui/yui-min.js"></script>
  36.   <script src="yuitest-min.js"></script>
  37. <script>
  38. jQuery(function($){
  39.   $("#hello").hover(
  40.   function(){
  41.     $(this).css("color","red");
  42.   },
  43.   function(){
  44.     $(this).css("color","blue");                
  45.   });
  46. });
  47.  
  48.  
  49.  
  50.  
  51. YUI().use("console", function (Y) {
  52.  
  53.     var dataTestCase = new YUITest.TestCase({
  54.  
  55.         //name of the test case - if not provided, one is auto-generated
  56.         name : "Data Tests",
  57.  
  58.         //---------------------------------------------------------------------
  59.         // setUp and tearDown methods - optional
  60.         //---------------------------------------------------------------------
  61.  
  62.  
  63.         /*
  64.          * Cleans up everything that was created by setUp().
  65.          */
  66.         tearDown : function () {
  67.             $("#hello").css("color","black");
  68.         },
  69.  
  70.         //---------------------------------------------------------------------
  71.         // Test methods - names must begin with "test"
  72.         //---------------------------------------------------------------------
  73.  
  74.         testMouseOver : function () {
  75.             var Assert = YUITest.Assert;
  76.             $("#hello").trigger("mouseenter");
  77.             Assert.areEqual("red", $("#hello").css("color"), "Allah g kia karoon");            
  78.         },
  79.  
  80.         testMouseOut : function () {
  81.             var Assert = YUITest.Assert;
  82.             $("#hello").trigger("mouseleave");
  83.             Assert.areEqual("blue", $("#hello").css("color"));            
  84.         },
  85.  
  86.  
  87.         //---------------------------------------------------------------------
  88.         // Test methods - also, may just have a space in the name
  89.         //---------------------------------------------------------------------
  90.  
  91.         "This test should fail": function(){
  92.             var Assert = YUITest.Assert;
  93.  
  94.             Assert.fail("This test was supposed to fail.");
  95.         }
  96.  
  97.     });
  98.  
  99.  
  100.     var suite = new YUITest.TestSuite("Example Suite");
  101.     suite.add(dataTestCase);
  102.  
  103.     //create the console
  104.     var r = new Y.Console({
  105.         newestOnTop : false,
  106.         style: 'block' // to anchor in the example content
  107.     });
  108.  
  109.     r.render('#testLogger');
  110.  
  111.     var TestRunner = YUITest.TestRunner;
  112.  
  113.     TestRunner.add(suite);
  114.  
  115.  
  116.     //function to handle events generated by the testrunner
  117.     function logEvent(event){
  118.  
  119.         //data variables
  120.         var message = "",
  121.             messageType = "";
  122.  
  123.         switch(event.type){
  124.             case TestRunner.BEGIN_EVENT:
  125.                 message = "Testing began at " + (new Date()).toString() + ".";
  126.                 messageType = "info";
  127.                 break;
  128.  
  129.             case TestRunner.COMPLETE_EVENT:
  130.                 message = Y.substitute("Testing completed at " +
  131.                     (new Date()).toString() + ".\n" +
  132.                     "Passed:{passed} Failed:{failed} " +
  133.                     "Total:{total} ({ignored} ignored)",
  134.                     event.results);
  135.                 messageType = "info";
  136.                 break;
  137.  
  138.             case TestRunner.TEST_FAIL_EVENT:
  139.                 message = event.testName + ": failed.\n" + event.error.getMessage();
  140.                 messageType = "fail";
  141.                 break;
  142.  
  143.             case TestRunner.TEST_IGNORE_EVENT:
  144.                 message = event.testName + ": ignored.";
  145.                 messageType = "ignore";
  146.                 break;
  147.  
  148.             case TestRunner.TEST_PASS_EVENT:
  149.                 message = event.testName + ": passed.";
  150.                 messageType = "pass";
  151.                 break;
  152.  
  153.             case TestRunner.TEST_SUITE_BEGIN_EVENT:
  154.                 message = "Test suite \"" + event.testSuite.name + "\" started.";
  155.                 messageType = "info";
  156.                 break;
  157.  
  158.             case TestRunner.TEST_SUITE_COMPLETE_EVENT:
  159.                 message = Y.substitute("Test suite \"" +
  160.                     event.testSuite.name + "\" completed" + ".\n" +
  161.                     "Passed:{passed} Failed:{failed} " +
  162.                     "Total:{total} ({ignored} ignored)",
  163.                     event.results);
  164.                 messageType = "info";
  165.                 break;
  166.  
  167.             case TestRunner.TEST_CASE_BEGIN_EVENT:
  168.                 message = "Test case \"" + event.testCase.name + "\" started.";
  169.                 messageType = "info";
  170.                 break;
  171.  
  172.             case TestRunner.TEST_CASE_COMPLETE_EVENT:
  173.                 message = Y.substitute("Test case \"" +
  174.                     event.testCase.name + "\" completed.\n" +
  175.                     "Passed:{passed} Failed:{failed} " +
  176.                     "Total:{total} ({ignored} ignored)",
  177.                     event.results);
  178.                 messageType = "info";
  179.                 break;
  180.             default:
  181.                 message = "Unexpected event " + event.type;
  182.                 message = "info";
  183.         }
  184.  
  185.         //only log if required
  186.         Y.log(message, messageType, "TestRunner");
  187.     }
  188.  
  189.     //listen for events to publish to the logger
  190.     TestRunner.attach(TestRunner.BEGIN_EVENT, logEvent);
  191.     TestRunner.attach(TestRunner.COMPLETE_EVENT, logEvent);
  192.     TestRunner.attach(TestRunner.TEST_CASE_BEGIN_EVENT, logEvent);
  193.     TestRunner.attach(TestRunner.TEST_CASE_COMPLETE_EVENT, logEvent);
  194.     TestRunner.attach(TestRunner.TEST_SUITE_BEGIN_EVENT, logEvent);
  195.     TestRunner.attach(TestRunner.TEST_SUITE_COMPLETE_EVENT, logEvent);
  196.     TestRunner.attach(TestRunner.TEST_PASS_EVENT, logEvent);
  197.     TestRunner.attach(TestRunner.TEST_FAIL_EVENT, logEvent);
  198.     TestRunner.attach(TestRunner.TEST_IGNORE_EVENT, logEvent);
  199.  
  200.  
  201.     //run the tests
  202.     TestRunner.run();
  203.  
  204. });
  205.  
  206. </script>
  207. </body>  
  208. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.