Automate Ember.js application using Selenium when object properties are changed at run-time

Question

I am trying to automate an Ember.js application using Selenium+TestNg.

The drop-down in the application has only one object property id. However every time i refresh the

Answer 1

This is a known issue with Ember. We work with lots of third party applications to integrate with them so we do a lot of automated testing using selenium, when they use ember we hit this issue which means we cannot test the code as well as we can with other partners. I'm sure there are good reasons to use Ember but being able to test it easily with Selenium isn't one of them. There was a bug opened on this in ember but it got closed.

https://github.com/emberjs/ember.js/issues/11834

Until ember fix this my recommendation would be to use a different JS framework that's built to be tested by third parties using something other than JS and or the framework itself.

Answer 2

As the desired element is EmberJS enabled element so some of the attributes e.g. id will be dynamically generated. As an example, ember371, ember382, ember393, etc. In these cases you won't be able to use the full value of the id attribute to locate the element. As an example, consider the following element:

<input placeholder="" id="ember32" class="ssRegistrationField ssEmailTextboxField ember-text-field ember-view" type="email">

The value of the value of the id attribute will keep changing dynamically, everytime you access the AUT(Application Under Test). Hence to locate the element, the solution is to construct dynamic Locator Strategies inducing WebDriverWait inconjunction with ExpectedConditions as visibilityOfElementLocated() as follows:

• cssSelector:

  WebElement element = new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("input.ssRegistrationField.ssEmailTextboxField.ember-text-field.ember-view[id^='ember']")));
  

• xpath:

  WebElement element = new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//input[starts-with(@id, 'ember') and @class='ssRegistrationField ssEmailTextboxField ember-text-field ember-view']")));