04: User Sign in OK Test

First Test Project; First Test Script (User Login).

The Book: Web Test Automation in Action: Volume 1 was published on 2024-12-21, catering to readers who prefer learning through books.

In #03, we tried a couple of Selenium test steps; It is time to create a proper test script.

Learning Objectives

• Create a test project in TestWise

• Create a test case

• Validate

Test Case #04

This is a very simple test case. As a matter of fact, testing user login is usually the first testing task for an app.

While I believe everyone understands the steps, I will still ask you to perform the manual testing (exact steps) first.

“Before starting scripting an automated test, always perform manual testing first. Many beginners forget about this, too eager to jump directly into scripting.” — Zhimin Zhan

Tasks

Create a test project in TestWise (introduced in session #1), then script the test steps one by one in TestWise debugging mode (introduced in session #3). After all the steps pass, move all of them into the test script file.

Task 1. Create a new TestWise Project

A project in coding/scripting, to put it simply, is a folder containing all related files for one purpose.

Launch TestWise and start a new one (File > New Project). If a project is already opened, close it (File > Close Project).

Fill in the pop-up window with appropriate details.

1. The Project Name
   Can be any text for identification purposes.

2. The Project Location
   A project folder where the test scripts and related files are stored. I suggest you create an empty folder and type (or paste) its full path there, e.g.
   - Windows: c:\users\me\demo\my-first-test-project
   - macOS: /Users/me/demo/my-first-test-project
   Tip: don’t include space or special characters in the folder path.

3. The target server URL
   from our test task card, http://travel.agileway.net

Click the “OK” button to create the project. Below is the screencast (29" to 43").

TestWise will open this newly-created project with a set of files.

Task 2. Create Login Test

Click new_spec.rb to open it and run the test case as below.

Right-click a line under `it …. do” and select “Run ….” (the first item)

A Chrome browser window will launch and open our target website. (if you don’t get this, then your test execution environment is not correct, see this article or FAQ)

Highlight one commented line (e.g. 18), and select Run Selected Scripts Against Current Browser (the third option) to enter TestWise Debugging mode.

Task 3. Scripting test steps

Check out the test task card. There are four action steps:

1. Open the server URL (done)

2. Enter username “agileway”

3. Enter password “testwise”

4. Click the button “Sign In”

Let’s do steps 2 — 4 one by one.

Step 2. Enter the user name “agileway”

Right-click the user name text box (in the existing Chrome browser), and select “Inspect”.

Make the browser bigger enough to see both the page and its source (on the right).

The HTML for the user name text box:

<input type="text" name="username" id="username" size="25">

We can use its ID to locate it. Type the below in debugging_spec.rb and run the test (by clicking the blue play button on the toolbar).

driver.find_element(:id, "username").send_keys("agileway")

It worked.

Step 3. Enter the password “testwise”

Comment out (type #in the front) the above test step in debugging_spec.rb and continue to work out the next step in the same manner.

The HTML for this password text box:

<input id="password" name="password" type="password" size="25">

We can use its ID like the previous step. I recommend trying the NAME locator. The test step will be:

driver.find_element(:name, "password").send_keys("testwise")

Run the step in debugging mode.

Step 4. Click the “Sign in” button

Repeat the same process as you have done before:

• Comment out the previous test steps.

• Inspect the new control (in this case, a button)

• Find out its HTML

<input id="password" name="password" type="password" size="25">

• Write the test statement

driver.find_element(:name, "commit").click

• Run it in the debugging mode

Task 4. Copy the working test steps over to the test script file

So far we have tried out the test steps in debugging_spec.rb (TestWise debugging mode). Now we know these three test steps are working. Copy them over to the test script file new_spec.rb . Remove all leading # characters (comments).

Run the test case (please note, this is not in debugging mode)

You will see a new Chrome browser launch and run those test steps to log in to the site successfully.

Task 5. Add an assertion

A test is incomplete without assertions (a.k.a checks). For this simple login test, how do you verify a successful login? Some might say “It is obvious”. However, in automated test scripts, assertions have to be specific. For example, the “Signed in!” text is found on the page.

The assertion step will be:

expect(page_text).to include("Signed in!")

Task 6. Change the test case name and test script file

So far, the test script steps have been saved in new_spec.rb , the sample file created by TestWise.

1. Change test case name
   Change it "Test Case Name" do to it "User can sign in OK" .

2. Change the test script file.
   Click the X shape icon next to the file name (as indicated below) to close the new_spec.rb .

Right-click the file new_spec.rb in the “Project Explorer”, and select “Rename”.

Type a new name, such as login_spec.rb .

Run the test case in long_spec.rb to make sure it is still running fine.

Full Test Script

load File.dirname(__FILE__) + "/../test_helper.rb"
describe "Test Suite" do
  include TestHelper  before(:all) do
    # browser_type, site_url defined in test_helper.rb
    @driver = Selenium::WebDriver.for(browser_type, browser_options)
    driver.manage().window().resize_to(1280, 800)
    driver.get(site_url)
  end

  after(:all) do
    driver.quit unless debugging?
  end

  it "User can sign in OK" do
    driver.find_element(:id, "username").send_keys("agileway")
    driver.find_element(:name, "password").send_keys("testwise")
    driver.find_element(:name, "commit").click
    expect(page_text).to include("Signed in!")
  end
end

Common Issues

• Typing errors
  It is fairly common for beginners to type the scripts wrongly which will cause the test steps and test cases to be unable to run. In the next scripting session, I will show you a way to detect syntax errors quickly.

• Unable to remember selenium syntax
  I will show you a much quicker and more fun way to enter Selenium statements in the next scripting session. You don’t have to remember it. In the meantime, just type it in based on the article.

FAQ

1. I am totally new to test automation, there are parts I don’t quite follow.
   

   This might be your first automated test script, don’t be too hard on yourself. During a coaching session, I can help resolve issues very quickly. I can totally understand a beginner’s frustration with a simple thing, such as a typo.

   
   I suggest you watch the screencast (youtube video) and follow it step by step. If you still have specific questions, please feel leave a message here. I will help as I can. My point here is that you are about to enter the wonderful test automation world, it would be a huge pity for something I didn’t explain well in words.

   
   If you want to try a one-on-one coaching session with me, check out 30-minutes Test Automation Coaching for $1.
   

2. There are some test statements (generated by TestWise), such as Selenium::WebDriver.for(browser_type, browser_options). Can you explain them?

   
   Do not worry about that yet, just focus on the goals of the current session. Rest assured that all test scripts are in plain text format, and there is no dependency on any vendor or tool.

   
   Please note that this workbook is designed for absolute beginners. I designed these sessions purposely. I will explain those statements when the time is right.