WebDriver Exploration Part-2(Locating WebElements)

-
In this lecture, we will learn how we can locate elements and perform an operation on them.
WebElement represents the HTML element with whom we interact during testing.
We will now look at how we can find elements and store them in IWebElement Interface

Inspecting Element in Chrome browser

Open Google home page and right-click on the element with you want to inspect and choose inspect from the popup menu and you can see all the HTML attributes for the element

Now we know how can one inspect an element, we will start with locating element and then we will create sample script to interact with an element

Locating by ID

 We will open the google home page and inspect the image above the search text box and you will see that the image is in Div tag with ID as "hplogo".

We will create a script to find the div element and then click on the element which will open the search page as per the logo image

[TestMethod]
        public void Verify_Locating_By_ID()
        {
            InternetExplorerOptions options = new InternetExplorerOptions();
            options.IntroduceInstabilityByIgnoringProtectedModeSettings = true;
 
            IWebDriver driver = new InternetExplorerDriver(options);
            driver.Url = "https://www.google.com/";
 
            //Locate Element By ID
            IWebElement logoElement= driver.FindElement(By.Id("hplogo"));
 
            //Click on Logo ELement
            logoElement.Click();
 
            //Wait to see the results
            System.Threading.Thread.Sleep(5000);
 
            //Driver close first instance
            driver.Quit();
 
        }


Locating by Name

 We will open google home page and find search textbox by name attribute and type 'test' string

[TestMethod]
       public void Verify_Locating_By_Name()
       {
           InternetExplorerOptions options = new InternetExplorerOptions();
           options.IntroduceInstabilityByIgnoringProtectedModeSettings = true;
           options.RequireWindowFocus = true;
 
           IWebDriver driver = new InternetExplorerDriver(options);
           driver.Url = "https://www.google.com/";
 
           //Locate Element By name
           IWebElement searchTxtbox = driver.FindElement(By.Name("q"));
 
           //Click on ELement
           searchTxtbox.SendKeys("test");
 
           //Wait to see the results
           System.Threading.Thread.Sleep(5000);
 
           //Driver close first instance
           driver.Quit();
 
       }

Locating By Class Name

 We will open google home page and find google search page button by class name and then print the button text on the console

[TestMethod]
      public void Verify_Locating_By_Class_Name()
      {
          InternetExplorerOptions options = new InternetExplorerOptions();
          options.IntroduceInstabilityByIgnoringProtectedModeSettings = true;
          options.RequireWindowFocus = true;
 
          IWebDriver driver = new InternetExplorerDriver(options);
          driver.Url = "https://www.google.com/";
 
          //Locate Element By class name
          IWebElement searchTxtbox = driver.FindElement(By.ClassName("gNO89b"));
 
          //Get the Button text ie value attribute text
          string value=searchTxtbox.GetAttribute("value");
          Console.WriteLine("Button Text: " + value);
 
          //Wait to see the results
          System.Threading.Thread.Sleep(5000);
 
          //Driver close first instance
          driver.Quit();
 
      }


Output:-
Button Text: Google Search


 Locating By Xpath

 Here we will find and click on Gmail link on the header.
On inspecting header element we can see there is no ID or Name attributes using which we can directly locate the element. In such conditions, we can use XPath where we can find the parent element which has unique identification and then we can locate the element which has a tag as 'a' and text as 'Gmail'

[TestMethod]
       public void Verify_Locating_By_XPath()
       {
           InternetExplorerOptions options = new InternetExplorerOptions();
           options.IntroduceInstabilityByIgnoringProtectedModeSettings = true;
           options.RequireWindowFocus = true;
 
           IWebDriver driver = new InternetExplorerDriver(options);
           driver.Url = "https://www.google.com/";
 
           //Locate Element By ID
           IWebElement gmailLink = driver.FindElement(
                                 By.XPath("//div[@id='gb']//a[text()='Gmail']"));
 
           //Click gmail link
           gmailLink.Click();
 
           //Wait to see the results
           System.Threading.Thread.Sleep(5000);
 
           //Driver close first instance
           driver.Quit();
 
       }


 Locating By CSS

 Here we will do the same steps as done above in Xpath example, instead, we will use a CSS selector


[TestMethod]
       public void Verify_Locating_By_CSS()
       {
           InternetExplorerOptions options = new InternetExplorerOptions();
           options.IntroduceInstabilityByIgnoringProtectedModeSettings = true;
           options.RequireWindowFocus = true;
 
           IWebDriver driver = new InternetExplorerDriver(options);
           driver.Url = "https://www.google.com/";
 
           //Locate Element By ID
           IWebElement gmailLink = driver.FindElement(
               By.CssSelector("div#gb a"));
 
           //Click gmail link
           gmailLink.Click();
 
           //Wait to see the results
           System.Threading.Thread.Sleep(5000);
 
           //Driver close first instance
           driver.Quit();
 
       }


Here locator div#gb means div tag with 'gb' ID attribute value
Also, if you want to find by class name then use dot(.) keyword
for example, div.cl means div tag with class value as 'cl'


Locating By Link Text

We will find the Gmail link on google home page using the link text method
[TestMethod]
        public void Verify_Locating_By_LinkText()
        {
            InternetExplorerOptions options = new InternetExplorerOptions();
            options.IntroduceInstabilityByIgnoringProtectedModeSettings = true;
            options.RequireWindowFocus = true;
 
            IWebDriver driver = new InternetExplorerDriver(options);
            driver.Url = "https://www.google.com/";
 
            //Locate Element By link text
            IWebElement gmailLink = driver.FindElement(
                By.LinkText("Gmail"));
 
            //Click gmail link
            gmailLink.Click();
 
            //Wait to see the results
            System.Threading.Thread.Sleep(5000);
 
            //Driver close first instance
            driver.Quit();
 
        }


Locating by Partial Link Text

 We will find the Gmail link on google home page using the partial link text method
[TestMethod]
      public void Verify_Locating_By_PartialLinkText()
      {
          InternetExplorerOptions options = new InternetExplorerOptions();
          options.IntroduceInstabilityByIgnoringProtectedModeSettings = true;
          options.RequireWindowFocus = true;
 
          IWebDriver driver = new InternetExplorerDriver(options);
          driver.Url = "https://www.google.com/";
 
          //Locate Element By partial link text
          IWebElement gmailLink = driver.FindElement(
              By.PartialLinkText("mail"));
 
          //Click gmail link
          gmailLink.Click();
 
          //Wait to see the results
          System.Threading.Thread.Sleep(5000);
 
          //Driver close first instance
          driver.Quit();
 
      }


That's all I have for this lecture 👱

Comments

Post a Comment

Popular posts from this blog

Specflow -Part3(Working with tables using Specflow.Assist.Dynamic)

-
In the previous lecture, we learned how can we work with tables to handle test data from the feature file.I will paste the feature and step definitions from earlier lecture and then we will talk about the shortcomings and how Specflow.Assist.Dynamic can help us to overcome them Feature File Feature : SpecFlowFeature2 In order to show specflow capabilities for working on tables We are going to write some scenarios here Scenario : Verify specflow can read data from table and print on console Given  I have dummy student data as below   |  StudentId  |  StudentName  |  Division     |  Age  | |  100        |  James        |  Engineering  |  30   | |  101        |  Jon          |  Medical      |  40   | |  102        |  Steve        |  Engineering  |  50   | Then  I print details on console Custom Class public   class   Student     {         public   int   StudentId ;         public   string   StudentName ;         public   string   Division ;         public   int   Age ;
Read more

Specflow -Part4(Specflow Scenario Outline and Feature Background )

-
In the previous lecture, we talked about how we can pass multiple data to step using tables, suppose we want to run the same scenario for a different set of data, For example, you want to test the login functionality of an application, where you test login with Administrator, Project Manager, Product Owner etc Here the steps of scenario will remain the same only the login credentials will change according to the user. We can have the same scenario run multiple times for each user you want to test with the help of scenario outline, check below Feature file Feature : SpecFlowFeature3 In order to test the login functionality for multiple users, we will demo using scneario outline Scenario Outline : Verify login for different set of users Given  User trys to login into application using  <Username>  and  <Password> When  User enters the  <Username>  and  <Password> Then  User should be successfully logged as  <Role> Examples :  |  Username   |  
Read more

Specflow -Part6(Specflow Hooks)

-
Image
We may come across a scenario where we need to execute code after/before a particular event like given below We want to create some folder where we can store screenshots/ logfile before starting the test We may want to log details of the scenario in a log file after executing each step  We want to know after each step if that step was successful and if not we want to take a screenshot as an evidence We want to clean up the database before/after each scenario/feature  We  may want to open/close browser for every scenario Hooks help us to execute logic when a certain event occurs, let's check how I will start with creating a new project called SeleniumHooks and added folders where we can keep our feature, feature definitions and hooks file We will add a feature file and implement the steps Feature : SpecFlowFeature1 In order to avoid silly mistakes As a math idiot I want to be told the sum of two numbers @mytag Scenario : Add two numbers Given  I have entered 
Read more