The qunit of JS Automated test Unit Test

Objective

Because the company developed a set of JavaScript SDK needs to test, on the internet for a long time, found the jquery team developed Qunit, and based on JUnit Jsunit, and some have not seen, first talk about Qunit it

Download

Login to jquery website http://qunitjs.com/directly to the right of the homepage to download the latest version of Qunit.

or click to download qunit-1.16.0.js, use qunit also need to download the official CSS file. Qunit-1.16.0.css

Using Qunit Prerequisites

1, need to quote qunit-1.16.0.js and QUNIT-1.16.0.CSS, some people will ask, CSS can not reference it, the answer is no. Shows the style that executes the result of the use case, which needs CSS to display.

2, need to add two lines of HTML code in the body tag, the id attribute can not be removed oh ~

<div id= "Qunit" ></div><div id= "Qunit-fixture" ></div>

3, need to write a JS for testing. There's a way to write a user.js a login log out and determine if the user name exists. Quote this User.js

Post the User.js code

View Code

Using Qunit

1, test: All use cases must be executed in the test method, representing a test case, generally a use case has n assertions.

Test log in Test (' User.login ', function () {    equal (' User.login (' Milan ', ' 123 '), ' milan123 ', ' login Test ');})

Run results

2. Assertion function

1. Ok (result, message) asserts that the return value is True/false
2. Equal (actual, expected, message) actual is the actual value, expected is the expected value, and a shallow contrast determines whether the actual value is equal to the expected value. equal to = =
3. Propequal (actual, expected, message) is used to determine whether an object and a value are equal
4. Deepequal (actual, expected, message) deep contrast, used to determine whether two value types and values are equal, equal to = = =
5. The above 2, 3, and 4 respectively provide functionally opposite functions notequal, notpropequal, notdeepequal. The parameters are the same as those of 2, 3, and 4.

You can also search in the source code of Qunit-1.16.0.js "Notpropequal" (or other function names), the search to the sibling function is Qunit provides the assertion function, you can easily view and expand. Such as:

3. Using Assert functions

Landlord generally like an interface a test case, of course, everyone's habits are different. Can not generalize, anyway as long as clear easy to read on it!

Log out Test (' user.logout ', function () {OK (user.logout () ==1, "Logout test OK"),//Verify the actual value is not equal to the asserted value is correct, here is actually equal, so it is wrong notequal ( User.logout () ==1,true, "Logout Test notequal"); Verify that the actual value equals the assertion value equal (User.logout () ==1,true, "Logout Test notequal"); Verify that the return value is the same type as the same value deepequal (User.logout (), 1, "Logout Test deepequal"); Get the user Information test ("User.getuser", function () {/////To determine whether two objects are equal this method does not apply to determine the basic numeric value or the string propequal (User.getuser (), {"UserName": "N", "Userpwd": ""}, "Logout Test propequal"); Determine if unequal, unequal to pass notpropequal (User.getuser (), {"UserName": "N", "Userpwd": ""}, "Logout Test Propequal");});

Execution results

4, Qunit implementation of asynchronous testing

As we all know, to test the interface/method, we must wait for the return value of the interface to test, if there is no return value, we do not know the result is right.

So asynchronous testing generally has two methods: one is to pass the callback as a parameter into the method, and the other is to provide a variable, we can assign the callback function to the variable, and then execute the callback function we wrote after the asynchronous processing is completed.

Here we use settimeout to simulate asynchronous deferred return operations.

Use case code:

Modular Module ("Asynchronous Test");////method  passed in the   async test  user.existusername (' Milan ', function (result) {////////  Note Here is the first tune method, and then write the use case Oh.  Test ("User.existusername", function () {    ok (result==1, "Determine if the user name exists OK");    NotEqual (Result==1,true, "Determine if the user name exists notequal");});  /Method Two call the built-in variable assignment in the way passed in to the async test user.callback=function (Result) {test ("user.existusername2", function () {    ok (result==1, " Determine if the user name exists OK ");    NotEqual (Result==1,true, "Determine if the user name exists notequal");}  ); User.existusername2 (' Milan ');

Test results:

5, modular

In the async test above, we saw that the word "async test" was at the beginning of each use case. So how did these words come from?

Many times, we will be dazzled by the plethora of use cases to be tested. Qunit provides modules ("module names") to implement use case grouping.

Use the method directly in the place to be modular. Referring to the code and results of the 4th asynchronous test

Paste the code for all the HTML tutorials

View Code

Conclusion

In a lot of times, we can not put each method to the extreme, did not mention, but also need to try a lot of people. The first time you write a blog, write poorly, have any suggestions or questions, you can reply below. Landlord will be seen after the first time to solve. Thank you!

The qunit of JS Automated test Unit Test