Tweak CSS Tests

A bookmarklet that helps you running the CSS Test Suites on your browser.

Overview

CSS syntax may change during the development of the specifications. The CSS Test Suites uses the most recent syntax, but the browser you want to test may support only old syntaxes.

This bookmarklet dynamically modifies the DOM for your browser, so that you can test the layout and/or the behavior before the browser adopts to the new syntax.

Supports CSS Writing Modes Level 3 for Chrome/Safari/IE.

Install

  1. Drag this bookmarklet to your bookmarks bar: tweak-css-tests

If that fails, please refer to how to install bookmarklet in Chrome.

How to use the bookmarklet

  1. Navigate to the test page in the CSS Test Harness.
  2. Click the bookmarklet on your bookmarks bar.

Advanced Topics

Offline version of the bookmarklet

The bookmarklet loads the most recent version automatically, but it requires an Internet connection to run. The offline version of the bookmarklet installs all the necessary logic locally within your bookmark, so that it runs without a connection.

When you need newer versions, you will need to re-install the bookmarklet though. Please refer to the commit history to see if newer versions are available.

To install the offline version of the bookmarklet:

  1. Drag this bookmarklet to your bookmarks bar: tweak-css-tests

Using the script in your HTML files

If you have the test files on your local hard drive, you can load the script into the test page by adding a script tag to the test page.

<script src="tweak-css-tests.js"></script>

The script is available here, or on github.