< Previous | Front page | Next >
Skip to end of metadata
Go to start of metadata

In testing of complex examples, it is often needed to perform custom JavaScript code. For this purposes, there is implemented JavaScript interface mechanism providing you a mapping of Java interfaces on JavaScript objects.

Basic Usage


First, you need to create a file containing a needed JavaScript code. The code has to create an object and store it to a global scoped variable (e.g. window object property) and the file has to be available on the test classpath. Here is an example of such file:


Now you can create a Java interface:

  • @JavaScript defines a JavaScript object used for mapping, window.helloworld and helloworld represent the same object in this context.
  • @Depedency defines dependencies on files containg JavaScript code. In this case we want to ensure that the helloworld.js file is loaded to the page.
    • source files are resolved from the test classpath, so in a Maven project, you want to put those in src/test/resources/helloworld.js
    • The @Dependency is indeed optional, you can map the objects from the application under test JavaScript objects.

Construction and Usage

To use your JavaScript interface put an attribute annotated by @JavaScript annotation to your test class:

Default getters and setters

JS interfaces functionality is often used for retrieving custom values of custom JavaScript objects. Therefore, there is a reasonable default in the form of getters and setters methods implemented for you.

That is why you can do just following in order to retrieve the someVariable value:


No need to implement get/set in the JavaScript code. Graphene will do it automatically.

More Advanced Stuff

You may need to execute some code after the JavaScript file is loaded to the page. Just place it into the install() method of your JavaScript object and extend InstallableJavaScript in your Java interface. Also you can define  dependencies on other interfaces. Graphene ensures the install() method is invoked and all dependencies are loaded before you invoke a method of your interface.

Graphene uses Page Extensions to install needed dependencies for your @JavaScript interface before each method invocation. Before the installation is processed, it checks whether the object used for mapping is defined. If so, the installation is skipped. It means if you use (for example) document object for your mapping, dependencies won't be installed (including sources).
When a page is reloaded, all installed JavaScript code is dropped and installed again if needed. It means the state of JavaScript objects is not preserved.


If you are not satisfied with installation via Page Extensions, you can implement your own ExecutionResolver containing the following method:

Don't forget to reference it in your @JavaScript interfeaces:

Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.
  1. Jan 09, 2017

    Don't forget to reference it in your @JavaScript interfeaces


    My JS code may not be the best, but that's no reason to speak of it this way :[