Comments (6)
I just ran the project with a fresh base and an immediate test,
PhantomCSS found 12 tests, 4 of them failed.
PhantomCSS has created some images that try to show the difference (in the directory ./failures). Fuchsia colored pixels indicate a difference betwen the new and old screenshots.
however there are no failure images in the /failure dir
from phantomcss.
I'd recommend breaking your UI into smaller screenshots, it might help with the performance as well as reduce risk from any dynamic elements on the page. Also, are you naming your screenshots? If not, try it.
- Check that your viewport size is correct for the any media queries you might have
- Your App presumably has asynchronously loaded components/assets, You'll have to add specific waits to ensure these components are fully loaded
I can't help more without seeing the tests.
from phantomcss.
Thanks alot james. Im working on testing partial areas now.
I installed a fresh copy of phantomCSS and ran the test twice, everything looked great. I then dragged over my previous test: https://gist.github.com/basiclaser/0a87534524713be710ae
I ran it once, great. Second time:
PhantomCSS found 12 tests, 4 of them failed.
PhantomCSS has created some images that try to show the difference (in the directory ./failures). Fuchsia colored pixels indicate a difference betwen the new and old screenshots. "
There was no ./failures folder generated.
I then ran the default testsuite.js test again: "PhantomCSS found 16 tests, 4 of them failed." Again, no failure folder created. I'm not sure how the '4 mystery tests' are being mentioned in my test, even if i delete the old screenshots from the testsuite.js test from the screenshots folder.
Sorry if this was too much at once! I really appreciate your time, and your great project.
from phantomcss.
The test looks fine to me. Perhaps the screenshot compare is timing out? I haven't seen this behavior before. Let us know if you figure it out.
from phantomcss.
I got there eventually, just created a new project without running the default tests, it seems to be stable.
What are your thoughts on using classes as selectors for screenshots? I've inherited an enormous project which uses classes exclusively.
I am currently using an array to specify groups of selectors for each page, which appears to be working. It is not mentioned in the docs. is it recommended?
casper.thenOpen('http://0.0.0.0:6543/domain', function (page) {
casper.then(function () {
phantomcss.screenshot(['.row-section-header','.row-section-header', '.row-content-header','.search-bar-wrapper','.domain-section-info-boxes','.domain-section-info-offers']);
});
});
The test says its taking new screenshots every time the test is run, and misreports failures, but still works by either generating a failure folder or not. It also says no tests were performed, but i guess thats because im not relying on the normal test syntax.
If i could get your thoughts on these individual issues, that would be amazing. Thanks!
from phantomcss.
That's not supported, try this:
phantomcss.screenshot({
'Screenshot 1 File name': '#screenshot1',
'Screenshot 2 File name': '#screenshot2'
});
Using classnames is fine, but I advice not using classes that are already in use for styling, you'll be coupling your tests to CSS implementation which is a bad idea.
from phantomcss.
Related Issues (20)
- can phantomcss able to club the original image , diff image and failure image in one single image? HOT 4
- Screenshot fails on container of floated elements HOT 1
- When page has asynchronously content following error occures. HOT 1
- Unable to capture screenshot greater than screen height HOT 1
- Page is not loading properly some components are missing while taking the screenshots HOT 4
- Says test failed, but failure folder is not created. HOT 1
- xunit testcase name inconsistent and not inherited from casperjs HOT 4
- TypeError: undefined is not an object (evaluating 'fileData.data') HOT 2
- PhantomJS fails with TypeError HOT 1
- Add more usage examples HOT 1
- Running PhantonCSS test after javascipt run on the page. HOT 1
- screenshot passes on if selector is missing HOT 2
- PhantomCSS is moving the HTML elements around HOT 1
- duplicate baseline image HOT 1
- Is the phantomjs not working on an app that is using angular ui-view HOT 6
- [email protected] requires a peer of canvas@^1.6.5 but none was installed HOT 3
- Do I need python for this? HOT 1
- Bug scroll bottom on fail screenshot HOT 3
- Support for the https pages HOT 1
- Create screenshots without test number at the end HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from phantomcss.