In Selenium Webdriver Manipulation post, we will learn webdriver’s manipulation capabilities. In test automation manipulation means to do something on a page such as a click on a button, select a radio button, select a dropdown box item, write a text into a text box, etc. To do these events first we have to interrogate (find) that web element, then do an action on it. In this post, we will focus on doing an action on a web element.


This post is designed for beginners who have little or no automation experience. At the end of this tutorial, you will have knowledge of Selenium Webdriver manipulation features.


 Nice to have: Before starting to read this post it is better to read previous selenium tutorials.


Selenium Webdriver Manipulation Essential Methods

Selenium Webdriver API has got a bunch of methods you can find all the list below link.

However, the most common selenium webdriver manipulation methods are:

  • .click() [Click a button or link]
  • .clear() [Clear text]
  • .sendKeys(String) [Write text or perform keyup, keydown, etc.]
  • .submit [Submit a form]

I want to continue this post with examples. The best way to understand Selenium Webdriver Manipulation methods of webdriver is to do exercises.

Mouse Interactions

The most common mouse interactions are


.doubleClick (Deprecated)

.release (Deprecated)

.clickAndHold (Deprecated)

.contextClick (means Right Click) (Deprecated)

First, we have to find the web element which is a button, link, etc. then we will apply mouse interaction for our test scenario.

For example:

Keyboard Interactions

The most common keyboard interactions are:


.keyUp (Deprecated)

.keyDown (Deprecated)

For example:

Radio Button Interactions

Our test site is and our scenario is described as follows.

  1. Go to
  2. Click male radio button
  3. Check male radio button is Displayed/Enabled/Selected
  4. Click female radio button
  5. Check female radio button is Displayed/Enabled/Selected

Css path of male radio button is: #u_0_o

Css path of female radio button is: #u_0_n

Test code is shown below:

Check Box Interactions

Our test site is and our scenario is described as follows.

  1. Go to
  2. Check “Keep me logged in” checkbox is NOT selected
  3. Click “Keep me logged in” button.
  4. Check “Keep me logged in” checkbox is selected

Css path of “keep me logged in” checkbox is: #persist_box

Our test code is shown below:

Drop Down Interactions

Our test site is and our scenario is described as follows.

  1. Go to
  2. Set Birthday as follows Oct – 29 – 1990

We have some options to select dropdown items. I explained three of them below. We can select drop-down items also with webdriver’s sendkeys method.

1) Chain of Find Elements and Direct Access to Dropdown Item

Month drop-down select CSS Path: #month

Day drop-down select CSS Path: #day

Year drop-down select CSS Path: #year


October option full CSS path: #month>option[value=’10’]

October option CSS path: option[value=’10’]


29th day’s full CSS Path: #day>option[value=’29’]

29th day’s CSS Path: option[value=’29’]


We have two options now:

1.1) Click full CSS Path of drop-down items. (Direct Access to Drop Down Options)

1.2) First find Dropdowns select CSS path and then find the required option.

2) Webdriver Select Method

We have three options to select a dropdown item with Select method.

2.1) selectByIndex

2.2) selectByValue

Month value is: 10


Day Value is: 29


Year Value is: 1990


2.3) selectByVisibleText

Multi-Select Interactions

Our test site is and our scenario is described as follows.

  1. Go to
  2. Select Volvo and Open
  3. Click Submit Query
  4. Check Volvo and Opel selected

Multiple Select CSS Path: select[name=’cars’]

Submit Query CSS Path: input[type=’submit’]

Result Part’s second line CSS Path: html>body>h3:nth-of-type(2)

Note: All elements are located in an iframeResult iframe so we have to switch to this iframe to locate elements.

First we need to find the multiple select and then get all the options into a list. After that, we can do all kind of manipulations with these options.

Multi-select with Select Class

Also, Select webdriver comprises of deselect methods as follows:

Deselect methods only works with Multi Selects!

  • deselectByIndex
  • deselectByValue
  • deselectByVisibleText
  • deselectAll

Submitting Forms

When we fill the web form, the last step is submitting filled values. To do this, we have some options. These are:

  1. Submitting with form
  2. Submitting with form button
  3. Submitting with keyboard keys

Here are the examples of all options.

1) Submitting with form

Our test site for this example is and our scenario is described as follows.

  1. Go to
  2. Find join form
  3. Submit form without entering any value
  4. Find first name error alert
  5. Check first name error

Form’s CSS Path:


Alert’s CSS Path:


And our scenario’s test code is shown below:

2) Submitting with form button

Our scenario is same but this time we should find the join form submits button locator and click it. Then check the error message.

Submit button’s css is .btn.btn-primary.join-btn

And test code is shown below:

3) Submitting with keys

This time you should again find join form’s button and instead of using .click() or .submit() functions. You can use joinFormButton.sendKeys(Keys.SPACE) or joinFormButton.sendKeys(Keys.ENTER). I generally do not prefes to use this option.

Submitting a File

Our test site for this example is

  1. Go to
  2. Click “Browse” button
  3. Select sample_text.txt
  4. Click “Submit Query” button
  5. Check the result

Browse button’s CSS path: input[name=img]

Submit Query CSS path: input[type=submit]

Check text CSS path: html>body>h3:nth-of-type(2)

First we will click the browse button, then select the test_file.txt file and submit the form. At the end we will check the result.

Interaction Sequences

Webdriver provides us to perform interactions in an order. We can do that like sample below code:

You can find all other interactions on manipulation section of below link.


1) Move an element to another element (Move to):

We should use functions in order.

  • clickAndHold()
  • moveToElement()
  • release()
  • perform()
2) Drag one element and drop it to another element (Drag and Drop):

We should use below functions in order.

  • dragAndDrop()
  • release()
  • perform()
3) Key Sequence:

For example, if you want to perform ctrl+enter, you can use actions to do this. First we should use keyDown(), then sendKeys(), and finally keyUp().


  • We learned and did exercises of Selenium Webdriver’s manipulation methods
  • We learned mouse, keyboard, radio button, checkbox, drop-down, multi-select, form, file interactions and actions.

Selenium Webdriver Tutorial Series