JSFiddle - React, Tailwind, and code Playground

JavaScript

var options = {
    //verbose: true,
    //logLevel: 'debug',
    //exitOnError: false,
    pageSettings: {
        loadImages: false,

        // 1.浏览器
        userAgent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 7_0 like Mac OS X; en-us) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11A465 Safari/9537.53'
    },

    // 2.浏览器窗口大小
    viewportSize: {
        width: 320,
        height: 568
    }
};

casper.options.pageSettings = casper.options.pageSettings || options.pageSettings;
casper.options.pageSettings.loadImages = options.pageSettings.loadImages;
casper.options.pageSettings.userAgent = options.pageSettings.userAgent;

casper.options.viewportSize = options.viewportSize;

casper.test.begin('test demo', 0, function (test) {

    casper.start();

    casper.thenOpen('http://www.baidu.com/', function () {
        
        // 测试页面title是否正确
        casper.test.assertTitle('百度一下', 'page title');

        // 测试logo的位置信息

        // 获取x/y/width/height
        var layout = casper.getElementBounds('#logo');
        layout = JSON.stringify(layout);
        
        // 验证是否符合
        casper.test.assertEquals(layout, '{"height":87,"left":0,"top":53,"width":320}', 'logo\'s boundary');

    });

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

});