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

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:

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']")));