How to customize Selenium test error/fail message - visual-studio-2012

I'm using VS2012 and i want to customize my selenium tests.
For example, when test fails, i want to show the text The page loaded too long - unable to login + original message instead of showing only this: OpenQA.Selenium.NoSuchElementException: Unable to find element with id == loginElementID. Is it possible? How and when to use Assertions when UI testing?
That would make my tests more understandable and informative.
var wait = new WebDriverWait(driver, new TimeSpan(0, 0, 0, 8));
wait.Message = "Page Loaded too long";
Or how to show wait.Message when test fails ?

Depending on what you are trying to achieve there are at least two ways of doing it (and probably more).
Use try..catch statement. Catch NoSuchElementException and throw new one with your own message. One way of doing it would be wrapping WebDriver with your own class and then wrapping each method (findBy, get) with try..catch.
Use EventFiringWebDriver with WebDriverEventListener and implement proper logging in onError method.

Related

Random failure of selenium test on test server

I'm working on a project which uses nodejs and nighwatch for test automation. The problem here is that the tests are not reliable and give lots of false positives. I did everything to make them stable and still getting the errors. I went through some blogs like https://bocoup.com/blog/a-day-at-the-races and did some code refactoring. Did anyone have some suggestions to solve this issue. At this moment I have two options, either I rewrite the code in Java(removing nodejs and nightwatch from solution as I'm far more comfortable in Java then Javascript. Most of the time, struggle with the non blocking nature of Javascript) or taking snapshots/reviewing app logs/run one test at a time.
Test environment :-
Server -Linux
Display - Framebuffer
Total VM's -9 with selenium nodes running the tests in parallel.
Browser - Chrome
Type of errors which I get is element not found. Most of the time the tests fail as soon the page is loaded. I have already set 80 seconds for timeout so time can't be issue. The tests are running in parallel but on separate VM's so I don't know whether it can be issue or not.
Edit 1: -
Was working on this to know the root cause. I did following things to eliminate random fails: -
a. Added --suiteRetries to retry the failed cases.
b. Went through the error screenshot and DOM source. Everything seems fine.
c. Replaced the browser.pause with explicit waits
Also while debugging I observed one problem, maybe that is the issue which is causing random failures. Here's the code snippet
for (var i = 0; i < apiResponse.data.length; i++) {
var name = apiResponse.data[i];
browser.useXpath().waitForElementVisible(pageObject.getDynamicElement("#topicTextLabel", name.trim()), 5000, false);
browser.useCss().assert.containsText(
pageObject.getDynamicElement("#topicText", i + 1),
name.trim(),
util.format(issueCats.WRONG_DATA)
);
}
I added the xpath check to validate if i'm waiting enough for that text to appear. I observed that visible assertion is getting passed but in next assertion the #topicText is coming as previous value or null.This is an intermittent issue but on test server happens frequently.
There is no magic bullet to brittle UI end to end tests. In the ideal world there would be an option set avoid_random_failures=true that would quickly and easily solve the problem, but for now it's only a dream.
Simple rewriting all tests in Java will not solve the problem, but if you feel better in java, then I would definitely go in that direction.
As you already know from this article Avoiding random failures in Selenium UI tests there are 3 commonly used avoidance techniques for race conditions in UI tests:
using constant sleep
using WebDriver's "implicit wait" parameter
using explicit waits (WebDriverWait + ExpectedConditions + FluentWait)
These techniques are also briefly mentioned on WebDriver: Advanced Usage, you can also read about them here: Tips to Avoid Brittle UI Tests
Methods 1 and 2 are generally not recommended, they have drawbaks, they can work well on simple HTML pages, but they are not 100% realiable on AJAX pages, and they slow down the tests. The best one is #3 - explicit waits.
In order to use technique #3 (explicit waits) You need to familiarize yourself and be comfortable with the following WebDriver tools (I point to theirs java versions, but they have their counterparts in other languages):
WebDriverWait class
ExpectedConditions class
FluentWait - used very rarely, but very usefull in some difficult cases
ExpectedConditions has many predefinied wait states, the most used (in my experience) is ExpectedConditions#elementToBeClickable which waits until an element is visible and enabled such that you can click it.
How to use it - an example: say you open a page with a form which contains several fields to which you want to enter data. Usually it is enought to wait until the first field appears on the page and it will be editable (clickable):
By field1 = By.xpath("//div//input[.......]");
By field2 = By.id("some_id");
By field3 = By.name("some_name");
By buttonOk = By.xpath("//input[ text() = 'OK' ]");
....
....
WebDriwerWait wait = new WebDriverWait( driver, 60 ); // wait max 60 seconds
// wait max 60 seconds until element is visible and enabled such that you can click it
// if you can click it, that means it is editable
wait.until( ExpectedConditions.elementToBeClickable( field1 ) ).sendKeys("some data" );
driver.findElement( field2 ).sendKeys( "other data" );
driver.findElement( field3 ).sendKeys( "name" );
....
wait.until( ExpectedConditions.elementToBeClickable( buttonOK)).click();
The above code waits until field1 becomes editable after the page is loaded and rendered - but no longer, exactly as long as it is neccesarry. If the element will not be visible and editable after 60 seconds, then test will fail with TimeoutException.
Usually it's only necessary to wait for the first field on the page, if it becomes active, then the others also will be.

#material material-component-web Invalid tab component given as activeTab

firstly let my say that the mdc documentation is difficult for non-pros like me.
I'm using Elixir Phoenix and Brunch.
I import and everything is fine.
import {MDCTab, MDCTabFoundation} from '#material/tabs'; import
{MDCTabBar, MDCTabBarFoundation} from '#material/tabs'; import
{MDCTabBarScroller, MDCTabBarScrollerFoundation} from
'#material/tabs';
I manually instantiate the tab bar in a separate function that I export
export var Tabbable = {
run: function(MDCTabBar, el){
var myDynamicTabBar = window.myDynamicTabBar = new MDCTabBar(document.querySelector('#' + el));
Which is following the documentation like this
const tabBar = new MDCTabBar(document.querySelector('#my-mdc-tab-bar'));
but is slightly different to the documentation's use of the tab bar in their code snippet
var dynamicTabBar = window.dynamicTabBar = new mdc.tabs.MDCTabBar(document.querySelector('#dynamic-tab-bar'));
But, whenever I try to use mdc I get a 'not defined' error. Therefore, I'm not using it :-)
Now, when the user clicks the tab bar I capture that like this:
myDynamicTabBar.listen('MDCTabBar:change', function ({detail: tabs}) {
var nthChildIndex = tabs.activeTabIndex;
updatePanel(nthChildIndex);
});
The subtle difference is that my myDynamicTabBar is MDCTabBar but the documentation's dynamicTabBar is mdc.tabs.MDCTabBar
My tab control works, but it throws an error only visible in the console:
Uncaught Error: Invalid tab component given as activeTab: Tab not
found within this component's tab list
which is likely because I'm not using mdc.tabs? The documentation notes the change event happens on the MDCTabBar.
Therefore, how do I get rid of this annoying error in the console?
And why can I not access the global mdc? I have tried this in my Brunch file
globals: { mdc: "#material"}
But no good.
I'm right behind you on this! I'm frustrated with the docs too :(
You answered your own question in this Elixir thread which is very informative.
I found the real solution in this thread https://github.com/hyperapp/hyperapp/issues/546
MDCTabBar automatically initiates its children. So initiating tabs will result in that error.
The fix is to just initiate MDCTabBar

webdriver-sync running asynchronously?

I'm trying to create selenium tests that run each step synchronously, without using .then(), or async/await. The reason for this is that I want to create a set of functions that allow pretty much anyone on our test team, almost regardless of tech skills to write easy to read automated tests. It looks to me like webdriver-sync should give me exactly what I want. However, the following dummy code is producing problems:
var wd = require('webdriver-sync');
var By = wd.By;
var Chromedriver = wd.Chromedriver;
var driver = new Chromedriver;
driver.get('https://my.test.url');
var myButton = driver.findElement(By.cssSelector('[id*=CLICK_ME]'));
myButton.click();
It tries to run - browser is launched, and page starts to load... but the steps are not executed synchronously - it goes on and tries to find and click "myButton" before the page has finished loading, throwing a "no such element" error... which to me kinda defeats the point of webdriver-sync?! Can someone tell me where I am going wrong?
FWIW, I have webdriver-sync 1.0.0, node v7.10.0, java 1.8.0_74, all running on CentOS 7.
Thanks in advance!
You need to put double-quotes around "CLICK_ME" as it's a string value.
Generally, though, it's a good idea to Wait for specific elements because dynamic pages are often "ready" before all their elements have been created.

nightwatch - check for popup window, after each click event

Is there a way in nightwatch to check whether a popup window appears after each click event?
I have a problem that randomly an error message appear and I don't want to write for each click event the same callback function.
I have already tried out the after and afterEach commands in the Global.js but then the commands will only run after the whole test suite.
I also have tried it local within a test file, although it also does not cover all single click events, even though the official website writes "... while beforeEach and afterEach are ran before and after each testcase (test step)"?
Solution I'm looking for:
.waitForElementVisible('selector')
.click('selector')
.click('selector')
Solution I have come up with so far:
.waitForElementVisible('selector')
.click('selector', isPresent)
.click('selector', isPresent)
isPresent as a callback function, which does the checking and close the popup window if it appears.
Is there another way to write a function (with or without after and/or forEach), so that it will be called after each click event or after each command. Thus, I don't have to write the isPresent repetitive code?
You can insert something like this in your page object file:
var popupCommand = {
popupCheck:function(){
return this.waitForElementVisible('selector', 5000)
.click('selector', isPresent)
.click('selector', isPresent)
},
module.exports = {
commands:[popupCommand],
elements:{
firstElement: {selector: 'xpath',locateStrategy: 'xpath'},
secondElement: {selector: 'css'},
}
}
Where 'popupCommand' will be the name of your page object file, for example 'Popup'. And also you will have to insert your isPresent callback function here so you can use it.
I did my best to explain you as much as possible what and how to do that :)
you should yse .switchWindow() method.
Why don't you write your own custom command specific for that case, so that way you will avoid repetitive code?

Identifying an element in Visual Studio UI coded test

I'm trying to set up a coded UI test to allow me to check for an error message on a login. The test runs, but I'm struggling to get the assert to work.
The response that comes back is nested as follows:-
<div class='ui-errors'>
<ul>
<li>Your password is invalid</li>
</ul>
</div>
What do I need to set up to check the first li in the div of that class in an assert?
Coded UI can capture DIV. In the following code I've created a custom DIV object from your provided example. AdrianHHH's answer will definitely get you information you need to insert in to my example.
var error = new HtmlDiv(new Parent(RootParentWindow));
error.SearchProperties.Add("Class", "ui-errors");
var errors = error.FindMatchingControls();
foreach (var item in errors)
{
Assert.IsTrue(item.GetProperty("InnerText").ToString().Contains("Your password is invalid"));
}
Coded UI does not really look at DIVs or ULs etc. Coded UI looks at what is drawn on the display. I suggest you use the Coded UI cross-hair tool to examine the error message then add an assertion to check for the message. You might also examine the same area of the screen for a test which passes to see how they differ.
If you are hand coding your test rather than letting Coded UI generate the code for you, I recommend creating a sandbox project and recording the assertion into that. Then copy the useful ideas from the generated code into your own test code.
If you can get a sample of the page where the assertion is needed I could create it for you, otherwise do what AdrianHHH said.
In case you don't know when you use the assertion tool, all the options you get are different ways to assert that particular control, eg you could assert if it exists or if the inner text is equal etc.
yonitdm answer will solve your problem, but as per your words, "first li in the div of that class" try below.
// Find Error Div
var errorDiv = new HtmlDiv(new Parent(RootParentWindow));
errorDiv.SearchProperties.Add("Class", "ui-errors");
errorDiv.Find();
// Get UL - First item in div
var errorUL = errorDiv.GetChildren().First(); // or GetChildren()[0]
// Get all LIs and take first item
var firstLI = errorDiv.GetChildren().First(); // or GetChildren()[0]
Assert.IsTrue(firstLI.GetProperty("InnerText").ToString().Contains("Your password is invalid"));

Resources