Selenium Tutorial Day 22 Quick Tour of Selenium IDE Advanced Features

Portnov Computer School presents:
Selenium
Web Test Tool Training
Discover the automating power of Selenium
Presented by:
Kangeyan Passoubady (Kangs)
Copy Right: 2008, All rights reserved by Kangeyan Passoubady (Kangs). Republishing requires authors permission
Day 2
Quick Tour of Selenium IDE
Advanced Features

Copyright 2008-2010 by Kangeyan Passoubady (Kangs)
Options Menu Adding a New Format #1

Go to ToolsSelenium IDE Options Format Tab
Press the add button
Click the add button to

add a new format

Provide the name of format as CSV Format

Download the seleniumIDE_CSV.js (CSV Format) from
Selenium/Day2/Excercises Section URL
Open seleniumIDE_CSV.js file in notepad, (From the folder where you
have stored, right click on the file name and select Edit Option),
Name: CSV Format
Select Edit in Notepad


Press Ctrl+A to select all the Text from the notepad, and Press
Ctrl+C to copy the contents
Paste the JavaScript contents in Selenium IDE Format Source
window
Press the OK button
Under the Separator Option, select Comma and Press Ok
button
CSV Format Source
Code
Select comma from

the separator options

Click here Ok

Now we have created two new formats:
1. Comma Separated Values (CSV)
2. Tab Delimited Values (TDV)
Well get into action to test the new formats
Open any of the existing test cases you have stored by going to
File Open GE Test Case1.html
Select the Source Tab, what do you see, it is in html format
HTML Format

Go to Format Select CSV Format from the available options

Now look at the source Tab, it is converted into Comma Separated Value
format.
Save by going File Save Test Case As option, GE Test Case1.csv
Source is in comma
Separated values Format
GE Test Case1.csv
Select CSV Format


Open the GE Test Case1.csv
in Excel Application
With little formatting, you can
look at your test cases in a
nice formatted way in Excel
Sheet.
You can able to send your
test cases to the Business
Users easily through excel
sheet.
If you are interested we can
look at the JavaScript code
which does this conversion.
GE Test Case1.csv in
Microsoft Excel
Application

var SEPARATORS = {
comma: ",",
tab: "\t"
};
options = {separator: 'comma'};
configForm =
'<description>Separator</description>' +
'<menulist id="options_separator">' +
'<menupopup>' +
'<menuitem label="Comma" value="comma"/
>' +
'<menuitem label="Tab" value="tab"/>' +
'</menupopup>' +
'</menulist>';
Two separators type

CSV, TDV
The customizable option
that can be used in
format/parse functions.
Comma is the default
value

XUL XML String for

the UI of the options
dialog

function format(testCase, name) {
return formatCommands(testCase.commands);
}
function formatCommands(commands) {
var result = '';
var sep = SEPARATORS[options['separator']];
for (var i = 0; i < commands.length; i++) {
var command = commands[i];
if (command.type == 'command') {
result += command.command + sep +
command.target + sep + command.value +
"\n"; }
}
return result;
}
Format Test Case

and return the source
Argument 1: testCase
Test Case to format
Argument 2: name
Name of the test case. It
may be used to embed
title into the source
Format an array of
commands to the
snippet of source.
Used to copy the source
into the clipboard.

10

function parse(testCase, source) {
Parse source file and
update TestCase.
var doc = source; var commands = [];
Throw an exception if
any error occurs
while (doc.length > 0) {
var line = /(.*)(\r\n|[\r\n])?/.exec(doc);
var array = line[1].split(sep);
Test Case to update
if (array.length >= 3) {
Argument 2: source
var command = new Command();
Source to parse
command.command = array[0];
command.target = array[1];
Source Line is parsed and
in the IDE it is passed as
command.value = array[2];
Command, Target and
commands.push(command);
Value
}
doc = doc.substr(line[0].length); }
testCase.setCommands(commands);}
11
Options Menu Adding a STIQ Format #1

StoryTestIQ (STIQ) is a test framework used to
create Automated Acceptance Tests or Story
Tests
STIQ uses selenium which has the following
syntax for test cases
|command|value|target|
It starts with a pipe symbol ends with a pipe
symbol
Command and Value separated by a Pipe symbol
Value and Target separated by a Pipe symbol
12
Create one more format as shown below:
~~Command~~Value~~Target~~
Double Tilde is the separation Character
Modify the javascript seleniumIDE_CSV.js,
to handle two new formats:
1. STIQ Pipe Format
2. Double Tilde Format
13

var SEPARATORS = {
comma: ",", Pipe: "|",
tab: "\t", Tilde: '~~'
};
options = {separator: 'Pipe'};
configForm =
'<description>Separator</description>' +
'<menulist id="options_separator">' +
'<menupopup>' +
'<menuitem value="Comma" label="Comma
Separated"/>' +
'<menuitem value="Tilde" label="Double
Tilde"/>' +
'<menuitem value="Pipe" label="Pipe STIQ
Format"/>' +
'<menuitem value="Tab" label="Tab
Delimited"/>' +
'</menupopup>' +'</menulist>';
Two more separator

types added
Pipe, Tilde
The default option Pipe
XUL XML String for the
UI of the options dialog
Where Tilde and Pipe are
added now

14

function format(testCase, name) {
return formatCommands(testCase.commands);
}
Format Test Case and

return the source
No coding change
required in this function
function formatCommands(commands) {
var result = ''; var sep = SEPARATORS[options['separator']];
for (var i = 0; i < commands.length; i++) {
var command = commands[i];
if (command.type == 'command') {
switch (sep) {
case '|':
result += sep+command.command + sep + command.target + sep +
command.value + sep+ "\r\n"; break;
case '~~':
result += sep+command.command + sep + command.target + sep +
command.value + sep+ "\r\n"; break;
default:
result += command.command + sep + command.target + sep + command.value +
"\r\n";
}
Now we have added a switch
} }
statement which handles | and
return result;}
~~ delimiters.
15

function parse(testCase, source) {
Parse source file and
update TestCase.
var doc = source; var commands = [];
Throw an exception if
any error occurs
//alert("sep"+sep)
while (doc.length > 0) {
var line = /(.*)(\r\n|[\r\n])?/.exec(doc);
Test Case to update
var array = line[1].split(sep);
Argument 2: source
if (array.length >= 3) {
Source to parse
var command = new Command();
switch (sep) {
See the changes in the
array how it retrieves the
case '|':
values to command, target,
value, the positions are
changed now.
break;
16

case '~~':
break;
default:
}
commands.push(command);
}
doc = doc.substr(line[0].length);
}
testCase.setCommands(commands);}
This one handles the

~~ (Double Tilde)
separator
The CSV, TDV are

handled as a default
case

17

1. Now well put all the functions together in a file
2. Name the file as : selenium_IDE_STIQ_Pipe_v1.js
3. For your convenience I have placed this file in the
http://www.portnov.com/Selenium/
4. Download the file and save into your folder.
5. Go to Selenium IDE Options Menu Format Tab
6. Press Add button
7. Open your selenium_IDE_STIQ_Pipe_v1.js in notepad (right click on the
explorer where you have placed the file, and select Edit Option).
8. In notepad, press Ctrl+A (or Edit Select All) to select all the contents of
the file, press Ctrl+C (Edit Copy) to copy and paste in the Selenium
IDE format source window.
9. Provide the Name of the format: STIQ
10. Press Ok button to close the window
11. Press Ok button to close the Selenium IDE Options
12. Now well do a simple test in Google Maps to test the STIQ format.
18

1.
2.
3.
4.
5.
Go to the below URL:http://maps.google.com/maps

Type or Cut and Paste the below Address:
1580 West El Camino Real, Mountain View, CA 94040
Verify the Text Present Portnov Computer School
Verify the Title 1580 West El Camino Real, Mountain View, CA 94040 Google Maps
6. Click on the Portnov Computer School link
7. VerifyText Present Ste 12 on the right side inline popup window.
8. AssertText Portnov Computer School present within the inline popup
window.
9. Stop the Recoding in Selenium IDE
10. Make sure Selenium IDE Options Menu Format STIQ
11. Save the test case, File Save Test Case Google Maps Test
Case1.pipe.txt
12. Click and open the file in Notepad
19

Selenium IDE File Open (or Ctrl+O)
Select the file Google Maps Test Case1.pipe.txt from the path where you
have saved.
It should show the source as shown below.
See the source it
should be |
formatted

See the test case, it

should be formatted
like this
20

Your test case should look like this (or similar to something like this),
so that it works without any problem.
To make sure the test
passes, I have added
couple of WaitFor
commands
Change your script to

match something
similar to this and rerun the test

21
Exercise
#5
How do you find Page Load Time of a

webpage using Selenium IDE?
Find Page Load Time of a webpage
using windows onload event in Selenium
IDE (Hint: Use JavaScript)?

22
Exercise
#6
How do you convert your HTML Selenese

test cases to XML compliant format?
(Hint: Your XML test cases should be
read and processed by any XML parser)

23

Selenium Tutorial Day 22 Quick Tour of Selenium IDE Advanced Features

Caricato da

Informazioni sul documento

Titolo originale

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Selenium Tutorial Day 22 Quick Tour of Selenium IDE Advanced Features

Caricato da

Copyright:

Formati disponibili

Portnov Computer School presents:

Kangeyan Passoubady (Kangs)

Discover the automating power of Selenium

Options Menu Adding a New Format #1

Click the add button to

Discover the automating power of Selenium

Options Menu Adding a New Format #2

Provide the name of format as CSV Format

Name: CSV Format

Select Edit in Notepad

Discover the automating power of Selenium

Options Menu Adding a New Format #3

Select comma from

Discover the automating power of Selenium

Options Menu Adding a New Format #4

Discover the automating power of Selenium

Options Menu Adding a New Format #5

Go to Format Select CSV Format from the available options

Discover the automating power of Selenium

Options Menu Adding a New Format #6

Options Menu Adding a New Format #7

Two separators type

Discover the automating power of Selenium

XUL XML String for

Options Menu Adding a New Format #8

Format Test Case

Discover the automating power of Selenium

Options Menu Adding a New Format #9

Options Menu Adding a STIQ Format #1

Options Menu Adding a STIQ Format #1

Create one more format as shown below:

Options Menu Adding a STIQ Format #2

Two more separator

Discover the automating power of Selenium

Options Menu Adding a STIQ Format #3

Format Test Case and

Options Menu Adding a STIQ Format #4

Options Menu Adding a STIQ Format #5

This one handles the

The CSV, TDV are

Discover the automating power of Selenium

Options Menu Adding a STIQ Format #6

Options Menu Adding a STIQ Format #7

Go to the below URL:http://maps.google.com/maps

Options Menu Adding a STIQ Format #8

Discover the automating power of Selenium

See the test case, it

Options Menu Adding a STIQ Format #9

Change your script to

Discover the automating power of Selenium

How do you find Page Load Time of a

Discover the automating power of Selenium

How do you convert your HTML Selenese

Discover the automating power of Selenium

Potrebbero piacerti anche