Introduction to DOH robot and its unit test framework

1 Preface

At present, unit testing has been valued by more and more development teams as a means to ensure software quality. In web development, Java has many unit testing methods, and JUnit-based tools emerge one after another. However, there are few excellent tools for unit testing at the front end. Currently, the well-known JS unit testing tools include qunit launched by jquery, DOH launched by dojo, and jsunit, a classic one. Although there are many tools for interface integration testing. However, due to the high cost of interface integration testing, for continuous integration, a large amount of time is required to test a small change to run interface automation test cases. This article will give a preliminary introduction to the DOH testing tool, including its robot and its unit test framework.

2 DOH robot Overview

Based on the applet technology, DOH robot shields browser differences. Events generated using Java code come from outside the browser, different from JS "merging" events. This type of event is trusted by the browser. In addition, DOH robot can simulate interface events more realistically. For example, if you click the mouse, DOH moves the mouse to the target position and then clicks the mouse. As a result, the Mouseover event to be appended will be triggered.

2.1 three DOH Robot

• Doh. Robot

This type of robot does not require the support of dojo. The other two robots require the support of the dojo function.

• Dojo. Robot

The extended doh. Robot and DOH. Robot only support moving the mouse to a specific position, while the dojo. Robot supports moving the mouse to a specified HTML node.

• Dijit. Robot

The extended dojo. Robot enhances the scroll wheel operation. This is generally used less, and I don't quite understand the code of this class :(

2.2 API Introduction

The DOH. robotapi list is as follows:

• Sequence: function (/* function */F,/* integer, optional */delay,/* integer, optional */duration)
• Typekeys: function (/* string | Number */chars,/* integer, optional */delay,/* integer, optional */duration)
• Keypress: function (/* integer */charorcode,/* integer, optional */delay,/* object */modifiers,/* Boolean */asynchronous)
• Keydown: function (/* integer */charorcode,/* integer, optional */delay)
• Keyup: function (/* integer */charorcode,/* integer, optional */delay)
• Mouseclick: function (/* object */buttons,/* integer, optional */delay)
• Mousepress: function (/* object */buttons,/* integer, optional */delay)
• Mousemove: function (/* Number */X,/* Number */y,/* integer, optional */delay,/* integer, optional */duration, /* Boolean */absolute)
• Mouserelease: function (/* object */buttons,/* integer, optional */delay)
• Mousewheel: function (/* Number */wheelamt,/* integer, optional */delay,/* integer, optional */duration)

You can see that the function name basically knows the function. Before introducing the function functions separately, first, we will introduce the common delay and duration parameters (these two parameters are optional in all APIs ):

Both parameters are in milliseconds.

Delay:

Delay functions are similar to setTimeout functions. Indicates that the function will be executed after the time defined by delay. This parameter can be left blank. The default value is 500 milliseconds.

Duration:

This function indicates that the browser has spent so long to complete an interface operation. For example, DOH. robot. typekeys ('dij', 500, 1.8) indicates that after 1.8 milliseconds, the robot will enter three letters on the keyboard, and the entire operation will be seconds. After seconds, the subsequent operation will be performed.

For all keyboard operations, enter the keyboard value. For numeric or numeric keys, you can input the typekeys function as a string. For function keys, you can add the Dojo-defined enumeration class. input the keyboard Code such as DOH. robot. keypress (Dojo. keys. enter, 1000, {}); dojo. the keys code is located in the dojo/_ base/event in the dojo source code package. in JS, the corresponding code snippet is

Dojo. keys = {<br/> // Summary: definitions for common key values <br/> backspace: 8, <br/> tab: 9, <br/> clear: 12, <br/> enter: 13, <br/> shift: 16, <br/> CTRL: 17, <br/> alt: 18, <br/> pause: 19, <br/> caps_lock: 20, <br/> escape: 27, <br/> space: 32, <br/> page_up: 33, <br/> page_down: 34, <br/> end: 35, <br/> Home: 36, <br/> left_arrow: 37, <br/> up_arrow: 38, <br/> right_arrow: 39, <br/> down_arrow: 40, <br/> insert: 45, <br/> Delete: 46, <br/> help: 47, <br/> left_window: 91, <br/> right_window: 92, <br/> select: 93, <br/> numpad_0: 96, <br/> numpad_1: 97, <br/> numpad_2: 98, <br/> numpad_3: 99, <br/> numpad_4: 100, <br/> numpad_5: 101, <br/> numpad_6: 102, <br/> numpad_7: 103, <br/> numpad_8: 104, <br/> numpad_9: 105, <br/> numpad_multiply: 106, <br/> numpad_plus: 107, <br/> numpad_enter: 108, <br/> numpad_minus: 109, <br/> numpad_period: 110, <br/> numpad_divide: 111, <br/> F1: 112, <br/> F2: 113, <br/> F3: 114, <br/> F4: 115, <br/> F5: 116, <br/> F6: 117, <br/> F7: 118, <br/> F8: 119, <br/> F9: 120, <br/> F10: 121, <br/> F11: 122, <br/> F12: 123, <br/> f13: 124, <br/> F14: 125, <br/> F15: 126, <br/> num_lock: 144, <br/> scroll_lock: 145 <br/> };

For mouse events, you need to pass in a buttons object. This object contains three Boolean attributes: left, right, and middle. Indicates that the mouse is pressed by the left button, right click, scroll wheel, true indicates that the status is pressed, or false indicates that the opposite is displayed. Example doh. Robot. mouseclick ({left: true}, 500 );

You can use sequence to execute functional code. For more information, see section 3.

The extended API of dojo. Robot is that you can use the mouse to locate specific HTML nodes.

Mousemoveat: function (/* string | domnode | function */node,/* integer, optional */delay,/* integer, optional */duration,/* number, optional */offsetx,/* number, optional */offsety)

Powerful record 2.3

 

This function is based on dojo and adds dojo. Require ("dojox. Robot. Recorder") to the test page. The function takes effect. The specific operation steps are as follows:

1. Enter the test page and press CTRL + ALT + enter at the start of the test. The Alert box is displayed, indicating that the recording starts.
2. Perform interface operations until the test case ends
3. Click CTRL + ALT + enter again to display the dialog box layer. The test code is automatically generated. You can modify it after copying it.

 

3. Example 3.1 doh. Robot test code

<HTML> <br/> <pead> <br/> <MCE: style> <! -- <Br/> @ import "../robot/robot.css"; <br/> --> </MCE: style> <MCE: style mce_bogus = "1"> <! -- <Br/> @ import ".. /robot/robot.css "; <br/> --> </MCE: style> <MCE: style mce_bogus =" 1 "mce_bogus =" 1 "> <! -- <Br/> @ import ".. /robot/robot.css "; <br/> --> </MCE: style> <MCE: style mce_bogus =" 1 "mce_bogus =" 1 "mce_bogus =" 1 "> <! -- <Br/> @ import ".. /robot/robot.css "; <br/> --> </MCE: style> <MCE: style mce_bogus = "1" mce_bogus = "1" mce_bogus = "1" mce_bogus = "1"> <! -- <Br/> @ import ".. /robot/robot.css "; <br/> --> </MCE: style> <style mce_bogus = "1" mce_bogus = "1" mce_bogus = "1" mce_bogus = "1" mce_bogus = "1"> @ import ".. /robot/robot.css "; </style> <br/> <MCE: script src = ".. /runner. JS "mce_src =" runner. JS "> </MCE: SCRIPT> <br/> <MCE: script src = ".. /robot. JS "mce_src =" robot. JS "> </MCE: SCRIPT> <br/> </pead> <br/> <body> <br/> <form> <br/> <input type = "text" value = "hi" id = "textbox" Sty Le = "position: absolute; left: 0px; top: 20px; font-family: system; "> </input> <br/> </form> <br/> <MCE: Script Type =" text/JavaScript "> <! -- <Br/> DOH. register ("Doh. robot ", // define a test set <br/>{< br/> name:" dojorobot1 ", // define a test case <br/> Timeout: 6900, <br/> setup: function () {<br/> document. getelementbyid ('textbox '). value = "hi"; <br/>}, <br/> runtest: function () {<br/> var d = new DOH. deferred (); <br/> DOH. robot. mousemove (30, 30,500); // move the mouse to the specified coordinate <br/> DOH. robot. mouseclick ({left: true}, 500); // click the mouse <br/> DOH. robot. typekeys ("again", 500,250 0); // type again <br/> DOH. robot. sequence (function () {<br/> If (document. getelementbyid ('textbox '). value = "Hi again") {<br/> document. getelementbyid ('textbox '). value + = ": passed"; // pass test case <br/> D. callback (true); <br/>}else {<br/> document. getelementbyid ('textbox '). value + = ": Failed"; <br/> D. errback (New error ("Expected Value 'Hi again ', got" + document. getelementbyid ('textbox '). value); // error <br/>}< br/>}, 900); <br/> return D; <br/>}< br/> teardown: function () <br/>{< br/>}< br/>}); <br/> DOH. run (); <br/> // --> </MCE: SCRIPT> <br/> </body> <br/> </ptml>

Doh. robot does not require dojo support, so it can be implemented directly by introducing DOH's robot. js. On the page, you can see the mouse slides to 30, 30, and type again to pass the test case

 

3.2 Example of the dojo. Robot test code

Dojo. require ("dojo. robot "); <br/> dojo. addonload (function () {<br/> DOH. register ("Doh. robot ", <br/>{< br/> name:" dojorobot1 ", <br/> Timeout: 6900, <br/> setup: function () {<br/> document. getelementbyid ('textbox '). value = "hi"; <br/>}, <br/> runtest: function () {<br/> var d = new DOH. deferred (); <br/> DOH. robot. mousemoveat (document. getelementbyid ('textbox '), 500); <br/> DOH. robot. mouseclick ({left: true}, 500); <br/> DOH. robot. typekeys ("again", 500,250 0); <br/> DOH. robot. sequence (function () {<br/> If (document. getelementbyid ('textbox '). value = "Hi again") {<br/> document. getelementbyid ('textbox '). value + = ": passed"; <br/> D. callback (true); <br/>}else {<br/> document. getelementbyid ('textbox '). value + = ": Failed"; <br/> D. errback (New error ("Expected Value 'Hi again ', got" + document. getelementbyid ('textbox '). value); <br/>}< br/>}, 900); <br/> return D; <br/>}, <br/> teardown: function () {}< br/>}); <br/> DOH. run (); <br/>}); <br/>

DOH requires the support of dojo, but the function of locating nodes is enhanced.

4. Doh test framework page

DOH provides a testing framework page that provides visual effects similar to JUnit testing. The integration process is

• We create a demo directory of the same level as the util directory of dojo, and write the test framework page under the demo/doh/tests directory. The Code is as follows:

<! Doctype HTML public "-// W3C // dtd html 4.0 transitional // en"> <br/> <HTML> <br/> <pead> <br/> <title> demo. DOH unit test runner </title> <br/> <meta http-equiv = "refresh" <br/> content = "0; url = .. /.. /.. /util/doh/runner.html? Testmodule = demo. DOH. tests. module & registermodulepath = .. /demo, Demo "> <br/> </pead> <br/> <body> <br/> redirecting to D. o. h runner. <br/> </body> <br/> </ptml>

Registermodulepath = .. /demo. Demo defines the module path and module name. The module name is demo and the path is .. /demo, note that if the relative path is written here, it is relative to the connection page .. /.. /.. the path of/util/doh/runner.html, not the path of the test framework page you wrote. testmodel specifies the test module definition file. The file here follows the dojo style, which is used as the path delimiter. because the module path demo is defined .. /demo, so the module File here is the path of the demo/doh/tests/module/JS

In fact, the demo here is the demo directory we created. The module. js and the test framework page are in the same directory.

• Module. JS is actually a list of Test Modules.

Dojo. provide ("demo. DOH. tests. module "); <br/> // This file loads in all the test definitions. <br/> try {<br/> // load in the widget tests. <br/> dojo. require ("demo. DOH. tests. widgets. demowidget "); <br/>} catch (e) {<br/> DOH. debug (E); <br/>}

Module. js defines the test module demo. Doh. Tests. Widgets. demowidget to be loaded.

• The test module defines JS demo. Doh. Tests. Widgets. demowidget.

Dojo. provide ("demo. DOH. tests. widgets. demowidget "); <br/> If (Dojo. isbrowser) {<br/> // define the HTML file/module URL to import as a 'remote' test. <br/> DOH. registerurl ("demo. DOH. tests. widgets. demowidget ", <br/> dojo. moduleurl ("Demo", <br/> "doh/tests/widgets/demowidget.html"); <br/>}

This plugin defines the test page demowidget.html. You only need to write the test code described above in the test page to run the unit test.

5. FAQ 5.1 the following error occurs when the applet cannot be loaded:

1. Delete All JRE;

2. Windows System system disk C:

There are three folders under the directory "C:/Documents ents and settings" (maybe you don't have all of them, it doesn't matter ):

"All users. Windows"

"Default User"

Another one is your username.

Each directory has a structure.

/Application Data/

/Local Settings/Application Data

All sun directories under these two directories are deleted;

3. Install the JRE you want to install and restart your computer!

5.2 no input for executing the typekey Function

Use the DOH version released with dojo1.2.1 or later, and make sure that the input method is disabled in your browser window.