002 Recording functional and regression tests in Selenium IDE

<slideshow style="nobleprog" headingmark="⌘" incmark="…" scaled="false" font="Trebuchet MS" >

Title

Selenium with javascript

Author

David Parkin

</slideshow>

What is Functional/Regression Testing?⌘

Regression testing is testing for known bugs on areas that have been updated or changed.

You can run the same tests on a piece of code every time you change something to check old functionality is still working.

Functional testing is testing your application does what its expected to do.

Installing the IDE?⌘

• Must use firefox.
• Go to selenium website and download IDE plugin.
• Restart browser.

⌘

What can you do?⌘

• Record a test
• Create a test suite
• Change speed of execution
• Run all or just 1 test
• Use find or select to create locators

Locators⌘

There are several types of locators we can use to find elements on a page.

The major types are css and xpath locators.

Try to locate elements on examples

Other locators⌘

• Id = “id”
• name = "name"
• Link
• DOM
• UI-elements
• Identifier = “id/name/..” find element with given text prioritizing in this order.

CSS Locators⌘

Css =css path

e.g. css = div > a#id

Try some examples

pseudo-classes	pseudo-elements
:nth-of-type	::first-line
:nth-last-of-type	::first-letter
:first-of-type	::selection
:last-of-type	::before
:only-of-type	::after
:visited
:hover
:active
:focus
:indeterminate

Xpath Locators⌘

Xpath is the xml path to a page item.

Xpath is quite slow and therefore inadvisable unless there’s no other way.

Its also not well supported on all browsers (i.e. ie).

Xpath=”path”.

e.g. xpath=\\p\div\a[@id=”id”].

More Locators⌘

• You want to choose locators that aren't going to change, id is best option if available.
• Use Firefox inspector to find paths to web elements.
• Use selenium selector to find web element paths.

Exercise1⌘

locate Logotype by id locate logotype by another way i.e text, css

Example1⌘

id=logotype

identifier=logotype

css=#logotype

css=div#heading1 h2

Exercise2⌘

locate Element1 by css

Example2⌘

css=h1 + p

css=div#hero>p

xpath=//p[starts-with(text(), 'Element 1')]

xpath=//h1/following-sibling::p

//*[contains(text(), 'Element 1')]

Exercise3⌘

locate element 4, 2 and 3

Example3⌘

css=#feature > .box:nth-child(3) > h3

css=#feature > .box:last-child > h3

xpath=//*[@id='feature']/*[3][@class='box']/h3

xpath=//*[@id='feature']/*[@class='box'][last()]/h3

xpath=//*[@id='feature']/*[@class='box']/following-sibling::*[2]

xpath=//*[3][@class='box']/h3

xpath=//*[@id='feature']//*[text()='Service 3']

Exercise4⌘

locate element 5

Example4⌘

css=#newsflash p

css=h2 + p

//*[contains(text(), 'Element 5')]

//div[@id="newsflash"]/p

Exercise5⌘

locate element 6, 7 and 8

Example5⌘

css=#newsflash .note:nth-of-type(2)

css=#newsflash h3:nth-of-type(2) + div

xpath=//*[@id='newsflash']/div[2][@class='note']

xpath=//*[@id='newsflash']/h3[2]/following-sibling::div

xpath=//*[@class='note'][contains(text(), 'Element 7')]

Exercise6⌘

locate Footnote2

Example6⌘

css=#footer > div:nth-child(2)

css=#footer > div + div

div:nth-child(2)

xpath=//*[@id='footer']/div[@class='grid-3 text-right']

xpath=//*[@id='footer']/div[2]

xpath=//*[@id='footer']/*[2]

xpath=//*[@id='footer']/div/following-sibling::div

Exercise7⌘

locate Menu item 1

Example7⌘

css=#navigation > ul > li >a

css=#navigation a

xpath=//*[@id="navigation"]//a

Exercise8⌘

locate Menu item 2, 3 and 4

Example8⌘

css=#navigation > ul > li:nth-of-type(3) > a

css=#navigation > ul > li:nth-child(3) > a

css=#navigation li:nth-child(3) > a

xpath=//*[@id='navigation']/ul/li[3]/a

xpath=//*[@id='navigation']/*/li[3]/a

xpath=//*[@id='navigation']//li[3]/a

Exercise9⌘

click on a menu item

Example9⌘

command = clickandwait

target = css=#navigation a

Exercise10⌘

click on menu item and then click on Frst Page

Example10⌘

command = clickandwait

target = css=#navigation a

command = clickandwait

target = css=#main-menu>ul>li:nth-child(6)>a

command = clickandwait

Exercise11⌘

assert error message

Example11⌘

command = assertElementNotPresent

target = link=Menu item 1

Exporting⌘

Selenium doesn’t support exporting to javascript, however the syntax is similar to other languages.

You can either write your own scripts, or export to another language (e.g. Java), and manually convert to Javascript.

Here is simple exmaple.

Exporting to Java.

To export go to file > export test case as > java webdriver

Similarly you can export to c#, they look very similar.

Code

Answer >>

package com.example.tests;

import java.util.regex.Pattern;
import java.util.concurrent.TimeUnit;
import org.junit.*;
import static org.junit.Assert.*;
import static org.hamcrest.CoreMatchers.*;
import org.openqa.selenium.*;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.support.ui.Select;

public class Javaexport {
  private WebDriver driver;
  private String baseUrl;
  private boolean acceptNextAlert = true;
  private StringBuffer verificationErrors = new StringBuffer();

  @Before
  public void setUp() throws Exception {
    driver = new FirefoxDriver();
    baseUrl = "https://www.google.co.uk/";
    driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
  }

  @Test
  public void testJavaexport() throws Exception {
    driver.get(baseUrl + "/?gws_rd=ssl");
    driver.findElement(By.id("gbqfq")).clear();
    driver.findElement(By.id("gbqfq")).sendKeys("webdriver");
    driver.findElement(By.id("gbqfb")).click();
    // ERROR: Caught exception [unknown command [w]]
    driver.findElement(By.xpath("//a[contains(text(), \"Selenium\")]")).click();
    driver.findElement(By.cssSelector("#menu_projects>a")).click();
  }

  @After
  public void tearDown() throws Exception {
    driver.quit();
    String verificationErrorString = verificationErrors.toString();
    if (!"".equals(verificationErrorString)) {
      fail(verificationErrorString);
    }
  }

  private boolean isElementPresent(By by) {
    try {
      driver.findElement(by);
      return true;
    } catch (NoSuchElementException e) {
      return false;
    }
  }

  private boolean isAlertPresent() {
    try {
      driver.switchTo().alert();
      return true;
    } catch (NoAlertPresentException e) {
      return false;
    }
  }

  private String closeAlertAndGetItsText() {
    try {
      Alert alert = driver.switchTo().alert();
      String alertText = alert.getText();
      if (acceptNextAlert) {
        alert.accept();
      } else {
        alert.dismiss();
      }
      return alertText;
    } finally {
      acceptNextAlert = true;
    }
  }
}

The contents of testJavaexport is the main part of the test, and the code is nearly idential to the Javascript needed.

using a basic setup we can simply copy this code and create a working test quickly.

Notice we have to add webdriver infront of By, and CssSelector becomes css.

var webdriver = require('selenium-webdriver');
 driver = new webdriver.Builder().
    usingServer("http://127.0.0.1:4444/wd/hub").withCapabilities(webdriver.Capabilities.chrome()).build();
    baseUrl = "https://www.google.co.uk/";
    driver.manage().timeouts().implicitlyWait(5000);
 
driver.get(baseUrl + "/?gws_rd=ssl");
    driver.findElement(webdriver.By.id("gbqfq")).clear();
    driver.findElement(webdriver.By.id("gbqfq")).sendKeys("webdriver");
    driver.findElement(webdriver.By.id("gbqfb")).click();
    // ERROR: Caught exception [unknown command [w]]
    driver.findElement(webdriver.By.xpath("//a[contains(text(), \"Selenium\")]")).click();
    driver.findElement(webdriver.By.css("#menu_projects>a")).click();
driver.quit();