[Httpunit-commit] CVS: httpunit/sitedocs/doc cookbook.html,NONE,1.1 javascript-support.html,NONE,1.1
Brought to you by:
russgold
|
From: Russell G. <rus...@us...> - 2003-05-18 13:01:10
|
Update of /cvsroot/httpunit/httpunit/sitedocs/doc
In directory sc8-pr-cvs1:/tmp/cvs-serv9226/sitedocs/doc
Added Files:
cookbook.html javascript-support.html
Removed Files:
Cookbook.html Javascript-support.html
Log Message:
fix capitalization for unix
--- NEW FILE ---
<HEAD><TITLE>HttpUnit Cookbook</TITLE></HEAD>
<body>
Here is a brief description of how you can use HttpUnit with JUnit to test your own web sites.
<H2>Obtaining a web page response</H2>
The center of HttpUnit is the <A HREF="api/com/meterware/httpunit/WebConversation.html">WebConversation</A> class,
which takes the place of a browser talking to a single site. It is responsible for maintaining session context,
which it does via cookies returned by the server. To use it, one must create a
<A HREF="api/com/meterware/httpunit/WebRequest.html">request</A> and ask the WebConversation for a response.<BR>
For example:
<PRE>
WebConversation wc = <b>new</b> WebConversation();
WebRequest req = <b>new</b> GetMethodWebRequest( "http://www.meterware.com/testpage.html" );
WebResponse resp = wc.getResponse( req );
</PRE>
The <A HREF="api/com/meterware/httpunit/WebResponse.html">response</A> may now be manipulated either as
pure text (via the <CODE>getText()</CODE> method), as a DOM (via the <CODE>getDOM()</CODE> method),
or by using the various other methods described below. Because the above sequence is so common, it can be abbreviated to:
<PRE>
WebConversation wc = <b>new</b> WebConversation();
WebResponse resp = wc.getResponse( "http://www.meterware.com/testpage.html" );
</PRE>
<H2>Examining and following links</H2>
The simplest and most common form of navigation among web pages is via links. HttpUnit allows users to find links
by the text within them, and to use those links as new page requests. For example, this page contains a link to the JavaDoc
for the <CODE>WebResponse</CODE> class, above. That page could therefore be obtained as follows:
<PRE>
WebConversation wc = <b>new</b> WebConversation();
WebResponse resp = wc.getResponse( "http://www.httpunit.org/doc/Cookbook.html" ); // read this page
WebLink link = resp.getLinkWith( "response" ); // find the link
link.click(); // follow it
WebResponse jdoc = wc.getCurrentPage(); // retrieve the referenced page
</PRE>
Image links can be found as well. The <CODE>WebResponse.getLinkWithImageText()</CODE> method can look up links by examining
the ALT text, or the <CODE>HttpUnitOptions.setImagesTreatedAsAltText</CODE> method can cause ALT text to be treated as
ordinary searchable text.
<H2>Using the table structure of a web page</H2>
Many web designers make heavy use of tables to control the page formatting. You can take advantage of this by looking
at the tables in the page as discrete elements. The :<CODE>getTables()</CODE> method will return an array of the top-level
tables in the page (that is, those which are not nested within other tables), in the order in which they appear in the
document. Given a table, you can ask for one of its cells, and treat the result either as text or a DOM or ask for
and tables, links, or forms nested within it. For example, the following code will confirm that the first table in the page
has 4 rows and 3 columns, and that there is a single link in the last cell of the first row:
<PRE>
WebTable table = resp.getTables()[0];
assertEquals( "rows", 4, table.getRowCount() );
assertEquals( "columns", 3, table.getColumnCount() );
assertEquals( "links", 1, table.getTableCell( 0, 2 ).getLinks().length );
</PRE>
In most cases, the purpose of a test is to verify the text, rather than the formatting. HttpUnit provides shortcuts to do this.
For example, imagine that the second table in the page should look like this:
<DIV ALIGN="LEFT">
<TABLE CELLPADDING=1 CELLSPACING=2 WIDTH=150 BORDER=1>
<TR><TH>Name</TH><TH>Color</TH></TR>
<TR><TD>gules</TD><TD>red</TD></TR>
<TR><TD>sable</TD><TD>black</TD></TR>
</TABLE>
</DIV>
<P>The following JUnit code will verify it:<PRE>
String[][] colors = resp.getTables()[1].asText();
assertEquals( "Name", colors[0][0] );
assertEquals( "Color", colors[0][1] );
assertEquals( "gules", colors[1][0] );
assertEquals( "red", colors[1][1] );
assertEquals( "sable", colors[2][0] );
assertEquals( "black", colors[2][1] );
</PRE>
Note that the <CODE>asText()</CODE> method, used to convert an entire table into an array of String ignores all formatting tags.
At times, entire rows or columns of a table may be used for appearance purposes only. You can ignore rows or columns consisting
only of images or empty tags by invoking <CODE>purgeEmptyCells</CODE> on the table.
In many cases, tables begin with some fixed text and the purpose of the test is to verify the dynamic portion. As a general rule,
the first cell will contain something fixed and you can search for it - even if the table is nested inside other tables. Thus,
the above table could have been found with:
<PRE>String[][] colors = resp.getTableStartingWith( "Name" );
</PRE>
which has the advantage of being immune to many page formatting changes which might make it the third or fourth table.
<H2>Working with forms</H2>
<P>A dynamic web site tends to have many html forms, each of which contains various kinds of controls: text boxes, pull-down menus,
radio buttons, and so on. The HTML for these controls vary widely; however, the intent is roughly the same, so HttpUnit
makes them look the same.</P>
<P>There are a few basic things that a tester is likely to want to do with a form. The most obvious first step is to verify the
controls and their default values; if they are correct, the tester will generally make some changes and submit the form to
see how the system responds. HttpUnit makes both tasks easy.</P>
<P>The examples below assume the following form definition:</P>
<TABLE CELLPADDING="3" BORDER="1"><TR><TD><FORM>
Restaurant Name:<INPUT type="text" NAME="Name" VALUE="La Cerentolla"><BR>
Restaurant Type:
<INPUT type="radio" NAME="Food" VALUE="Chinese" CHECKED>Chinese</INPUT>
<INPUT type="radio" NAME="Food" VALUE="TexMex">Tex/Mex</INPUT>
<INPUT type="radio" NAME="Food" VALUE="Italian">Italian</INPUT><BR>
Location:<SELECT NAME="Location"><OPTION VALUE="CenterCity">Center City</OPTION>
<OPTION VALUE="Northeast">Northeast</OPTION><OPTION VALUE="Manayunk" SELECTED>Manayunk</OPTION>
<OPTION VALUE="PennsLanding">Penns Landing</OPTION></SELECT><BR>
<INPUT type="checkbox" NAME="CreditCard" CHECKED>Accepts Credit Cards</INPUT><BR>
<BR><INPUT TYPE="submit" VALUE="Update">
</FORM></TD></TR></TABLE>
The default values may be checked as follows:
<PRE>
WebForm form = resp.getForms()[0]; // select the first form in the page
assertEquals( "La Cerentolla", form.getParameterValue( "Name" ) );
assertEquals( "Chinese", form.getParameterValue( "Food" ) );
assertEquals( "Manayunk", form.getParameterValue( "Location" ) );
assertEquals( "on", form.getParameterValue( "CreditCard" ) );
</PRE>
Note that all controls are treated alike, with the exception of the checkbox.
<P>Simulating the submission of the form can be done most simply by obtaining the form object and calling its 'submit'
method, possibly modifying the form parameters beforehand. For example, to correct the restaurant type and
indicate that it does not accept credit cards:
<PRE>
form.setParameter( "Food", "Italian" ); // select one of the permitted values for food
form.removeParameter( "CreditCard" ); // clear the check box
form.submit(); // submit the form
</PRE>
And of course the test could then proceed to examine the response to this submission as well,
obtaining it from <code>wc.getCurrentPage()</code>.
<H2>Working with frames</H2>
<P>Without frames, web interaction tends to be straightforward and sequential. There is one current active page at a time,
and each new page replaces the old one that referenced it. Frames change that, allowing multiple active pages simultaneously,
and allowing for the possibility that a link from one active page could result in the replacement of a different page.</P>
<P>HttpUnit supports frames by providing methods on the WebConversation class to examine those frames
which are currently active. Each response replaces the contents of the appropriate frame, which is not necessarily
the topmost frame ("_top"). In the following scenation, there are two active subframes, named "overview" and "details":
<PRE>
WebConversation wc = <b>new</b> WebConversation();
WebResponse top = wc.getResponse( "http://www.meterware.com/Frames.html" ); // read a page with two frames
WebResponse summary = wc.getFrameContents( "summary" ); // read the summary frame
WebLink link = summary.getLinkWith( "Cake Recipe" ); // find the link (which targets "details" );
link.click(); // click on it
WebResponse response= wc.getFrameContents( "details" ); // retrieve the details frame
</PRE>
</BODY>
</HTML>
--- NEW FILE ---
<html>
<head><title>JavaScript Support</title></head>
<body>
<p>
JavaScript support is very basic at present. The near-term goal is full JavaScript 1.1 support. Currently, we do not plan
to support browser-specific JavaScript. Please let us know via the mailing list your priorities for missing features.
Inline and included scripts are supported, as are the following DOM elements:
<h2>Window</h2>
<h4>properties</h4>
<ul>
<li>closed - true if the window has been closed</li>
<li>document - the associated Document object</li>
<li>frames - an array of subframes of this window</li>
<li>location - r/w the associated Location object, which may be treated as a URL string</li>
<li>name - r/w the name of the window</li>
<li>navigator - the Navigator object</li>
<li>opener - r/o the window which opened this one (top-level frames only)</li>
<li>parent - the window which is a parent of this one.
<li>self - the Window itself</li>
<li>top - the top frame in the frameset containing this window
<li>window - a synonym for self</li>
<li><name> - the subframe of this window with the specified name
</ul>
<h4>events</h4>
<ul>
<li>onLoad - invoked when the page is loaded</li>
</ul>
<h4>methods</h4>
<ul>
<li>alert() - queues up an alert message, accessible via WebResponse.getNextAlert() or popNextAlert()</li>
<li>close() - closes the window</li>
<li>confirm() - invokes a callback supplied via WebClient.setDialogResponder to return the user's response. By default,
the callback returns true. Users may change this by supplying an implementation of DialogResponder.</li>
<li>prompt() - invokes a callback supplied via WebClient.setDialogResponder to return the user's response</li>
<li>open() - opens a new window. A callback will be generated to any WebWindowListener registered with the client.</li>
</ul>
<h2>Navigator</h2>
<h4>properties</h4>
<ul>
<li>appCodeName - the code name set in ClientProperties.setApplicationCodeName()</li>
<li>appName - the name of the browser, as set in ClientProperties.setApplicationName()</li>
<li>appVersion - the browser version, set in ClientProperties.setApplicationVersion()</li>
<li>plugins - an empty array of objects, since plugins are not universally supported</li>
<li>platform - the platform for the browser, set in ClientProperties.setPlatform (1.2 feature)</li>
<li>userAgent - the name of the user agent, set by ClientProperties.setUserAgent or derived from the code name and version</li>
</ul>
<h4>methods</h4>
<ul>
<li>javaEnabled - always returns false to indicate that applets are not supported</li>
</ul>
<h2>Screen (1.2 feature)</h2>
<h4>properties</h4>
<ul>
<li>availWidth - the available screen width, set in ClientProperties.setAvailableScreenWidth()</li>
<li>availHeight - the available screen height, set in ClientProperties.setAvailableScreenHeight()</li>
</ul>
<h4>methods</h4>
<ul>
<li>javaEnabled - always returns false to indicate that applets are not supported</li>
</ul>
<h2>Location</h2>
<h4>properties</h4>
<ul>
<li>href - r/w the current window location. Setting this value initiates a new request to the server</li>
<li>host - r/o the host and port portion of the current window location</li>
<li>hostname - r/o the host portion of the current window location</li>
<li>port - r/o the port portion of the current window location</li>
<li>protocol - r/o the port portion of the current window location</li>
<li>pathname - r/w the path portion of the current window location. Setting this value initiates a new request to the server</li>
<li>search - r/w the query portion of the current window location. Setting this value initiates a new request to the server</li>
</ul>
<h4>methods</h4>
<ul>
<li>replace - replaces the current window by doing a new request to the server</li>
</ul>
<h2>Document</h2>
<h4>properties</h4>
<ul>
<li>forms - an array of Form objects</li>
<li>images - an array of Image objects</li>
<li>links - an array of Link objects</li>
<li>title - readonly. The title of the page</li>
<li>location - a synonym for window.location</li>
<li>cookie - access to the document-specific cookies.</li>
<li><name> - the name of a form, image, or link</li>
</ul>
<h4>methods</h4>
<ul>
<li>open - opens a document for writing, optionally specifying a MIME type</li>
<li>close - closes the open document and replaces its contents with the written text</li>
<li>getElementById - returns the element in the document with the specified ID</li>
<li>getElementsByName - returns an array of all elements in the document with the specified name</li>
<li>getElementsByTagName - returns an array of all elements in the document with the specified tag name</li>
<li>write - writes a string to the contents of the current open document</li>
<li>writeln - writes a line with carriage-return to the contents of the current open document</li>
</ul>
<h2>HTMLElement</h2>
<h4>properties</h4>
<ul>
<li>title - r/o the title attribute of the element</li>
</ul>
<h2>Form (inherits from HTMLElement)</h2>
<h4>properties</h4>
<ul>
<li>action - r/w the action associated with the form</li>
<li>document - r/o the enclosing document</li>
<li>elements - r/o an array of controls in the form</li>
<li>action - r/w the target for any response from the form</li>
<li><name> - the name of a control in the form</li>
</ul>
<h4>events</h4>
<ul>
<li>onReset - invoked when form.reset() is invoked or a reset button is clicked</li>
<li>onSubmit - invoked when form.submit() is invoked or a submit button is clicked</li>
</ul>
<h4>methods</h4>
<ul>
<li>submit - submits the form</li>
<li>reset - resets the form controls to their default values</li>
<li>getElementsByTagName - returns an array of all elements in the form with the specified tag name</li>
</ul>
<h2>Image</h2>
<h4>properties</h4>
<ul>
<li>src - read/write - the relative URL of the image</li>
</ul>
<h2>Link (inherits from HTMLElement)</h2>
<h4>properties</h4>
<ul>
<li>href - read/write - the URL associated with the link</li>
</ul>
<h4>events</h4>
<ul>
<li>onClick - invoked when link.click() is invoked</li>
<li>onMouseOver - invoked when link.mouseOver() is invoked<li>
</ul>
<h2>Input (inherits from HTMLElement)</h2>
<h4>properties</h4>
<ul>
<li>form - read-only - the form containing the input</li>
<li>name - read-only - the name of the control</li>
</ul>
<h4>methods</h4>
<ul>
<li>focus() - a no-op</li>
</ul>
<h2>Button (inherits from Input)</h2>
<h4>events</h4>
<ul>
<li>onClick - invoked when button.click() is called</li>
</ul>
<h2>Text (inherits from Input)</h2>
<h4>properties</h4>
<ul>
<li>value - read/write - the current text value</li>
</ul>
<h4>events</h4>
<ul>
<li>onChange - invoked when the value of the control is changed via form.setParameter</li>
</ul>
<h2>TextArea (inherits from Input)</h2>
<h4>properties</h4>
<ul>
<li>value - read/write - the current text value</li>
</ul>
<h4>events</h4>
<ul>
<li>onChange - invoked when the value of the control is changed via form.setParameter</li>
</ul>
<h2>Hidden (inherits from Input)</h2>
<h4>properties</h4>
<ul>
<li>value - read/write - the current text value</li>
</ul>
<h2>Password (inherits from Input)</h2>
<h4>properties</h4>
<ul>
<li>value - read/write - the current text value</li>
</ul>
<h4>events</h4>
<ul>
<li>onChange - invoked when the value of the control is changed via form.setParameter</li>
</ul>
<h2>Checkbox (inherits from Input)</h2>
<h4>properties</h4>
<ul>
<li>checked - read/write - the state of the checkbox</li>
<li>defaultChecked - read-only - the default state of the checkbox</li>
<li>value - read/write - the value transmitted if the control is checked</li>
</ul>
<h4>events</h4>
<ul>
<li>onClick - invoked when the state of the control is changed via form.setParameter or form.removeParameter</li>
</ul>
<h2>Radio (inherits from Input)</h2>
<h4>properties</h4>
<ul>
<li>checked - read/write - the state of the radio button</li>
<li>defaultChecked - read-only - the default state of the radio button</li>
<li>value - read/write - the value transmitted if the control is checked</li>
</ul>
<h4>events</h4>
<ul>
<li>onClick - invoked when the state of the control is changed via form.setParameter</li>
</ul>
<h2>Select (inherits from Input)</h2>
<h4>properties</h4>
<ul>
<li>length - read-only - the number of options associated with the control</li>
<li>selectedIndex - read-write - the index of the selected option</li>
<li>options - read-write - an array of the options associated with the control</li>
<li>options.length - read-write - the number of options associated with the control</li>
<li>value - read-write - the value of the selected option</li>
</ul>
<h4>events</h4>
<ul>
<li>onChange - invoked when the value of the control is changed via form.setParameter</li>
</ul>
<h2>Option (inherits from Input)</h2>
<h4>constructor</h4>
You may construct an Option object and assign it to an element in the Select.options array
<h4>properties</h4>
<ul>
<li>text - read-write - the display text associated with the option (listed after the <'option> tag)</li>
<li>value - read-write - the value associated with the option (from the 'value' attribute)</li>
<li>selected - read-write - true if this option is currently selected</li>
<li>defaultSelected - read-only - true if this option is selected by default</li>
<li>index - read-only - the index of this option in its select</li>
</ul>
</body>
</html>
|