How can I validate CSS on internal web pages?

Question

I want to check internal web pages, so I cannot use the W3C validation service directly. I managed to run the XHTML validator locally, however, I have some problems with the

Answer 1

For the lazy, here's a script I wrote to do what Sinan suggests:

#!/bin/sh
# W3C CSS Validator Install Script --------------
# installs W3C CSS Validator
# requires: ant, wget, javac
# see: http://jigsaw.w3.org/css-validator/DOWNLOAD.html
# see: http://esw.w3.org/CssValidator
# see: http://thecodetrain.co.uk/2009/02/running-the-w3c-css-validator-locally-from-the-command-line/
# see: http://stackoverflow.com/a/3303298/357774
##wget "http://www.w3.org/QA/Tools/css-validator/css-validator.jar"
#sudo aptitude install -y ant # uncomment if you don't have ant
CVSROOT=:pserver:anonymous:anonymous@dev.w3.org:/sources/public cvs checkout 2002/css-validator 
mkdir 2002/css-validator/lib
TOMCAT6_VERSION='6.0.45'
wget "http://www.apache.org/dist/tomcat/tomcat-6/v$TOMCAT6_VERSION/bin/apache-tomcat-$TOMCAT6_VERSION.tar.gz"
tar xvf apache-tomcat-$TOMCAT6_VERSION.tar.gz
mv apache-tomcat-$TOMCAT6_VERSION/lib/servlet-api.jar 2002/css-validator/lib/servlet.jar
rm -rf apache-tomcat-$TOMCAT6_VERSION apache-tomcat-$TOMCAT6_VERSION.tar.gz
cd 2002/css-validator
ant jar
# usage example: java -jar css-validator.jar "http://csszengarden.com/"

That should work, at least until the next software dependency update breaks the ant build script (feel free to parameterize versions).

Hope this helps!

Answer 2

You can invoke the W3C validator from the command line:

Command-Line use

Any computer with Java installed can also run the validator from the terminal/console as a commandline tool. Download the css-validator.jar jar archive (or build it with ant jar) and run it as :

java -jar css-validator.jar http://www.w3.org/

Note : the css-validator.jar file must be located at the exact same level as the lib/ folder to work properly.

Update: To get it to work, I checked out the full distribution from CVS and ran ant using the included build.xml. It downloaded all dependencies except for servlet.jar. To deal with that, I downloaded the binary distribution of Tomcat 6 and extracted it. Then, I edited the build.xml for css-validator to reflect the location of servlet.lib:

<property name="servlet.lib" 
 value="E:/Downloads/apache-tomcat-6.0.20/lib/servlet-api.jar"/>

Then ran ant again. This produced the css-validator.jar file in the top level of the directory checked out from CVS with the lib subdirectory containing the other jars it depends on. Then, I was able to run the validator successfully:

C:\Temp\validator\2002\css-validator> java -jar css-validator.jar http://www.unur.com/

Answer 3

That jar is runnable, but it needs some extra libraries.

Examine the MANIFEST.MF file:

$ unzip -p css-validator.jar META-INF/MANIFEST.MF
Manifest-Version: 1.0
Ant-Version: Apache Ant 1.8.0
Created-By: 1.6.0_26-b03 (Sun Microsystems Inc.)
Main-Class: org.w3c.css.css.CssValidator
Class-Path: . lib/commons-collections-3.2.1.jar lib/commons-lang-2.6.j
 ar lib/jigsaw.jar lib/tagsoup-1.2.jar lib/velocity-1.7.jar lib/xerces
 Impl.jar lib/xml-apis.jar lib/htmlparser-1.3.1.jar

You need all the jars mentioned in Class-Path. You can download them from the maven repository using this script:

#!/bin/bash

set -e

mkdir -p lib
curl -LO http://www.w3.org/QA/Tools/css-validator/css-validator.jar
echo "\
http://repo1.maven.org/maven2/commons-collections/commons-collections/3.2.1/commons-collections-3.2.1.jar
http://repo1.maven.org/maven2/commons-lang/commons-lang/2.6/commons-lang-2.6.jar
http://repo1.maven.org/maven2/org/w3c/jigsaw/jigsaw/2.2.6/jigsaw-2.2.6.jar jigsaw.jar
http://repo1.maven.org/maven2/org/ccil/cowan/tagsoup/tagsoup/1.2/tagsoup-1.2.jar
http://repo1.maven.org/maven2/org/apache/velocity/velocity/1.7/velocity-1.7.jar
http://repo1.maven.org/maven2/xerces/xercesImpl/2.11.0/xercesImpl-2.11.0.jar xercesImpl.jar
http://repo1.maven.org/maven2/nu/validator/htmlparser/htmlparser/1.2.1/htmlparser-1.2.1.jar\
" | while read url shortname; do
        if [ -z "$shortname" ]; then
            shortname="${url##*/}"
        fi
        curl -L -o "lib/${shortname}" "${url}"
    done

After doing that, it works:

$ java -jar css-validator.jar --output=soap12 file:badcss.html
{vextwarning=false, output=soap12, lang=en, warning=2, medium=all, profile=css3}
<?xml version='1.0' encoding="utf-8"?>
<env:Envelope xmlns:env="http://www.w3.org/2003/05/soap-envelope">
    <env:Body>
        <m:cssvalidationresponse
            env:encodingStyle="http://www.w3.org/2003/05/soap-encoding"
            xmlns:m="http://www.w3.org/2005/07/css-validator">
            <m:uri>file:badcss.html</m:uri>
            <m:checkedby>http://jigsaw.w3.org/css-validator/</m:checkedby>
            <m:csslevel>css3</m:csslevel>
            <m:date>2013-03-12T06:40:09Z</m:date>
            <m:validity>false</m:validity>
            <m:result>
                <m:errors xml:lang="en">
                    <m:errorcount>1</m:errorcount>

                <m:errorlist>
                    <m:uri>file:badcss.html</m:uri>

                        <m:error>
                            <m:line>8</m:line>
                            <m:errortype>parse-error</m:errortype>
                            <m:context> h1 </m:context>        
                            <m:errorsubtype>
                                exp
                            </m:errorsubtype>
                            <m:skippedstring>
                                100%
                            </m:skippedstring>

                            <m:message>

                                Property fnt-size doesn&#39;t exist : 
                            </m:message>
                        </m:error>

                    </m:errorlist>

                </m:errors>
                <m:warnings xml:lang="en">
                    <m:warningcount>1</m:warningcount>

                    <m:warninglist>
                        <m:uri>file:badcss.html</m:uri>

                        <m:warning>
                            <m:line>5</m:line>
                            <m:level>0</m:level>
                            <m:message>You should add a &#39;type&#39; attribute with a value of &#39;text/css&#39; to the &#39;style&#39; element</m:message>
                        </m:warning>

                    </m:warninglist>
                    </m:warnings>
            </m:result>
        </m:cssvalidationresponse>
    </env:Body>
</env:Envelope>