GithubHelp home page GithubHelp logo

nigel84 / ngwebdriver Goto Github PK

View Code? Open in Web Editor NEW

This project forked from paul-hammant/ngwebdriver

0.0 2.0 0.0 510 KB

AngularJS and WebDriver bits and pieces for Java

License: MIT License

Shell 0.14% Java 50.06% JavaScript 37.83% HTML 10.93% CSS 1.04%

ngwebdriver's Introduction

ngWebDriver

A small library of WebDriver locators and more for AngularJS (v1.x) and Angular (v2.x +), for Java.

Status

We have taken JavaScript from Angular's Protractor project. While ngWebDriver perfectly compliments the Java version of WebDriver, it has to pass JavaScript up to the browser to interoperate with Angular, and the Protractor project has done the hard work (including testing) to make that solid. This project benefits from that work.

You can use ngWebDriver today with the regular Java Selenium2/WebDriver libraries. You can also use it with FluentSelenium for extra terseness.

Compatibility

Like Protractor, ngWebDriver works with Angular versions greater than 1.0.6/1.1.4, and is compatible with Angular 2 applications. Note that for Angular 2 apps, the binding and model locators are not supported. We recommend using by.css.

Waiting for Angular to finish async activity

new NgWebDriver(driver).waitForAngularRequestsToFinish();

Do this if WebDriver can possibly run ahead of Angular's ability finish it's MVC stuff in your application.

Locators

repeater()

As Protractor's repeater locator

ByAngular.repeater("foo in f")
ByAngular.repeater("foo in f").row(17)
ByAngular.repeater("foo in f").row(17).column("foo.name")
ByAngular.repeater("foo in f").column("foo.name")

exactRepeater()

As Protractor's exactRepeater

ByAngular.exactRepeater("foo in foos")
ByAngular.exactRepeater("foo in foos").row(17)
ByAngular.exactRepeater("foo in foos").row(17).column("foo.name")
ByAngular.exactRepeater("foo in foos").column("foo.name")

binding()

As Protractor's binding locator

ByAngular.binding("person.name")
ByAngular.binding("{{person.name}}")
// You can also use a substring for a partial match
ByAngular.binding("person");

exactBinding()

As Protractor's exactBinding locator

ByAngular.exactBinding("person.name")
ByAngular.exactBinding("{{person.name}}")

model()

As Protractor's model locator

ByAngular.model('person.name')

options()

As Protractor's options locator

ByAngular.options("c for c in colors")

buttonText()

As Protractor's buttonText locator

ByAngular.buttonText("cLiCk mE")

partialButtonText()

As Protractor's partialButtonText locator

// If you have a button name "Click me to open", using just "click" would do if you partialButtonText
ByAngular.partialButtonText("cLiCk ")

cssContainingText()

As Protractor's cssContainingText locator

ByAngular.cssContainingText("#animals ul .pet", "dog")

Angular model interop

As with Protractor, you can change items in an Angular model, or retrieve them reagrdless of whether they appear in the UI or not.

Changing model variables

NgWebDriver ngWebDriver = new NgWebDriver(driver);
// change something via the model defined in $scope
ngWebDriver.mutate(formElement, "person.name", "'Wilma'");
// Note Wilma wrapped in single-quotes as it has to be a valid JavaScript
// string literal when it arrives browser-side for execution

Getting model variables

As a JSON string:

NgWebDriver ngWebDriver = new NgWebDriver(driver);
// Get something via the model defined in $scope
String personJson = ngWebDriver.retrieveJson(formElement, "person");

As a string:

NgWebDriver ngWebDriver = new NgWebDriver(driver);
// Get something via the model defined in $scope
String personName = ngWebDriver.retrieveAsString(formElement, "person.name");

As a number:

NgWebDriver ngWebDriver = new NgWebDriver(driver);
// Get something via the model defined in $scope
Long personAge = ngWebDriver.retrieveAsLong(formElement, "person.age");

As Map/dict:

NgWebDriver ngWebDriver = new NgWebDriver(driver);
// Get something via the model defined in $scope
Map person = (Map) ngWebDriver.retrieve(formElement, "person");
// note - could be List instead of a Map - WebDriver makes a late decision on that

Helping NgWebDriver find Angular apps in a page

Perhaps a different selector should be used to find Angular apps:

NgWebDriver ngwd = new NgWebDriver(javascriptExecutor).withRootSelector("something-custom");

ByAngular.Factory factory = ngwd.makeByAngularFactory()

factory.exactRepeater("day in days");

// locators
ByAngular.withRootSelector("something-custom").exactRepeater("day in days");

// or
ByAngular.Factory baf = ByAngular.withRootSelector("something-custom");
ByAngularRepeater foo = baf.exactRepeater("day in days");

Alternate selectors

Referring to a handy StackOverflow questions - No injector found for element argument to getTestability, you can use any selector:

  • '[ng-app]'- matching an element that has the arribute ng-app (this is the default)
  • '#my-app' - matching an id my-app
  • '[fooBar]' - matching an attribute fooBar on any element

Other Functions

getLocationAbsUrl()

Returns the URL of the page.

String absoluteUrl = new NgWebDriver(driver).getLocationAbsUrl();

Code Examples

All our usage examples are in a single test class:

Including it in your project

Maven

<dependency>
  <groupId>com.paulhammant</groupId>
  <artifactId>ngwebdriver</artifactId>
  <version>0.9.6</version>
  <scope>test</scope>
</dependency>

<!-- you still need to have a dependency for preferred version of
  Selenium/WebDriver. That should be 2.48.2 or above -->

Non-Maven

Download from Mavens Central Repo

Releases

Last Release: 1.0 - Jan 21, 2017

Refer CHANGELOG

ngwebdriver's People

Contributors

paul-hammant avatar manoj9788 avatar d-rk avatar elgalu avatar samoretc avatar

Watchers

James Cloos avatar Nigel avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.