Archive for the 'CSS' Category

CSS grammar fuzzer

Monday, March 16th, 2009

I wrote a CSS grammar fuzzer to test Gecko's CSS parser. This fuzzer's tricks:

Declarative context-free grammar. This makes it easy to add new CSS features to the fuzzer, or even use it to test grammars other than CSS. Each symbol can be a star, concatenation, or list of alternatives. Unlike a parser, a fuzzer has to make decisions about what to create, so alternatives can be given weights and stars have a suggested number of repetitions. This alone was enough to find at least one bug in Gecko.

Breaking rules. Like any good fuzzer, it doesn't always follow the given context-free grammar. Sometimes it does weird stuff, such as inserting a random symbol, to throw the parser off. I was surprised that this only found one additional bug in Gecko. Perhaps this reflects the comprehensive error handling requirements of the CSS specifications and the corresponding test suites.

Grammatical recursion. When the fuzzer notices that a symbol is the same as an ancestor, it can repeat the parts of the final string between the two symbols. This is effective at finding bugs where large input can cause a recursive algorithm to run out of stack space and crash. This found four grammar-recursion crashes in Gecko.

CSS serialization. The fuzzer makes sure that any text that comes out of the browser's stylesheet serializer survives another trip through the parser and serializer. This is the same trick jsfunfuzz uses to test the JavaScript engine decompiler. This helped fine four incorrect-serialization bugs in Gecko.

None of these Gecko bugs seem to be security holes. I shared the fuzzer with other browser vendors privately for over a month, and nobody asked me to delay the release, so I believe it didn't find security holes in other browsers either. But I think this has more to do with CSS parsing being fairly simple and self-contained than any weakness in the fuzzer.

After CanSecWest, I'm going to try using this fuzzer to generate JavaScript expressions that crash parsers that use recursion incautiously. Unless someone beats me to it, of course ;) (jsfunfuzz already creates many types of weird JavaScript, but can't look for grammatical recursion opportunities easily because it is written in a functional style rather than a declarative style.)

This fuzzer is written in JavaScript and is MIT licensed. I'd love to hear what other people manage to do with it. Get it here.

Transparent text is transparent

Friday, July 18th, 2008

Firefox 3 added support a new CSS color keyword, transparent. Surprisingly, this broke some sites, many of which had rules like table { color: transparent; } due to a Microsoft FrontPage bug.

The strangest part: Firefox wasn't the first major browser to support transparent. Safari was.

These sites were broken in Safari too — until the webmasters got emails from Firefox users. Is Safari's market share really so low that even when Safari is the first to make a change that affects compatibility, Firefox helps Safari more than Safari helps Firefox?

Stylish

Sunday, January 15th, 2006

Stylish, a Firefox extension by Jason Barnabe, lets you manage CSS rules to change the appearance of web sites.

Stylish is to CSS what Greasemonkey is to JavaScript. Stylish allows you to easily manage user styles for the application UI, all websites, or only certain websites. Stylish is better than using userChrome.css/userContent.css because styles are applied immediately instead of requiring a restart.

Some Greasemonkey scripts only add stylesheets. These scripts would work better as user stylesheet additions, because user style rules are applied immediately rather than only after the page finishes loading. Stylish makes it as easy to add a user stylesheet as it is to install Greasemonkey scripts.

You can use it with pre-written user style rules such as my examples or you can write your own as you use the extension. The test styles bookmarklet, which lets you experiment with added CSS rules, complements Stylish well.

Update 2005-02-11: Updated link to point to userstyles.org/stylish instead of the extension's forum thread.

New version of Flash Click-to-View XBL

Saturday, February 7th, 2004

The new version fo my Flash Click-to-View XBL works with <embed> Flash in addition to <object> Flash.

Previous versions didn't block <embed> because they used <xbl:content>, which doesn't work with replaced plugin elements (bug 190970). Previous versions didn't really work with <object> either; instead, they took advantage of the fact that Mozilla ignores most <object>s and looks at the <embed>s they contain instead. The new version uses JavaScript in the <xbl:constructor> to replace the Flash with the placeholder.

The extensions that use modified versions of my XBL, Ted Mielczarek's Flash Click-to-View and Theodore Drake's Flashblock, haven't been updated to use the new code yet. These extensions make it easier to install the XBL, but they must be reinstalled each time you get a new build.

Smaller Google home page

Friday, August 22nd, 2003

I edited Google's home page to make it as small as I could without changing how it looks. The result is 30% smaller and works slightly better.

Most of the changes that weren't simple deletions involved the code for the tabs above the search box.