View source for 002 Recording functional and regression tests in Selenium IDE

[[Category:Selenium for victims of manual testing|020]]
[[Category:Private]]
<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.

:[[File:ClipCapIt-140724-143752.PNG|600px]]

==⌘==
:[[File:ClipCapIt-140724-143809.PNG]]

==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
<!-- placeholder -->
<table cellpadding="4px" style="border: none;"><tr><th style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top">pseudo-classes</th><th style="border-bottom: 1px solid #527bbd; " align="left" valign="top">pseudo-elements</th></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:nth-of-type</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">::first-line</code></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:nth-last-of-type</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">::first-letter</code></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:first-of-type</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">::selection</code></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:last-of-type</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">::before</code></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:only-of-type</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">::after</code></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:visited</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:hover</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:active</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p></p></td></tr><tr><td style="border-right: 1px solid #527bbd; border-bottom: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:focus</code></p></td><td style="border-bottom: 1px solid #527bbd; " align="left" valign="top"><p></p></td></tr><tr><td style="border-right: 1px solid #527bbd; " align="left" valign="top"><p><code class="literal">:indeterminate</code></p></td><td style="" align="left" valign="top"><p></p></td></tr></table>

==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 ==
{{Show Answer|
<source lang="Java">
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;
    }
  }
}

</source>
}}
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.

<source lang="javascript">
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();
</source>