javascript - Responsive design testing with PhantomJS - Stack Overflow

admin管理员组

文章数量:1431783

I have a javascript application (RequireJS with Backbone ) which I am testing using PhantomJS with Jasmine. After much pain I finally have simple tests running. I am using a test runner based on the one found here run-jasmine.js.

My application is responsive in that as the viewport width changes, the widths of various DOM elements will also change. I am aware that I can set the viewport width in 'run-jasmine.js' when I create the 'page' for testing. What I would like to know is.....Are you able to somehow loop through a series of viewport widths in a single test suite. Using 'run-jasmine.js' it seems that the 'page' is set up and then the tests are run and once you are running the tests you have no access from the test code to set the viewport width to a new value.

If there is anyone out there who has experience of doing this I would be interested to know if the 'page' object is in some way accessible from the test code so that I can cycle through different viewport widths and test for the presence / absence / dimensions of various DOM elements.

Thanks for looking and any advice.

I have a javascript application (RequireJS with Backbone ) which I am testing using PhantomJS with Jasmine. After much pain I finally have simple tests running. I am using a test runner based on the one found here run-jasmine.js.

My application is responsive in that as the viewport width changes, the widths of various DOM elements will also change. I am aware that I can set the viewport width in 'run-jasmine.js' when I create the 'page' for testing. What I would like to know is.....Are you able to somehow loop through a series of viewport widths in a single test suite. Using 'run-jasmine.js' it seems that the 'page' is set up and then the tests are run and once you are running the tests you have no access from the test code to set the viewport width to a new value.

If there is anyone out there who has experience of doing this I would be interested to know if the 'page' object is in some way accessible from the test code so that I can cycle through different viewport widths and test for the presence / absence / dimensions of various DOM elements.

Thanks for looking and any advice.

• javascript
• jasmine
• phantomjs

Share Improve this question Follow asked May 28, 2014 at 14:32 so1so1 18511 silver badge99 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

Found a solution. In the test code you can do this:

if (typeof window.callPhantom === 'function') {
    window.callPhantom({ width: 1200 });
}

and in the test runner (run-jasmine.js) code you can do this:

page.onCallback = function(data) {
    page.viewportSize = {width: data.width, height: 400};
};

Hope this is of some use to anyone trying to get tests set up with PhantomJS. Found the documentation for this here

本文标签： javascriptResponsive design testing with PhantomJSStack Overflow