Tuesday, September 20, 2011

How to run Selenium Webdriver code with Visual Studio Test Framework

 

Previous Post, I have shown you how to run selenium WebDriver code in Visual Studio with NUnit Framework.

Now I will show you how Selenium WebDriver code generated from selenium IDE can be run at Visual studio Test Framework.

Selenium IDE has a functionality to convert its recorded script to Selenium WebDriver and C# in NUnit Framework. Here we copy some portion of code and paste it to Visual studio test framework

So If we know how to record Selenium IDE (see the post : http://bit.ly/pa1TG5) then we can easily convert it to selenium WebDriver code.

Before starting we just define a Test case.

Test case :

    1. Open Selenium Website (http://seleniumhq.org/) in Firefox browser.
    2. Click Project tab
    3. Click Selenium IDE link
    4. Verify that Selenium IDE Text is present

Step 1: Record the test case in Selenium IDE

  • Open Firefox Browser
  • Open Selenium IDE window by Clicking Tools->Selenium IDE
  • Make Red colored Record button on.
  • Enter the URL : http://seleniumhq.org/ at the address bar and click Search button
  • Click Project tab
  • Click Selenium IDE link
  • Verify that Selenium IDE Text is present

The recorded script will be like the following figure

se9_thumb

Now make the record button off and Click Run button to run the script.

Step 2: Convert the Selenium IDE recorded script to C# WebDriver code

  • Go to Selenium IDE window
  • Click Options menu
  • Click Format –> C#(WebDriver).

se10_thumb2

Sometimes in Options –> Format menu, C#(WebDriver) options may not be displayed. The menu options like:

se13_thumb[1]

In that case, there is some change needed in selenium IDE option window. Please follow the steps:

  1. Click Options menu in Selenium IDE window
  2. Click “Options…” and Selenium IDE options window is displayed.

se12_thumb

se14_thumb1

Click Enable experimental features check box and click OK button. Now go to Format options and driver list.

  • A message dialog is displayed after selecting the appropriate format like (C#(WebDriver))

se11_thumb

  • Click OK button
  • Selenium IDE window shows the selenium WebDriver Code in C# format with unit testing Framework NUnit is implemented.

se15_thumb3

Step 2: Run the Code in visual Studio 2010 Test Framework

  • Open Visual Studio 2010 IDE
  • Create a Test Project by Clicking Test->New Test. A Test project is created with a default class name UnitTest1.cs
  • Double click on UnitTest1.cs on Solution Explorer to open the class file

se25

  • Now go to Selenium IDE code editor and find the method name “TheUntitledTest()”
  • Copy the entire code of this method and paste to “TestMethod1()” method of VS Test project and the method “TestMethod1()” looks like the following

 

public class UnitTest1
    {
        [TestMethod]
        public void TestMethod1()
        {
            driver.Navigate().GoToUrl(baseURL);
            driver.FindElement(By.LinkText("Projects")).Click();
            driver.FindElement(By.LinkText("Selenium IDE")).Click();
            // ERROR: Caught exception [ERROR: Unsupported command [isTextPresent]]
        }
    }

 

  • Now Add two selenium namespace

 

  1. using OpenQA.Selenium;
  2. using OpenQA.Selenium.Firefox;

 

  • Now go to selenium download page ( http://seleniumhq.org/download/ ) and download the latest version of Selenium Client Driver with C#. Here version 2.6.0 is downloaded.

se17_thumb3

  • Now unzip downloaded zip file and rename the folder as “Selenium”
  • Go to Solution explorer of Visual Studio IDE
  • Right click Reference and click Add Reference option. Add Reference window is displayed

se19_thumb1

  • Click Browse tab and go to Selenium folder. Inspect that there are 2 sub folder – net35 and net40. net35 folder is for .Net framework 3.5 project and net40 for .Net framework 4.0 project. In this project .Net framework 4.0 is selected so we go to net40 folder
  • Select all the dlls and click OK button and .dll files are added as reference

se20_thumb3

 

  • Now all the references are added
  • Go to “public void TestMethod1()” method
  • Create Firefox Driver object named “driver” and the code will be
FirefoxDriver driver = new FirefoxDriver();
  • Add a string variable for base URL named “baseURL”.  Code looks like
string baseURL = "http://seleniumhq.org/";

 

  • Add the following code at the TestMethod1() method for verification

Assert.AreEqual(driver.FindElement(By.XPath("//div[@id='mainContent']/table/tbody/tr/td/p/b")).Text, "Selenium IDE");
  • For closing the browser window add the code at last line
driver.Close();
  • Here is the total code for VS Test
      using System;
      using System.Text;
      using System.Collections.Generic;
      using System.Linq;
      using Microsoft.VisualStudio.TestTools.UnitTesting;
      using OpenQA.Selenium;
      using OpenQA.Selenium.Firefox;

      namespace TestProject1
      {
          [TestClass]
          public class UnitTest1
          {
              [TestMethod]
              public void TestMethod1()
              {
                  FirefoxDriver driver = new FirefoxDriver();
                  string baseURL = "http://seleniumhq.org/";
                  driver.Navigate().GoToUrl(baseURL);
                  driver.FindElement(By.LinkText("Projects")).Click();
                  driver.FindElement(By.LinkText("Selenium IDE")).Click();
                  Assert.AreEqual(driver.FindElement(By.XPath("//div[@id='mainContent']/table/tbody/tr/td/p/b")).Text, "Selenium IDE");
                  driver.Close();
              }
          }
      }
       
      • Build the solution by right clicking on the solution name and Click build solution
      • Inspect that no Error message is displayed and build is succeeded.
      • Click Run button
      • Firefox Browser is opened and Script runs and Test is successful.

      se26

      That’s all. I have described here all the steps in a very easy and details way. If any thing could not understand, please comment me, I must answer.

      In my next Selenium blog, I will show how we can run our selenium WebDriver code in Java with JUnit4 Framework.

    • Monday, September 19, 2011

      How to run Selenium WebDriver code with NUnit

       

      In the last post I have shown you how to record and play back with Selenium IDE.

      Now I will show you how Selenium WebDriver code generated from selenium IDE can be run at visual studio 2010 with NUnit Framework.

      Selenium IDE has a functionality to convert its recorded script to Selenium WebDriver and C# in NUnit Framework.

      So If we know how to record Selenium IDE (see the post : http://bit.ly/pa1TG5) then we can easily convert it to selenium WebDriver code.

      Before starting we just define a Test case.

      Test case :

        1. Open Selenium Website (http://seleniumhq.org/) in Firefox browser.
        2. Click Project tab
        3. Click Selenium IDE link
        4. Verify that Selenium IDE Text is present

       

      Step 1: Record the test case in Selenium IDE

      • Open Firefox Browser
      • Open Selenium IDE window by Clicking Tools->Selenium IDE
      • Make Red colored Record button on.
      • Enter the URL : http://seleniumhq.org/ at the address bar and click Search button
      • Click Project tab
      • Click Selenium IDE link
      • Verify that Selenium IDE Text is present

      The recorded script will be like the following figure

      se9

      Now make the record button off and Click Run button to run the script.

      Step 2: Convert the Selenium IDE recorded script to C# WebDriver code

      • Go to Selenium IDE window
      • Click Options menu
      • Click Format –> C#(WebDriver).

      se10

      Sometimes in Options –> Format menu, C#(WebDriver) options may not be displayed. The menu options like:

      se13

      In that case, there is some change needed in selenium IDE option window. Please follow the steps:

      1. Click Options menu in Selenium IDE window
      2. Click “Options…” and Selenium IDE options window is displayed.

      se12

      se14

      Click Enable experimental features check box and click OK button. Now go to Format options and driver list.

       

      • A message dialog is displayed after selecting the appropriate format like (C#(WebDriver))

      se11

      • Click OK button
      • Selenium IDE window shows the selenium WebDriver Code in C# format with unit testing Framework NUnit is implemented.

      se15

       

      Step 2: Run the Code in visual Studio 2010

      • Open Visual Studio 2010 IDE
      • Create a New Class Library project by Clicking the options  File –>New –>Project and New Project Window is displayed
      • Select Visual C# from the template and project type Class Library

      se16

      • Enter Project name, Location and Solution Name and Select .Net Framework 4.0
      • Click OK button
      • New Project is created
      • Now Copy the whole text from Selenium IDE and paste into Class Library project editor. It is like Copy the whole text like CTRL+A to select the whole text and CTRL+C to copy. Then remove all sample code from VS editor  and Paste CTRL+V to all code.
      • There are some Reference error show at editor. It could not find Open QA namespace. For this we need some .dll file from Selenium client driver to add as a reference.

      se18

      • Now go to selenium download page ( http://seleniumhq.org/download/ ) and download the latest version of Selenium Client Driver with C#. Here version 2.6.0 is downloaded.

      se17

      • Now unzip downloaded zip file and rename the folder as “Selenium”
      • Go to Solution explorer of IDE
      • Right click Reference and click Add Reference option. Add Reference window is displayed

      se19

      • Click Browse tab and go to Selenium folder. Inspect that there are 2 sub folder there – net35 and net40. net35 folder is for .Net framework 3.5 project and net40 for .Net framework 4.0 project. If the class library project is created as ,Net framework 3.5 then we select the .dll file of net35 folder. In this project .Net framework 4.0 is selected so we go to net40 folder
      • Select all the dlls  and click OK button and .dll files are added as reference

      se20

       

      • Now NUnit dll’s are needed for NUnit framework
      • Now download the latest NUnit form the site (http://www.nunit.org/index.php?p=download)
      • Download the latest NUnit with windows verison (2.5.10) and Install
      • Now right click on Reference and click Add Reference and go to NUnit folder where it is installed like (C:\Program Files (x86)\NUnit 2.5.10\bin\net-2.0\framework)
      • Select (nunit.framework.dll) file and click OK

      se21

      • Now all the references are added
      • Add the following code at the TheUntitledTest() method
      Assert.AreEqual(driver.FindElement(By.XPath("//div[@id='mainContent']/table/tbody/tr/td/p/b")).Text, "Selenium IDE");
      • TheUntitledTest() method will be
      1. public void TheUntitledTest()
      2.       {
      3.           driver.Navigate().GoToUrl(baseURL);
      4.           driver.FindElement(By.LinkText("Projects")).Click();
      5.           driver.FindElement(By.LinkText("Selenium IDE")).Click();
      6.           Assert.AreEqual(driver.FindElement(By.XPath("//div[@id='mainContent']/table/tbody/tr/td/p/b")).Text, "Selenium IDE");
      7.           // ERROR: Caught exception [ERROR: Unsupported command [isTextPresent]]
      8.       }

       

      • Class1.cs code (whole WebDriver code) will be
      1. using System;
      2. using System.Text;
      3. using System.Text.RegularExpressions;
      4. using System.Threading;
      5. using NUnit.Framework;
      6. using OpenQA.Selenium;
      7. using OpenQA.Selenium.Firefox;
      8.  
      9. namespace SeleniumTests
      10. {
      11.     [TestFixture]
      12.     public class Untitled
      13.     {
      14.         private IWebDriver driver;
      15.         private StringBuilder verificationErrors;
      16.         private string baseURL;
      17.  
      18.         [SetUp]
      19.         public void SetupTest()
      20.         {
      21.             driver = new FirefoxDriver();
      22.             baseURL = "http://seleniumhq.org/";
      23.             verificationErrors = new StringBuilder();
      24.         }
      25.  
      26.         [TearDown]
      27.         public void TeardownTest()
      28.         {
      29.             try
      30.             {
      31.                 driver.Quit();
      32.             }
      33.             catch (Exception)
      34.             {
      35.                 // Ignore errors if unable to close the browser
      36.             }
      37.             Assert.AreEqual("", verificationErrors.ToString());
      38.         }
      39.  
      40.         [Test]
      41.         public void TheUntitledTest()
      42.         {
      43.             driver.Navigate().GoToUrl(baseURL);
      44.             driver.FindElement(By.LinkText("Projects")).Click();
      45.             driver.FindElement(By.LinkText("Selenium IDE")).Click();
      46.             Assert.AreEqual(driver.FindElement(By.XPath("//div[@id='mainContent']/table/tbody/tr/td/p/b")).Text, "Selenium IDE");
      47.             // ERROR: Caught exception [ERROR: Unsupported command [isTextPresent]]
      48.         }
      49.         private bool IsElementPresent(By by)
      50.         {
      51.             try
      52.             {
      53.                 driver.FindElement(by);
      54.                 return true;
      55.             }
      56.             catch (NoSuchElementException)
      57.             {
      58.                 return false;
      59.             }
      60.         }
      61.     }
      62. }
      • Build the solution by right clicking on the solution name and Click build solution
      • Inspect that no Error message is displayed and build is succeeded.
      • Now open NUnit application editor by going Start – > Program – > NUnit 2.5.10 –> NUnit
      • Now go to File – > Open Project
      • Select the Class Library dll file from bin/debug folder of Class Library project
      • Click Run button
      • Firefox Browser is opened and Script runs and Test is successful.

      se24

      That’s all. I have described here all the steps in a very easy and details way. If any thing could not be understand,  please comment me, I must answer. Please comment me about the whole blog.

      In my next blog, I will show how we can run our selenium WebDriver code in Visual Studio Test Framework.

      Saturday, September 10, 2011

      How to record and run scripts with Selenium IDE

       

      In my previous blog I have shown you how to install Selenium IDE as Firefox plug in.

      In this blog I will show you how to record script with Selenium IDE.

      Before recording we need to write the test case or the steps that we record. For example, we use the Selenium website. http://seleniumhq.org/

      Test Case Steps are :

      1. Open Selenium Website (http://seleniumhq.org/) in Firefox browser.
      2. Click Project tab
      3. Click Selenium IDE link
      4. Verify that Selenium IDE Text is present

      Lets Start Recording with Selenium IDE.

      Step 1 : Open Firefox Browser

      Open Firefox window as a Blank tab.

      Step 2 : Open Selenium IDE window

      Open Tool menu. Click Selenium IDE options. (Figure : 1) Selenium IDE is displayed (Figure : 2)

      se2

      Figure : 1

       

      Step 3 : Introduction of Selenium IDE window

      se1

      Figure : 2

      Selenium IDE has Record and Run button and also Scripts editor area. The above figure shows the window.

      When user do a operation, say click on a button or type a text in a text box, Selenium IDE records it as a script. There are three parts of Selenium script.

      Command : There are a command list for every operation with the web page like click a button, it records a click command. 

      Target : The location of the component, Id, Name, XPath or CSS

      Value : The value or content of the assigned location. For example, If there is a text to verify, then the verified text is typed here.

      The log tab is at the below of the window displays the status when test runs.   

      Step 4 : Start Recording

      Before recording, verify that record button is on. Minimize the selenium IDE window.

      • Now enter the address http://seleniumhq.org/ at the address box in Firefox browser.
      • Press Enter button
      • Selenium home page is loaded
      • Click the project tab (Figure : 3)

      se3

      Figure : 3

      • Click Selenium IDE link. selenium IDE plug in page is displayed.(Figure : 4)

      se4

      Figure : 4

      • Now right click on the text “Selenium IDE” and click VerifyTextPresent Selenium IDE option (Figure : 5)

      se5

      Figure : 5

      • Now maximize the Selenium IDE window and click the recording button to stop.

      The script is ready and looks like the following figure:

      se6

      Figure : 6

      Step 5 : Running the script

      Click the Play button to run the script.

      se7

      Figure : 7

      Inspect that after running script it shows the test result at he left side

      se8

      Figure : 8

      I have tried to show you some simple steps to automate a page by using Selenium IDE. This script can only be run in Firefox browser. In Future blog post, I will show you how scripts generated in Selenium IDE can be run in different browser by Selenium webdriver.

      Saturday, September 3, 2011

      How to install Selenium IDE in Firefox



      Couple of years before I was searching an automated open source testing tool. I did some googling and got Selenium. That time only Selenium IDE, Selenium RC and grid was popular. I chose Selenium IDE as my first open source automated tool. Then I worked with Selenium RC. Now Selenium Webdriver is becoming popular.
      In my first blog, I shall describe here about the installation process in Selenium IDE.



      Selenium IDE is a Firefox plugin. So firefox browser is needed to install it. The following steps shows the easiest way to install selenium IDE.
      Step 1 : Open Firefox. Here I have used Firefox version 6.0.1
      Step 2 : Go to selenium home page http://seleniumhq.org/
      Step 3 : Click Download button as shown in Figure 1



      (Figure 1)

      Step 4 : Go to Selenium IDE area and Click the version number link text as selected in a red color rectangle at the following Figure 2.

      (Figure 2)       
      Step 5 : Click Allow button (Figure 3). Selenium Plug in installation window is displayed 


      (Figure 3)

      Step 6 : Click Install Now button as shown in following figure as a Red rectangle (Figure 4)

      (Figure 4)

















      Step 7 : Click Restart Firefox button when Plugin successfully installed message is displayed (Figure 5)


      Figure 5


       









      Step 8 : Now Selenium IDE installation is completed successfully. After restarting Firefox go to Tools Menu of the Browser and click Selenium IDE options.

      (Figure 6)
       


      Selenium IDE window is displayed like the following.
       


      In my next blog I show you how to record and play back through Selenium IDE tool.

      Please comment me if any issue is found when install by following through the above steps and also suggest me about my first blog post.


       

      Cypress: How to handle browser-based authentication pop up dialog in Cypress

      Five years ago I have written a blog on how to handle browser-based authentication for selenium webdriver.   Now it is for cypress. Cypress...