QA/TDAI/Gristmill/Mozmill Tutorial

This is a simple tutorial on how to create a Firefox UI automation script by hand using the Gristmill tool set. Since you're just working inside the UI, you need to [[1]] the Mozmill IDE extension (integrated development environment) to write and run the script we'll be creating.

Next, we should decide what to test. After looking over litmus briefly, testcase 5958 looks interesting. Here is the testcase:

1. Windows: Go to Tools | Options. (to exit Options, click the OK button)
   Mac: Go to FireFox | Preferences. (to exit Preferences, click the red (x) in the upper left.)
   Linux: Go to Edit | Preferences. (to exit Preferences, click the Close button)
2. In the Contents panel, uncheck Enable JavaScript, then exit the dialog.
3. Visit <a href="http://randomibis.com/coolclock/">Test Clock</a>.

Results -- There should be no clock displayed

I find it is easiest to do these tests walking backwards. So, that's how I'll present this.

Step 1

Fire up the Mozmill UI window from the Tools menu. And let's go visit the http://randomibis.com/coolclock site to take a look at it.

Once you have the clock site open, click on the "Explorers" menu of the Mozmill dialog. Highlight DOM Explorer and click "Start", now switch back to your browser window, and arrange the Mozmill IDE window and the browser window so that you can see both at the same time. Focus the browser window.

You'll notice that a list of text gets generated in Mozmill as you mouse over things. The tool is figuring out how to get to each element under your mouse pointer as you mouse around.

Mouse over the great big clock at the top of the page. The Mozmill window says: "ID: c5". Double click on the clock, and you'll be focused in the Mozmill window. Use the arrow keys and shift to copy the text from the window and paste it into some temporary document.

This ID is how we will find the big clock and ensure it doesn't exist.

Step 2

We are going to have to get into the preferences window and turn off the 'Enable Javascript' flag. So, let's open up the Preferences (Options on Windows) dialog.

We have to let the Mozmill Tool know that we've changed windows (it is still looking at the browser window). After you have the preference dialog open, click on the Explorers menu of Mozmill, Choose DOM Explorer->Stop. Then restart the explorer: Explorers->DOM Explorer->Start. It will automatically figure out that you are now working with the preference window (because it was the most recent window opened).

Click on the content tab. Hover the mouse over the "Enable Javascript" checkbox. You'll see "ID: enableJavaScript" in the Mozmill Window. Double click the checkbox to focus us back in the mozmill window and use the keyboard to copy that text into your temporary document.

Step 3

So far, we have figured out how to get to our javascript check box and our end result. Let's