Reading JavaScript variables using Selenium WebDriver

Question

I'm using Selenium WebDriver (Java) and TestNG to do some testing on a website I created. In this website, I also have JavaScript and in some of the functions, it returns values and also outputs values to the browser console through console.log().

I was wondering if there is an easy way for Selenium WebDriver to access some of this JavaScript information so I can perform assertions using TestNG.

I'm quite new to Selenium but I understand that you can do something like:

WebDriver driver = new ChromeDriver(); driver.findElement(By.id("btn")).click(); 

So is there anything similar I can do using WebDriver to read the JavaScript on the site?

---

Clarification

It looks like people are making the assumption that I'm trying to "execute" JavaScript code through Selenium.

Thats not the case. Instead, I'm trying to store already-defined JavaScript variable using Selenium.

Basically, I want Selenium to be able to grab the JavaScript variable's value, store it locally, and then do an assertion test on it.

---

Attempt 1

Say I have the following JS code for my website:

$(document).ready(function() {     var foo = $(#"input-field-val").val();      function returnFoo() {         return foo;     } }); 

From what I've reading and understanding, in my seperate Selenium test file (Selenium.java), I should be able to do something like this?:

public class Selenium {     WebDriver driver = new FirefoxDriver();     JavascriptExecutor js = (JavascriptExecutor) driver;      @Test     public void testSample() {         driver.get("www.mywebsite.com");         js.executeScript("alert(returnFoo());");     } } 

I do something similar to what's above but no alert box pops up. Instead, I get an error message:

Exception in thread "main" org.openqa.selenium.WebDriverException: ReferenceError: returnFoo is not defined 

I'm pretty sure I'm not understanding what it means when its said that the JS variable

should not be part of a closure or local variable

I have also tried defining a global variable above the $(document).ready(function()... and setting is within function returnFoo() but still doesn't work.

---

Attempt 2

I've moved both foo and returnFoo() outside of the $(document).ready(function().... That has fixed ReferenceError message that I was getting in Attempt 1 above.

I hav also given foo a value so my JS code looks something like this:

var foo = "Selenium test run";  $(document).ready(function() { ... });  function returnFoo() {     return foo; } 

Now, I'm having a tough time assigning the return of returnFoo() to a local variable within my Selenium test. Here's what I've attempted:

public static void main(String[] args) {         WebDriver driver = new FirefoxDriver();         JavascriptExecutor js = (JavascriptExecutor) driver;          driver.get("http://localhost:8080/HTML5TestApp/prod.html");         Object val = js.executeScript("window.returnFoo();");         System.out.println(val);     }  

But the console display null instead of the actual value of "Selenium test run".

Attempt 2 - SOLUTION

It looks like if I do Object val = js.executeScript("alert(returnFoo());"); I get the value of foo.

---

SOLUTION

So here's the solution I've come up w/ to my problem thanks to the solution by Martin Foot below.

In my JavaScript file, I created a var and a setter/getter function like so:

index.js

var seleniumGlobal;  $(document).ready(function() { ... )};  function setSG(toSet) {     seleniumGlobal = toSet; }  function getSG() {     return seleniumGlobal; } 

SampleTest.java

// Do all the necessary imports  public class SampleTest {     WebDriver driver = new FirefoxDriver();     JavascriptExecutor js = (JavascriptExecutor) driver;      @Test     public void testPrintVal() {         String sgVal = (String) js.executeScript("alert(getSG());");         Assert.assertEquals("new value for seleniumGlobal", sgVal);     } } 

So whenever some code in my JavaScript sets my seleniumGlobal variable through the setter method, I can call it through my Selenium test and do assertions on it.

This is probably not the most efficient way to do but if someone else has a better solution, please let me know.

Answer 1

All you have to do is:

Object val = js.executeScript("return returnFoo();"); 

That will give you what you are looking for.