javascript - CasperJSPhantomJS ES6 Promise Polyfill - Stack Overflow

admin管理员组

文章数量:1414903

I am currently working on trying to craft end to end tests using PhantomJS and CasperJS. What I've run into is a situation where PhantomJS lacks promises. Currently our project implements them. The application is only used in Google Chrome which supports promises natively.

While running my tests I receive the error: Error: ReferenceError: Can't find variable: Promise

This seems to be because the current version of Webkit in PhantomJS doesn't have support for promises. I realize that SlimerJS does have this support via Gecko however our app runs in Chrome and therefore I would like the tests to occur in Webkit.

What I've been struggling with is injecting a ES6 promise polyfill into Phantom so that the test occurs correctly. I have used both Casper JS's injectjs as well as casper.options.clientScripts.push - both still seem to bring back this lack of support for promises issue.

I've noticed that others stated in CasperJS's github support that they have gotten this to work via polyfill but I'm not sure how they've done this as no examples are provided.

I have included an example of my current script. If anyone has dealt with this issue and found a way to resolve it help would be greatly appreciated. Thank you in advance!

casper.test.begin('Example test loading', 3, function(test) {

    casper.options.clientScripts.push("node_modules/es6-promise/es6-promise.js");

    casper.start('http://localhost:8080/', function() {
        this.captureSelector('stuff.png', 'html');
    });

    casper.on("remote.message", function(msg) {
        this.echo("Console: " + msg);
    });

    casper.on("page.error", function(msg, trace) {
        this.echo("Error: " + msg);
    });

    casper.on("resource.error", function(resourceError) {
        this.echo("ResourceError: " + JSON.stringify(resourceError, undefined, 4));
    });

    casper.on("page.initialized", function(page) {
        page.onResourceTimeout = function(request) {
            console.log('Response Timeout (#' + request.id + '): ' + JSON.stringify(request));
        };
    });

    casper.then(function() {
        test.assertTitle('Example Title', 'Example title is incorrect');
    });

    casper.run(function() {
        test.done();
    });
});

I am currently working on trying to craft end to end tests using PhantomJS and CasperJS. What I've run into is a situation where PhantomJS lacks promises. Currently our project implements them. The application is only used in Google Chrome which supports promises natively.

While running my tests I receive the error: Error: ReferenceError: Can't find variable: Promise

This seems to be because the current version of Webkit in PhantomJS doesn't have support for promises. I realize that SlimerJS does have this support via Gecko however our app runs in Chrome and therefore I would like the tests to occur in Webkit.

What I've been struggling with is injecting a ES6 promise polyfill into Phantom so that the test occurs correctly. I have used both Casper JS's injectjs as well as casper.options.clientScripts.push - both still seem to bring back this lack of support for promises issue.

I've noticed that others stated in CasperJS's github support that they have gotten this to work via polyfill but I'm not sure how they've done this as no examples are provided.

I have included an example of my current script. If anyone has dealt with this issue and found a way to resolve it help would be greatly appreciated. Thank you in advance!

casper.test.begin('Example test loading', 3, function(test) {

    casper.options.clientScripts.push("node_modules/es6-promise/es6-promise.js");

    casper.start('http://localhost:8080/', function() {
        this.captureSelector('stuff.png', 'html');
    });

    casper.on("remote.message", function(msg) {
        this.echo("Console: " + msg);
    });

    casper.on("page.error", function(msg, trace) {
        this.echo("Error: " + msg);
    });

    casper.on("resource.error", function(resourceError) {
        this.echo("ResourceError: " + JSON.stringify(resourceError, undefined, 4));
    });

    casper.on("page.initialized", function(page) {
        page.onResourceTimeout = function(request) {
            console.log('Response Timeout (#' + request.id + '): ' + JSON.stringify(request));
        };
    });

    casper.then(function() {
        test.assertTitle('Example Title', 'Example title is incorrect');
    });

    casper.run(function() {
        test.done();
    });
});

• javascript
• testing
• phantomjs
• ecmascript-6
• casperjs

Share Improve this question Follow asked Apr 13, 2016 at 15:45 Ryan RentfroRyan Rentfro 1,66233 gold badges1616 silver badges1919 bronze badges 2

• 1 clientScripts are probably injected too late into the page for your use case. – Artjom B. Commented Apr 13, 2016 at 18:39
• 1 As a note to anyone else facing this issue - I switched to slimerJS for this project because of this. However phantomJS does have support planned for promises natively and should be released sooner or later. You can review the issue here: github./ariya/phantomjs/issues/14166 - a dev (Vitallium) ments on this about halfway through the issue. – Ryan Rentfro Commented Apr 22, 2016 at 20:27

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

I've stumbled on the same issues of not having proper ES6 support in PhantomJS. I did too attempt to overe the issue by using es6-promise and, like you, still had undefined Promises.

Replacing it by babel-polyfill resolved the issues.

Once you do

npm install --save-dev babel-polyfill

you can replace clientScripts with

casper.options.clientScripts.push("node_modules/babel-polyfill/dist/polyfill.js")

Note: I have not invested time in understanding why there were problems with es6-promise and the only ES6 feature I have in this codebase are Promises, so IMMV.

本文标签： javascriptCasperJSPhantomJS ES6 Promise PolyfillStack Overflow