首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >PhantomCSS -无法从DOM调用函数

PhantomCSS -无法从DOM调用函数
EN

Stack Overflow用户
提问于 2016-12-02 10:37:35
回答 1查看 45关注 0票数 0

我正在尝试调用moveNext函数,该函数已经存在于页面中。此函数通过传递值作为参数(例如:moveNext(2) )帮助导航到特定的页面。我想捕捉截图从第一页到最后一页。但是,当我在终端casperjs test testsuite.js中运行这个命令时,它只捕捉到第一个页面的10个屏幕快照,而不是每个页面的每个屏幕截图。

代码语言:javascript
复制
casper.start('https://example.com');

    function captureScreenshot(width, height, device, startPage, lastPage){
        casper.viewport(width, height);

        var currentPage;

        casper.then(function () {
            for (currentPage = startPage; currentPage < lastPage; currentPage++) {
                phantomcss.screenshot('html', 'screenshot');
                this.page.evaluate(function() {
                    console.log(currentPage);
                    moveNext(currentPage + 1);
                });
            }
        });

        casper.then(function now_check_the_screenshots() {
            // compare screenshots
            //phantomcss.compareAll();
            for (var i= 0; i < 10; i++) {
                phantomcss.compareExplicit(['/screenshot/layout/'+ device +'/screenshot-'+ i +'.jpg', '/screenshot/build/'+ device +'/screenshot-'+ i +'.png']);
                phantomcss.compareExplicit(['/screenshot/layout/'+ device +'/screenshot-'+ i +'.jpg', '/screenshot/build/'+ device +'/screenshot-'+ i +'.png']);    
            }
        });
    }

    /* Capture screenshot for desktop and compare them */
    captureScreenshot(1920, 1080, 'desktop', 0, 10);

    /* Capture screenshot for mobile and compare them */
    //captureScreenshot(375, 667, 'mobile');

    /* Casper runs tests */
    casper.run(function () {
        console.log('\nTHE END.');
        // phantomcss.getExitStatus() // pass or fail?
        casper.test.done();
    });

更新:

添加casper.on("page.error/error");后,我将得到以下错误:

代码语言:javascript
复制
FAIL addListener only takes instances of Function
#    type: uncaughtError
#    file: testsuite.js:118
#    error: addListener only takes instances of Function
#           addListener@phantomjs://platform/events.js:118:74
#           phantomjs://code/testsuite.js:66:13
#           runStep@phantomjs://platform/casper.js:1577:31
#           checkStep@phantomjs://platform/casper.js:404:28
#    stack: not provided
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-12-21 09:59:49

代码语言:javascript
复制
casper.start('https://example.com');

    function captureScreenshot(width, height, device, startPage, lastPage) {
        casper.viewport(width, height);

        casper.then(function () {
            var currentPage = startPage - 1;

            /* Capture screenshot of footer */
            phantomcss.screenshot('footer', 'footer');

            /* Capture screenshot of header */
            phantomcss.screenshot('header', 'header');

            /* Capture main content screenshot */
            casper.repeat(lastPage, function () {
                this.page.evaluate(function (currentPage) {
                    moveNext(currentPage);
                }, ++currentPage);

                this.wait(8000, function () {
                    phantomcss.screenshot('#NavForm > .container', 'main-content');
                });
            });
        });

        casper.on('remote.message', function (msg) {
            this.echo(msg);
        })

        casper.on('error', function (err) {
            this.die("PhantomJS has errored: " + err);
        });

        casper.on('resource.error', function (err) {
            casper.log('Resource load error: ' + err, 'warning');
        });

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

        casper.then(function now_check_the_screenshots() {
            // compare screenshots
            //phantomcss.compareAll();
            for (var i = 0; i < 10; i++) {
                phantomcss.compareExplicit(['/screenshot/layout/' + device + '/screenshot_' + i + '.jpg', '/screenshot/build/' + device + '/screenshot_' + i + '.png']);
                phantomcss.compareExplicit(['/screenshot/layout/' + device + '/screenshot_' + i + '.jpg', '/screenshot/build/' + device + '/screenshot_' + i + '.png']);
            }
        });
    }

    /* Capture screenshot for desktop and compare them */
    captureScreenshot(960, 5000, 'desktop', 10, 17);
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/40930186

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档