Automate Online Demo Form with Selenium WebDriver and C#

In this article, we will automate an online form with Selenium WebDriver and C#..

An online demo form is available on this site: http://toolsqa.com/automation-practice-form/

Online Automation Form

As you can see, the form comprises of following:

  • text boxes for entering first name and last name
  • radio button for selecting gender (male or female)
  • radio button for selecting years of experience
  • text box for entering date
  • checkbox for selecting profession: manual tester or automation tester
  • open file dialog to select a profile picture
  • checkbox to select automation tool: QTP, Selenium IDE, Selenium WebDriver
  • combobox (drop down menu) to select continent
  • listbox to select Selenium command
  • Button to click Submit

The above UI is a good example of the elements you will traditionally find in an online form.

Note that all elements in this online form, unlike Google search page (please refer to blog article https://betestexpert.wordpress.com/2018/08/19/automate-simple-google-search-with-selenium-webdriver-and-c/), can be uniquely identified by “Id” or “Class”. So automating this form is much easier than automating Google search.

Few pointers:

  • Since the form is long, you need to scroll the page to elements before automating the action
  • When a user is manually testing the form, he/she will be scrolling before completing action on an element. The automation script should mimic that behaviour.

If the element can be identified, scrolling part is easy. Use the below code snippet to scroll to a specific element on the page. As highlighted by the code below, you first identify the element, then scroll to that element and then perform the required action.

scrolling

The full C# code is shown below.

Online form code snippet 11

Online form code snippet 2

Online form code snippet 3

Please refer to the below url for an understanding of how to setup Visual Studio for Selenium Automation with C#.

https://www.guru99.com/selenium-csharp-tutorial.html

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.