mirror of
https://github.com/servo/servo.git
synced 2025-06-23 08:34:42 +01:00
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180. - Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
544 lines
No EOL
22 KiB
HTML
544 lines
No EOL
22 KiB
HTML
|
|
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
|
|
<html>
|
|
<head>
|
|
<title>Animatable properties - CSS Transitions Module Level 1 CR Test Suite</title>
|
|
<style type="text/css">
|
|
@import "http://www.w3.org/StyleSheets/TR/base.css";
|
|
@import "../indices.css";
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<h1>CSS Transitions Module Level 1 CR Test Suite</h1>
|
|
<h2>Animatable properties (44 tests)</h2>
|
|
<table width="100%">
|
|
<col id="test-column">
|
|
<col id="refs-column">
|
|
<col id="flags-column">
|
|
<col id="info-column">
|
|
<thead>
|
|
<tr>
|
|
<th>Test</th>
|
|
<th><abbr title="Rendering References">Refs</abbr></th>
|
|
<th>Flags</th>
|
|
<th>Info</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="s7">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s7">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#animatable-properties">7 Animatable properties</a></th></tr>
|
|
<!-- 1 tests -->
|
|
<tr id="transitions-animatable-properties-01-7" class="script">
|
|
<td>
|
|
<a href="transitions-animatable-properties-01.htm">transitions-animatable-properties-01</a></td>
|
|
<td></td>
|
|
<td><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
|
<td>CSS Transitions: Animatable CSS properties
|
|
<ul class="assert">
|
|
<li>Check that all animatable CSS properties are animatable and then accepted by the 'transition-property' property</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s7.#animatable-properties-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s7.1">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s7.1">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#animatable-css">7.1 Properties from CSS</a></th></tr>
|
|
<!-- 43 tests -->
|
|
<tr id="properties-value-001-7.1" class="dom script">
|
|
<td>
|
|
<a href="properties-value-001.htm">properties-value-001</a></td>
|
|
<td></td>
|
|
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
|
<td>Intermediate Property Values
|
|
<ul class="assert">
|
|
<li>Test checks that value ranges between start and end while transitioning</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="properties-value-002-7.1" class="dom script">
|
|
<td>
|
|
<a href="properties-value-002.htm">properties-value-002</a></td>
|
|
<td></td>
|
|
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
|
<td>Intermediate Property Values of missing value types
|
|
<ul class="assert">
|
|
<li>Test checks that expected value types that haven't been specified are transitionable</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="properties-value-003-7.1" class="dom script">
|
|
<td>
|
|
<a href="properties-value-003.htm">properties-value-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
|
<td>Intermediate Property Values of unspecified properties
|
|
<ul class="assert">
|
|
<li>Test checks that properties are transitionable that haven't been specified</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-006-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-006.htm">transition-property-006</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - background-position
|
|
<ul class="assert">
|
|
<li>Test checks that the 'background-position' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-007-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-007.htm">transition-property-007</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-bottom-color
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-bottom-color' property animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-008-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-008.htm">transition-property-008</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-bottom-width
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-bottom-width' property animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-009-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-009.htm">transition-property-009</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-left-color
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-left-color' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-010-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-010.htm">transition-property-010</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-left-width
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-left-width' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-011-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-011.htm">transition-property-011</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-right-color
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-right-color' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-012-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-012.htm">transition-property-012</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-right-width
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-right-width' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-013-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-013.htm">transition-property-013</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-top-color
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-top-color' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-014-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-014.htm">transition-property-014</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-top-width
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-top-width' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-015-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-015.htm">transition-property-015</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - border-spacing
|
|
<ul class="assert">
|
|
<li>Test checks that the 'border-spacing' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-016-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-016.htm">transition-property-016</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - bottom
|
|
<ul class="assert">
|
|
<li>Test checks that the 'bottom' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-017-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-017.htm">transition-property-017</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - clip
|
|
<ul class="assert">
|
|
<li>Test checks that the 'clip' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-018-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-018.htm">transition-property-018</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - color
|
|
<ul class="assert">
|
|
<li>Test checks that the 'color' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-019-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-019.htm">transition-property-019</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - font-size
|
|
<ul class="assert">
|
|
<li>Test checks that the 'font-size' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-020-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-020.htm">transition-property-020</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - font-weight
|
|
<ul class="assert">
|
|
<li>Test checks that the 'font-weight' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-021-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-021.htm">transition-property-021</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - left
|
|
<ul class="assert">
|
|
<li>Test checks that the 'left' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-022-7.1" class="ahem interact">
|
|
<td>
|
|
<a href="transition-property-022.htm">transition-property-022</a></td>
|
|
<td></td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - letter-spacing
|
|
<ul class="assert">
|
|
<li>Test checks that the 'letter-spacing' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-023-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-023.htm">transition-property-023</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - line-height
|
|
<ul class="assert">
|
|
<li>Test checks that the 'line-height' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-024-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-024.htm">transition-property-024</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - margin-bottom
|
|
<ul class="assert">
|
|
<li>Test checks that the 'margin-bottom' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-025-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-025.htm">transition-property-025</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - margin-left
|
|
<ul class="assert">
|
|
<li>Test checks that the 'margin-left' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-026-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-026.htm">transition-property-026</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - margin-right
|
|
<ul class="assert">
|
|
<li>Test checks that the 'margin-right' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-027-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-027.htm">transition-property-027</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - max-height
|
|
<ul class="assert">
|
|
<li>Test checks that the 'max-height' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-028-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-028.htm">transition-property-028</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - max-width
|
|
<ul class="assert">
|
|
<li>Test checks that the 'max-width' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-029-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-029.htm">transition-property-029</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - min-height
|
|
<ul class="assert">
|
|
<li>Test checks that the 'min-height' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-030-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-030.htm">transition-property-030</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - min-width
|
|
<ul class="assert">
|
|
<li>Test checks that the 'min-width' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-031-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-031.htm">transition-property-031</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - opacity
|
|
<ul class="assert">
|
|
<li>Test checks that the 'opacity' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-032-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-032.htm">transition-property-032</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - outline-color
|
|
<ul class="assert">
|
|
<li>Test checks that the 'outline-color' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-033-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-033.htm">transition-property-033</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - outline-width
|
|
<ul class="assert">
|
|
<li>Test checks that the 'outline-width' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-034-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-034.htm">transition-property-034</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - padding-bottom
|
|
<ul class="assert">
|
|
<li>Test checks that the 'padding-bottom' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-035-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-035.htm">transition-property-035</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - padding-left
|
|
<ul class="assert">
|
|
<li>Test checks that the 'padding-left' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-036-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-036.htm">transition-property-036</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - padding-right
|
|
<ul class="assert">
|
|
<li>Test checks that the 'padding-right' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-037-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-037.htm">transition-property-037</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - padding-top
|
|
<ul class="assert">
|
|
<li>Test checks that the 'padding-top' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-038-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-038.htm">transition-property-038</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - right
|
|
<ul class="assert">
|
|
<li>Test checks that the 'right' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-039-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-039.htm">transition-property-039</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - text-indent
|
|
<ul class="assert">
|
|
<li>Test checks that the 'text-indent' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-040-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-040.htm">transition-property-040</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - text-shadow
|
|
<ul class="assert">
|
|
<li>Test checks that the 'text-shadow' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-041-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-041.htm">transition-property-041</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - top
|
|
<ul class="assert">
|
|
<li>Test checks that the 'top' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-042-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-042.htm">transition-property-042</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - vertical-align
|
|
<ul class="assert">
|
|
<li>Test checks that the 'vertical-align' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-043-7.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-043.htm">transition-property-043</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - visibility
|
|
<ul class="assert">
|
|
<li>Test checks that the 'visibility' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-044-7.1" class="ahem interact">
|
|
<td>
|
|
<a href="transition-property-044.htm">transition-property-044</a></td>
|
|
<td></td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - word-spacing
|
|
<ul class="assert">
|
|
<li>Test checks that the 'word-spacing' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-045-7.1" class="ahem interact">
|
|
<td>
|
|
<a href="transition-property-045.htm">transition-property-045</a></td>
|
|
<td></td>
|
|
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - z-index
|
|
<ul class="assert">
|
|
<li>Test checks that the 'z-index' property is animatable.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s7.1.#properties-from-css-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s7.2">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s7.2">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#animatable-svg">7.2 Properties from SVG</a></th></tr>
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s7.2.#properties-from-svg-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
</table>
|
|
|
|
</body>
|
|
</html> |