Quick start Html

Here is an simple example on how to write a web test case. It will test, that if you enter "Yawet" in the Google search, the InforMatrix homepage will be found by Google. The example can be downloaded from http://www.informatrix.ch/yawet/examples/google.ywt

  1. See Installation if you don't know how to start Yawet.
  2. Set up a new Project:
    1. In the menu select [File]->[New Web Project].
    2. Enter the server base url (ex. http://www.google.ch/).
    3. If you need a proxy to access the internet, click on the [Browser] tab and configure the proxy host and port
    4. Optionally go to the [System] tab, configure your web browser and select "use request url".

    New Project in Yawet


  3. Create a Html test page:
    1. In the tree view, click with the right mouse button on the project. Select [Add child]->[Html Doc]
    2. Enter the main page url (ex. index.html).
    3. Click [Run]. The page is loaded and the page icon turns (hopefully) green. If not, check the [Log] tab

    New Html test page


  4. Create an input field test node:
    1. Select the [Dom] tab. Enter "input" in the search combo box field. Click [Search]
    2. Click [Search] again to cycle through the available input fields on the page. After two clicks you should be on the search input field.
    3. Click with the right mouse button on the found input field and select [Add Element]
    4. In the tree view, click with the left mouse button on the newly created Html Tag icon. On the right view the properties of the Html Tag test node are shown
    5. Click on the [Attributes] tab. Verify that the name attribute is set to "equals" "q"
    6. Click on the [Action] tab. Select "set text" from the combo box. Enter "Yawet" in the appearing text field.
    7. Click [Run]. The Html Tag icon should now turn green and internaly the input field now has the value "Yawet".

    New Html Tag

    Set Html Tag action


  5. Create a submit button test node:
    1. In the tree view, click again on the page icon (named "Html Doc") and select the [Dom] tab
    2. Enter "submit" in the search combo box field. Click [Search].
    3. Click with the right mouse button on the found submit button and select [Add Element]
    4. In the tree view, click with the left mouse button on the newly created Html Tag icon.
    5. Click on the [Action] tab. Select "click" from the combo box.
    6. Click [Run]. The element icon should now turn green.

    New Html Tag


  6. Verify the result page:
    1. In the tree view, click with the right mouse button on the existing Html Doc icon and select [Add next]->[Html Doc].
    2. Click [Run] to load the result page into Yawet.
    3. In the tree view, click with the right mouse button on the new page icon and select [Add child]->[Html Tag]
    4. Select the [Html Tag] tab. In the Type combo box select "A". We are looking for an anchor element. Click the [Ok] button.
    5. In the Position combo box select "first". There might be more than one link to our company.
    6. Select the [Attributes] tab. Click the [Add] button.
    7. In the new row click in the attribute field. Select "href" from the combo box.
    8. Select "contains" from the relation field.
    9. Enter "www.informatrix.ch" in the value field.

    New Html Doc and Tag


  7. Save and run the test:
    1. In the menu select [File]->[Save]. Enter a file name (ex. googletest) and save the test.
    2. Press [F3] to run the whole test.
    3. In the tree view, now all icons should hopfully turn gree.
    4. If not, click on the lowest red element, and check the error message in the Log tab.
    5. If yes, start testing your real web applications. ;-)