Protractor setup and example of non angular app simple test – Part 1

Now a days we see lot of angular JS applications being built.

It is said that at least 10% of the latest developing are based on angular js.

In this section we see how to configure and run a simple protractor test on angular and non angular app

Its very straight forward, mostly thats the reason why its largely adapted.

Step 1 :

Install Node.js, current version of node js when writing this blog is v10.16.2

you can download node js from  Node Js download

select the windows MSI and install it. While installing it select add node js to path.

This option enable us to directly access node commands from cmd without navigating to node directory.

Node JS is like collection of several java script libraries. They are called as node modules

The installation also installs the node package manager which is required to install different node modules.

Once you have installed it  go to command prompt (search-> run – >cmd)

then enter following command

Node -v

It should show the current installed version, if its not there is some issue with the installation.

Step2:

Now we have node js setup and ready

Open cmd and try to install the protractor, install protractor globally (all users on the machine, if not remove -g)

npm install protractor -g

More information on this site https://www.protractortest.org/#/

Usually protractor sets up the web driver manager. But if it’s not then you need to install the webdriver manager as well

webdriver-manager update

Step3:

Now we have to start our webdriver-manager to kick of the example test

Webdriver manager will look for webdriver connections that are being initiated by protractor.

webdriver-manager start

There is one sample test that comes with protractor we can use it and create couple of more tests.

But, if we want to run on google we might want to make some changes.

At the end of start of webdriver you should see command prompt like below.

Capture

Step4:

Once you started the webdriver manager, open another command prompt and run a angular example test

In the node js installation will happen typically in appdata/roaming folder go to following path, you should see following

Example path :

C:\Users\{user_name}\AppData\Roaming\npm\node_modules\protractor\example

You should see the following, googleTest is something I have added, you don’t see it by default.

scriptlocation

To run a test we need to use following command

Protractor C:\Users\{user_name}\AppData\Roaming\npm\node_modules\protractor\example\conf.js

What does this mean ?

Protractor reads the conf file and executes the specification file mentioned in the conf.js

Protractor uses something called Jasmin framework by default. Its called as “Describe It” framework.

Test start with Describe() – > then It() , which means action and its expected outcome.

All the code is written in java script, we can use type script too.

Once we start the example test it will perform operations on node js site and gives us the following result.

The result displayed below is formatted, I will mention how to configure different types of reports in next section.

Result

In the next part will discuss about following

  • Custom report as shown above.
  • conf.js sections and how to edit.
  • googleTest.js -> non angular application example.

 

Advertisement

Synchronizing web driver and Ignoring Exceptions in C# Selenium API

In general the website response times may cause issues while doing the UI automation testing. Most of the times test scripts will fail due to synchronizations issues from web-driver and the application web elements.

Following are the common reasons and if we see very frequent issues in synchronization it is suggested to do performance testing and tuning.

  • Location from where we are accessing the application (Latency)
  • Network bandwidth
  • Too much firewall checks
  • Website architecture and technology on which website built on.

Most of these cases are taken care while doing performance tuning and performance engineering, but yet we see page load issues, element enabling issues and visibility issues while doing UI automation.

In selenium we have several methods that we can use to make sure that these things are taken care. Following is the just enough explanation about waits in Selenium driver.

Implicit waits will wait until the defined action (example page loading ) is complete.

Example of it is managed time outs, and they are defined at driver level.

Driver.Manage().Timeouts().ImplicitWait = TimeSpan.FromSeconds(30);
Driver.Manage().Timeouts().PageLoad = TimeSpan.FromSeconds(30);

When we want to wait explicitly at certain number of seconds we will use explicit waits. As the name suggests the test execution will be halted during this time. Example of it is sleep

 Thread.Sleep(2000);

here the parameter indicates the number of milliseconds to wait for.

The other case of waiting for dynamic web elements is using wait until or web driver waits. These are most common implicit waits that are used. There are two ways we can use these.

We can declare the web driver wait and and it will wait for max wait in this case it is 30 seconds, and repeatedly we can check for the expected conditions i this case we are looking for visibility of the element google search text box.

IWebElement textbox;
WebDriverWait waits = new WebDriverWait(Driver, TimeSpan.FromSeconds(30));
textbox = waits.Until(SeleniumExtras
.WaitHelpers
.ExpectedConditions
.ElementIsVisible((By.Name(SEARCH_TEXT_BOX_NAME))));

There is another way we can use this as function delegate, following is how it is used.

//there is another way using function delegate
//delegate parameters and return value = new delegate parameters return value of passed parameters
//delegate is on the fly function generator
Func<IWebDriver,IWebElement>checkForvisibilityOfWebElement = new Func<IWebDriver, IWebElement>((IWebDriver Driver) =>
  {
     IWebElement textBoxDelegate = Driver.FindElement(By.Name(SEARCH_TEXT_BOX_NAME));
       if (textBoxDelegate.Displayed)
           return textBoxDelegate;
       else
          return null;
   }); 
 
 textbox = waits.Until(checkForvisibilityOfWebElement);

When you look at above code, its function delegate takes one argument as IWebDriver and returns the IWebElement. The last argument of function delegate is always a return type.

The wait until function will take this and checks for the condition mentioned in the delegate periodically.

If you look at the until you can clearly see this text.

WaitUntill

But if we look closely, the description says it will throw exception if it is not listed in the Ignore Exception list.

For that purpose. We have to configure our waits object what exceptions that we want to ignore while we periodically check for our condition. We can achieve this by following.

IWebElement textbox;
WebDriverWait waits = new WebDriverWait(Driver, TimeSpan.FromSeconds(30));

waits.IgnoreExceptionTypes(typeof(NoSuchElementException));
waits.IgnoreExceptionTypes(typeof(ElementNotSelectableException));

There are list of exceptions that we may want to ignore, following is the snap shot.

ExceptionList

And finally following is the list of element states we can wait for.

ListOfwaitsfor

Please comment if you see anything is incorrect or you want to add something you know. Thank you.

 

Design Selenium Framework with C# – Part 4

In this part lets look at creating the page objects in most generic way.

As discussed in the last post the selenium support of page object initiation is getting deprecated from next releases of the selenium. So lets create page objects in most generic format.

HomePage

In the above class, we are declaring the all const string or identification strings may be xpath or ids or css selectors as const strings.

And we are assuming that driver object is being sent to the class. We are creating class property as driver and assigning the sent driver while creating the page class object from test.  So the constructor of the page class takes one parameter driver, also if you look at it it take parameter type IWebDriver that means, any type of driver which implements IWebDriver is good enough, this will make class independent of the driver type.

HomePage2

In the above code we have created the web elements as properties of the class

And the actions as methods. We can create the elements in the methods as well. But to make differentiation between actions and elements, its good practice to keep the elements as properties.

I am not creating utility class as of now to keep the common methods in there, also there is no BasePage which has global objects of the application. We can very well do that, but for the simplicity , I have not added additional classes which makes it bit complex to understand the execution flow.

Similar to the above the class, we can create search results page and validation of the search results page in another class called GoogleSearchResults.

SearchResultsPage

And verification method for verifying the returned search result.

SearchResults2

Now that we have every thing ready we are good to create NUnit test and understand the execution flow. I will discuss it in next section.

Design Selenium Framework with C# – Part 5

 

 

Intro to ShiftLeft and BDD in Automation Testing Context

In recent times the shift left is happening trend in the software DevOps.

DevOps is basically a ladder between development and testing which enables continues integration and continues development.

In the context of DevOps shift left testing is getting more focus as the strategy of shift left is to test early and deploy early. (shifting testing left side of the “requirements to development to production roll out” pipe line).

That means the automation testing should happen as and when build is getting generated. The cycle times of test execution must be low so that build can be generated quickly. To do this seamlessly with conventional automated testing tools is a challenge as these tools typically have different UI and not integrated with development environment.

So the ideal solution is to have IDE(Integrated Development Environment) or a plugin for development environments. Be it Microsoft Visual Studio, be it Java Eclipse or be it any other development environment, Test Automation can be performed right from IDE right from the same development environment integrating with favorite unit testing frameworks.

This will be one shop stop for both development and testing.

Selenium is already being great tool for Test Automation right from integrated build environments for C# and Java for Web Applications.

So where will BDD fit, BDD is approach for faster testing and provides transparency in testing “what you write as requirement (feature) is what you test”. Requirements are written as features and features are implemented and tested.

It starts with Features, which all features we want to include. And each features contain multiple scenarios and each scenario can have flavors with different data sets.

Application -> Features – > Secenarios -> DataSets

Let us try to write the feature and scenarios for Calculator application in general to get to better understand, and after that we can see how these features can implemented.

Lets first create feature file as calc.feature  and write following.

 

bdd1

Then lets choose how many types of scenarios we want to cover for this feature and tag them separately.

@Basicoperations

@Advancedoperations

Let us take in each of these operations lets write basic scenarios with keywords Given, When and Then.

Given describes or sets the context of the scenario under stated environment. The best practice is to check the system state. Its like prerequisite for the given scenario.

When describes the state change parameters. Like user actions to move the system from one state to another state.

Then describes the consequence or result caused by the state change. Its like if when is the cause Then is the effect.

And is key word will be used to add multiple whens or multiple Thens.

But is used in the same context as then and mostly used for negative testing.

Here is how a scenario looks like.scenario example

The tag @Basicoperations is like category of the test.

Scenario Outline can contain multiple examples, It is always better to write as Scenario Outline instead of just scenario so that we can specifically mention the parameters and looping of the test data is also possible.

We have several ways of writing the same scenario. Its better to write the scenario as re-usable blocks so that the steps can be re-used.

Let us take another example to see how we can re-use the same steps.

In the below scenarios same steps are used as above scenario and just the operation is being changed.

bdd2

Let us look at @Advancedoperation description and figure out how we can write the detailed re-usable steps for more advanced operations.

advanced

In the above we can see multiple and statements and some of the “And” statements are similar. The above scenario enters data in below form. the multiple And statements enter the values in the respective text boxes.

form

This is very small example of how we can write BDD tests, I will try to explain how this can be implemented in next blog.