Selenium with Javascript – Accessing different Elements

Selenium with Javascript – Accessing different Elements

We had discussed about Locators in our last session, So we know that we can use Locators to access or locate different type of Elements. Now, we get a question, that how many types of Elements, do we have in a Web Application, and the answer is, there can be many type of Elements. At the same time, We have to know, that what action has to be performed on which element. Elements are called Web Elements because these elements belong to a Web Application.

Type of Web Elements

We have different type of Web Elements in a Web Application.

  1. Text Area
  2. Button
  3. Checkbox
  4. Radio Button
  5. Input Field
  6. Dropdown
  7. Image

Actions associated to Web Elements

  1. Text Area – Enter Text
  2. Button – Click on the Button
  3. Checkbox – Click on the Checkbox
  4. Radio Button – Click on the Radio Button
  5. Input Field – Enter Text
  6. Dropdown – Select a value from the Dropdown
  7. Image – Click on the Image

Method in Selenium for each Action

  1. Enter Text in a Text area and input field – sendKeys(“”);
  2. Click on a button, checkbox, radiobutton – click();
  3. Select Value from dropdown –
    • click();
    • selectByVisibleText();
    • selectByValue();
    • selectByIndex();

Example for Accessing Element

Let’s see the example for accessing different types of Elements in a Web Application.

  1. Navigate to the eCommerce Website.
  2. Click on any of the Item.
  3. Click on Add to Basket Button
  4. Click on View Basket Button
  5. Click on Proceed to checkout Button
  6. Enter Shipping and Billing details and click on place Order.

Now, Let’s write Automation script for the same, so that we will get to know, How to access different elements in a Website. We will see this practically in next session one by one.

  1. First, we will see click examples. We will find the elements where we can click and then we will click on them using click method of Selenium with Javascript.
  2. Second, we will see sendKeys examples, we will find the elements where we can enter some value and then we will enter some value in the fiels using sendKeys method of Selenium with Javascript.
  3. Third, we will see dropdown examples, we will find the elements where we have to select some value from dropdown, and try to select value from dropdown using selectByVisibleText method or any other method of Selenium with Javascript.

So, this is how we are going to see, How to access any element in a Web Application using Selenium with Javascript.

Summary

We have covered below topics in this session

  1. Selenium with Javascript – Accessing different Elements
  2. Type of Web Elements
  3. Actions associated to Web Elements
  4. Method in Selenium for each Action
  5. Example for Accessing Element

Leave a Comment