Take the 2-minute tour ×
Software Quality Assurance & Testing Stack Exchange is a question and answer site for software quality control experts, automation engineers, and software testers. It's 100% free, no registration required.
  • is that a feasible idea?
  • what tools do you use?
  • what do you call this kind of testing?
share|improve this question
    
How do you want to test the CSS? Do you mean validate against a W3C validator or do you mean does it display and render correctly? –  terryp May 4 '11 at 11:18
    
@terryp: the later, unit testing application of css, cross-browser support,styles assert etc. i am looking at something what CssUnit(Github) does, what do you suggest? –  Narayan May 4 '11 at 12:48
add comment

5 Answers 5

You almost certainly have to test on your actual product pages - trying to test CSS 'in parts' will miss out on any of the interesting cascading effects that you get with multiple stylesheets on the whole page. Of course, you also need to test on all the browsers you care about, since they all have their own rendering idiosyncrasies.

Finding an appropriate oracle to tell you if the visuals are right can be difficult. For some stuff, like known colors or attribute values, you could check the HTML attributes.

You could do manual or automated page comparison against a known-good image of the page.

You could do some automated checking for overlapped or truncated elements - I'm not sure which if any test toolkits do this.

share|improve this answer
add comment
  1. Validate the CSS. (http://jigsaw.w3.org/css-validator/)

  2. Compare the rendering results from real browsers against the expected results. (There is some room for waffling here, since a degraded user experience might be expected in some browsers.)

  3. Verify all expected behavior in real web browsers. Behavior comes from CSS pseudo-classes in addition to JavaScript.

share|improve this answer
add comment

If you're looking for a tool that's built for regression testing check out:

https://github.com/bfirsh/needle

It basically takes screenshots of the parts you select (check their example) and compares them. If they're too different from each other, the test will fail.

share|improve this answer
add comment

A simple application I use to test cross browser compatibility with regards to CSS is Adobe Browser Lab which lets you compare rending in different browsers from different operating systems (you would be surprised to see some of the tiny differences that exist on the page). On the subject of cross-browser compatibility have a read over this page as it provides descriptions and links to some more helpful tools.

share|improve this answer
add comment

You could use a good automation tool to test for the existence of css in the html or css file, however, the computed style of a particular element will be significantly different from that.

This type of testing is where I think manual testing really shines and the best tools are ones like browsershots.org to get the information in front of a human as quickly as possible.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.