# Creating and Running Your First Test

What You Will Learn

We'll learn how to create and run tests using Gondola Test Designer (GTD) and Gondola TestBuilder.

# Create A Gondola Project

Open Visual Studio Code:

  • Click on the Gondola icon to open Gondola Studio
  • Click Create New Project

Gondola Studio

  • Specify your project location
  • Select the [Gondola-WebDriver] Blank project template
  • Enter web101 for the project name and hit Enter
  • Gondola Studio will create a folder for the project

After creating the project folder, Gondola Studio automatically downloads the Gondola Framework and its dependencies. You will notice the status update in VS Code's status bar and the terminal.

# Execute The Sample Test

To ensure Gondola is properly configured for web testing, let's execute a sample test:

  • From the File Explorer, look for sample_test.ts in the folder src/tests/
  • Right click on sample_test.ts and select Open with Gondola Test Designer: right click sample test
  • The test looks like this: oopen sample test
  • Click the Run button to open the test execution dialog. The Run button run test button can be found in the top right corner
  • When the test execution dialog appears, click Run
    execute sample test
  • Gondola will execute the sample test in Chrome: navigate to google.com and check if the browser actually opens the expected web site. Once the test is finished, Gondola will automatically open the test results: sample test result The test report should automatically be displayed in your default browser. Test results are stored in the folder named results.

WARNING

On Linux, you may face the following error when running the Webdriver sample test templates or Webdriver tests in general.
Linux web error
Follow the instructions here to solve this issue.

# Creating Your First Test Module Using Test Recorder

We're going to record a test that we will playback later.

  • Right-click on the tests folder and select New Gondola Test. Gondola Test Designer will open with a new blank test.
  • Click the TestBuilder icon. Test Builder icon
  • Then click OK on the Create New Session dialog create new session dialog
  • Gondola automatically opens Chrome and navigates to the demo web app at https://demo.gondolatest.com. Gondola Test Recorder (located in bottom right corner) is now ready record a test: test recorder launch
  • Now click the ADD TO CART button on the first three items demo test add to cart
  • Click on the Shopping Cart icon to open the shopping cart page
  • On the shopping cart page, we want to verify whether the total payment was calculated correctly (which should be $239.97) first test case
  • To record a verification step, click the Add new step icon on the test recorder panel then click on the element where it says Total: $239.97add new step
  • The Add new step dialog appears, select check control exist, then click Add
  • Click the Close button on the test recorder panel, then confirm to go back to Gondola Studio
  • The recorded test should look like this: recorded test

TIP

  • The built-in action navigate opens the browser and navigates to the specified URL
  • The generated locators such as ${xpath:...} tell Gondola to identify the control using xpath
  • The built-in action check control exist checks whether specified element shows up on the screen

# Save and run the test

  • Click the save button in the top right hand corner save button
  • Name it demo_test and press Enter. Now a new file named demo_test.ts should appear in the src/tests folder
  • Let's also change the test module name from Untitled Test Module to Demo Test Module and the test case description from Untitled Test Case to Demo 1. Remember to click Save saved demo test
  • Execute test by clicking the Run button run test button then clicking Run in the Run Test Module dialog run demo test
  • The test should pass.

# Reuse Shared Steps By Using Gondola Action Modules

In Gondola, Action Module is a set of user-defined actions (or actions) that is grouped in a file. An action is a sequence of test steps that can be shared across your test project. An action is created by combining built-in actions and other user-defined actions. For the sake of learning, let's say we want to group the test steps in the test above into an action called 'check total payment'. Here's is how we can do it.

# Create A Reusable Action

  • Create a new folder named actions under src (right click on src folder and select New Folder)
  • Create a new action module by right clicking on actions folder and selecting New Gondola Action Module
    new action module
  • Enter the following details for the action check total payment: check total payment action Note: the name field should not have any spaces
  • Click Save and name the action module ShopActions save shop actions

# Parameterize The Action

  • Now, let's add an argument for this action. Type argument in the cell under method and select the argument action: expected payment argument
  • Enter expected as the name and string for the type: expected payment argument details
  • Go to back to the demo_test Gondoal Test Designer tab, select the following test lines and press Ctrl+X: cut demo test
  • Then go to the ShopActions tab, click on the cell below the argument expected and press Ctrl+V: paste shop actions
  • Go to the check control exist test line, replace the hardcoded value 239.97 with ${expected}. This basically takes the expected argument as input. The test line should now look like this: parameterized expected payment
  • Click Save to save the ShopActions module

# Use Action In Test Module

  • Go to demo_test, click on the cell below navigate, enter check total payment. The autocomplete dialog to appear as you type.
    action auto complete
  • Select check total payment and input 239.97 for the expected argument: new demo test
  • Execute the test again. The results should be passing.
Last Updated: 3/2/2021, 7:17:48 AM