Day 3 – Interact with your WebPage

Have you tried with the addresses we discussed last day?  What did you find?  Let’s discuss two of those

Address 1 : $x(“//div[@class=’columns-container’]”)

address_1

Address 3 : $x(“//input[@name=’search_query’]’)

address_3

Could you see that the element itself was telling its address?  See this in details

identifyingelement

Just think, manually what you were doing with a web page. For me it is not more than a two step process:

  1. Identify the
    or of your choice on the webpage
  2. Perform action on the identified
    or

Automation is no where different from manual steps. The only thing is to instruct the system in its own language.

Consider the example : “I want to search for keyword ‘Dress’ in the application.” Try it, and record the steps you performed manually :

  1. Launch the Application on Browser
  2. Identify the search box on the page.
  3. Provide the keyword ‘Dress’
  4. Identify the button to perform search action
  5. Click on the search button

That’s it 🙂 Is it not simple? Yes it is, but all this is manual. Now let’s see, if we have similar instructions in different way

step1

Step2.PNG

Don’t you remember, this element itself told us its identification,

So note the element, as $x(“//input[@name=’search_query’]’)[0]

Step3.PNG

Now let’s move to step 4,

Step4.PNG

It’s your turn now. Try to interact with the ‘Search’ button, using it’s identification.

Step5.PNG

Now time for some action. We will first convert these five steps into a browser language and then see where it will take us. Launch the Chrome browser, and execute below steps on console window of browser:

FinalSteps.PNG

I know a few questions that might arise in your mind, but let’s do some practical first, and be amazed.

And now some Assumptions for this day only,

  1. I assumed browser as ‘document’, and launch the application.
  2. getElementById is the function, which will find the element on the document with identification value using
  3. Then is used to supply the value to the target text box
  4. Again locate the element using identification value using
  5. and Finally click the element identified in step #4, using method click()

OK, Revise our TWO STEPS fundamental theory of automation,

  1. Identify the target
  2. Take the appropriate action

Share your experience of this learning through comments, and suggest how the learning can be improved 🙂

#AutomationWithAmit @AmitMetacube

Advertisements

One thought on “Day 3 – Interact with your WebPage

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 )

Twitter picture

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

Facebook photo

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

Google+ photo

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

Connecting to %s