Wednesday, April 15, 2020

Chrome: Fundamentals of Browser Automation

The page that will be automated as an example is https://www.google.com/ as it is displayed in Chrome. PowerShell and Selenium will be the technology the facilitates browser autoamtion.  Before coding the automation in PowerShell the elements on the page must be inspected so that a strategy for automation can be devised.

In Chrome,  https://www.google.com/ is displayed as follows:


Right clicking inside the search box displays a context menu and selecting the Inspect menu option allows the underlying HTML element of the search box to be inspected:


Selecting the Inspect menu item will display the Chrome Inspector with the HTML for the selected elemetnt lightlight.


Right clicking on the highlight element in Chrome Inspector allows the element to be copied:


Using Copy | Copy Element, the element associated with the search text field is:

<input class="gLFyf gsfi" maxlength="2048" name="q" type="text" jsaction="paste:puy29d" aria-autocomplete="both" aria-haspopup="false" autocapitalize="off" autocomplete="off" autocorrect="off" autofocus="" role="combobox" spellcheck="false" title="Search" value="" aria-label="Search" data-ved="0ahUKEwjVteiQn-ToAhVDEawKHcycBJoQ39UDCAY">

The Selnium API's Find-SeElement function can fine elements by name, class, name, etc. so the following are potential components by  which to automate the search text box:
  •  element type:input
  •  class: gLFyf gsfi
  • name: q
The class name has a space in it which is not supported. The page has multiple elements of type input. The unique component is the name, "q", which can be used by Find-SeElement to look up the underlying element.







No comments :

Post a Comment