A.H. Sarkar
A.H. Sarkar

Reputation: 19

PhantomJS doesn't compile JavaScript scripts with class definitions

OK I am new to PhantomJS and the whole headless browsing thing. I'm using Selenium and PhantomJS to test my website. The site is built on C# using .NET MVC. PhantomJS can't seem to compile any JS scripts that contain class definitions.

The Index.cshtml contains references to only two scripts:

@section scripts {

    <script src="~/Scripts/foo.js"></script>
    <script src="~/Scripts/bar.js"></script>
}

The contents of foo.js are:

function add(a, b) {
    console.log("this works...")
    return a + b;
}

class Polygon {
    constructor(height, width) {
        this.height = height;
        this.width = width;
    }
}

the contents of bar.js are:

console.log("1 + 2 = ", add(1, 2));

I'm playing with Selenium using F#'s REPL. The code to navigate to the page is:

    let driver = new OpenQA.Selenium.PhantomJS.PhantomJSDriver(@"C:\pathToPhantomJS\");
    let url = "http://myLocalHost:12345/home/index"

    driver.Navigate().GoToUrl(url)
    let logs = driver.Manage().Logs.GetLog(OpenQA.Selenium.LogType.Browser) 
    logs |> Seq.iter (fun l -> printf "%s\n" l.Message)

When I try to hit the index.cshtml page using PhantomJS, I get the following error:

[ERROR - 2016-07-04T21:19:44.274Z] Session [f2c46410-422c-11e6-881e-555d71de793e] - page.onError - msg: ReferenceError: Can't find variable: add

phantomjs://platform/console++.js:263 in error [ERROR - 2016-07-04T21:19:44.275Z] Session [f2c46410-422c-11e6-881e-555d71de793e] - page.onError - stack:
global code (http://localhost:56135/Scripts/bar.js:1)

phantomjs://platform/console++.js:263 in error

The error appears as soon as I execute the first line (Navigate). But as soon as I remove the class definition (of Polygon) from foo.js, everything is hunky-dory:

this works...

1 + 2 = 3

There is no issue with this in Chrome/Firefox. I've searched everywhere and the only thing I can find that comes close to this problem is the whole "jailed execution" / "sandbox" thing with page.evaluate() (see here). But I'm obviously not using any page.evaluate() here, and also because the scripts are referenced in order in the mark-up, the browser SHOULD be able to pick up the definitions. In fact, it does do exactly that, it only seems to break when including a class definition.

If it helps I'm running Windows 10 and version 2.1.1 of PhantomJS. I get the same issue when running PhantomJS from the Window's command prompt, so I don't think this is a Selenium issue.

Can anyone please help with this?

Thanks!

Upvotes: 1

Views: 726

Answers (1)

A.H. Sarkar
A.H. Sarkar

Reputation: 19

Turns out this is an issue with PhantomJS support for ECMA6; I'm using TypeScript and compiling it into ECMA6, which was working for Chrome/Firefox, but isn't supported for PhantomJS yet.

Upvotes: 1

Related Questions