Set up, Develop Automated UI tests and Run them in a CT server on your First day at work

Step by step guide to set up developing Selenium WebDriver tests and run all tests in a Continuous Testing Server, quickly!

A repost of my past article on Medium (2022)

If you start a new job in automated testing, you probably want to show your team an example of running a real automated test as quick as possible. I mean, in a matter of hours.

Table of Contents:
· All-in-one Functional Testing Tool: TestWise
  ∘ Verify Chrome Browser and Browser Driver
  ∘ Run first Selenium test
  ∘ First test project
· Run tests from the command line
  ∘ Installation
  ∘ Run RSpec Tests from the Command Line
· A Note on Text Editors
  ∘ Visual Studio Code (VS Code)
· Use TestWise Standard Edition
  ∘ Installation 
  ∘ Verify Installation
· TestWise Features
  ∘ Simple and Easy
  ∘ Code Library & Snippets
  ∘ Keep the browser open on executing a single test case
  ∘ Running selected test steps against the current browser.
· Develop and run Selenium/Appium tests in other languages 
  ∘ Mocha (Node.js)
  ∘ Note one Mocha (Node.js)
  ∘ PyTest (Python)
  ∘ Note on PyTest
  ∘ Cucumber
  ∘ Note on Cucumber
  ∘ TestWise can run all these frameworks in one test project.
  ∘ Recommendation
· Run all tests in a Continuous Testing Server
  ∘ What is unique about CT servers?
· Installing BuildWise Server
  ∘ BuildWise — How does it work?
  ∘ Setup a Sample Project in BuildWise

All-in-one Functional Testing Tool: TestWise

TestWise is a functional testing IDE that supports free, open-source test automation frameworks such as Selenium WebDriver, the most popular one that conforms to the W3C WebDriver standard. TestWise is the only software you will need to create and run tests for now.

Download the Ruby Edition of TestWise if you are on Windows. macOS and Linux users should install Ruby first, then TestWise Standard Edition (I will cover the use of Standard Edition later).

TestWise Ruby Edition =

TestWise Standard Edition + Ruby + Testing Libraries + ChromeDriver

Launch TestWise. You will see the following popup window for 10 seconds. Click the “Continue” button. You may use TestWise in this free (and full-featured) mode forever, after 15 test executions, simplely restart TestWise, which takes only a few seconds.

You don’t need to purchase a license. You may use TestWise in free mode forever.

Verify Chrome Browser and Browser Driver

From Selenium WebDriver 4.11, the browser driver is auto-managed, you can skip this section. See this document. For example, the chromedriver is saved under /Users/ME/.cache/selenium/chromedriver/mac-x64/117.0.5938.149 on my MacBook.

Next, we want to verify the ChromeDriver on your machine. Without it, you cannot drive the browser (for web testing).

TestWise Ruby Edition includes a version of ChromeDriver, in C:\agileway\TestWise7\interpreters\ruby\bin . Make sure it matches the version of your Chrome.

To check your browser’s version you can go Help > About Google Chrome

If the versions are not matching, download the correct version of ChromeDriver, and save it into C:\agileway\TestWise7\interpreters\ruby\bin.

Run first Selenium test

TestWise has a sample project that we can use to run our first test.

On the start screen, select Open Sample Project (web app).

You will see some folders (on the left), which contain the same set of tests for different languages. Ignore that for now.

Expand the spec folder, click the test script file 01_login_spec.rb . The test script content will be opened.

Right-click a line under the test case name (it “…” ) and select “Run …” to run the test case, or use the blue triangle button on the toolbar. (open this animated GIF to see it in action).

Here we can see that it successfully opens Chrome and drives the browser. Great! This means we can begin writing our own tests.

First test project

Close the sample project (File > Close Project) and create a new one (File > New Project).

Fill in the pop-up with appropriate details for your project. I will do an example on courtneyzhan.com.

When you create a new project, a project skeleton will be created. Write your first test in new_spec.rb (feel free to rename this file later). And you can start writing your tests here!

Here is one simple test to verify that the navigation scroller scrolls correctly to the Contact section.

  it "Scroll to Contacts" do
    elem = driver.find_element(:xpath, "//ul[@id='js-scroll-nav']//li//a[text()='Contact']")
    elem.click    expect(page_text).to include("CONTACT ME")
    sleep 0.5 # wait for JS scroll
    
    contact_elems = driver.find_elements(:xpath, "//address/div")
    expect(contact_elems[3].text).to include("MEDIUM")
    
    driver.find_element(:partial_link_text, "MEDIUM").click
    current_url = driver.current_url
    expect(current_url).to eq("https://courtneyzhan.com")
  end

Run your test. You shall see test execution in a new Chrome browser, like the animated gif above. Congrats! You’ve written a test on your first day already!

Of course, it doesn’t stop here. Edit it, refactor (learn later) it and write some more.

Run tests from the command line

The above test scripts are in raw Selenium WebDriver (with Ruby binding); this means we can use any text editors (such as Notepad or Visual Studio Code) and run tests from the command line.

Ideally, we don’t want to couple our work too tightly to a specific tool. Executing tests from the command line can help remove that dependency. This is also necessary for Continuous Testing setup further down the track.

Now we have installed TestWise Ruby Edition, which does most of the heavy lifting for us. This is equivalent to installing:

TestWise Standard Edition + Ruby + Testing Libraries + ChromeDriver

Now I will show how to write and run tests without TestWise (I highly recommend TestWise, which I use every working day). This article aims to show total freedom with the test scripts, 100% raw Selenium WebDriver, created by TestWise.). Instead, we’ll manually install Ruby, ChromeDriver & Testing Libraries independently.

Installation

We will need to install Ruby, ChromeDriver & Testing Libraries to get started.

• Ruby
  RubyInstaller for Windows with Devkit, such as ‘Ruby+Devkit 3.2.6–1 (x64)’, and run the installer. For macOS or Linux, use the usual package installer.

• Testing Libraries (called gems in Ruby)
  Install selenium-webdriver , rspec , …, etc with the command like below:
  gem install selenium-webdriver

See this article below for detailed instructions on how to do this and execute RSpec tests on the command line.

10-Minute Guide to Set up Test Automation using Selenium WebDriver with Ruby

Run RSpec Tests from the Command Line

Now run a sample RSpec test (tests can be cloned here).

> cd C:\demo\agiletravel-ui-tests\selenium-webdriver-rspec
> rspec spec\login_spec.rb

You will see the test execution in a Chrome browser. The output in the command window will look similar to the following:

A Note on Text Editors

Selenium WebDriver test scripts are in plan-text. You may write your tests in a programming editor of your choice before running them. Some programming editors can provide extra functions that can make your life easier. A popular choice is Visual Studio Code (download link).

Visual Studio Code (VS Code)