mirror of
https://github.com/servo/servo.git
synced 2025-06-23 08:34:42 +01:00
296fa2512b
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180. - Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
576 lines
No EOL
26 KiB
HTML
576 lines
No EOL
26 KiB
HTML
|
|
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
|
|
<html>
|
|
<head>
|
|
<title>Transitions - 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>Transitions (42 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="s2">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s2">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#transitions">2 Transitions</a></th></tr>
|
|
<!-- 8 tests -->
|
|
<tr id="detached-container-001-2" class="dom script">
|
|
<td>
|
|
<a href="detached-container-001.htm">detached-container-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>Not Transitioning within detached element
|
|
<ul class="assert">
|
|
<li>Test checks that transitions are NOT run within detached elements</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="hidden-container-001-2" class="dom script">
|
|
<td>
|
|
<a href="hidden-container-001.htm">hidden-container-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>Not Transitioning within hidden element
|
|
<ul class="assert">
|
|
<li>Test checks that transitions are NOT run within hidden elements</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="properties-value-001-2" 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-2" 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-2" 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="properties-value-auto-001-2" class="dom script">
|
|
<td>
|
|
<a href="properties-value-auto-001.htm">properties-value-auto-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>transitioning property value "auto"
|
|
<ul class="assert">
|
|
<li>Test checks that properties are transitioned from an to auto-value</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="properties-value-implicit-001-2" class="dom script">
|
|
<td>
|
|
<a href="properties-value-implicit-001.htm">properties-value-implicit-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>font-size-relative properties transition by implicit value change
|
|
<ul class="assert">
|
|
<li>Test checks that font-size-relative properties (all em-lengths) run a transition when font-size is changed</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transitions-animatable-properties-01-2" 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="s2.#list-matching">
|
|
<!-- 1 tests -->
|
|
<tr id="events-004-2.#list-matching" class="dom script">
|
|
<td>
|
|
<a href="events-004.htm">events-004</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>transitionend event with non matching lists
|
|
<ul class="assert">
|
|
<li>Test checks that non-matching lists are properly resolved</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s2.#transitions-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.1">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s2.1">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#transition-property-property">2.1 The ‘transition-property’ Property</a></th></tr>
|
|
<!-- 9 tests -->
|
|
<tr id="events-001-2.1" class="dom script">
|
|
<td>
|
|
<a href="events-001.htm">events-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>transitionend event for shorthand property
|
|
<ul class="assert">
|
|
<li>Test checks that all transitionend events are triggered for shorthand property</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="events-005-2.1" class="dom script">
|
|
<td>
|
|
<a href="events-005.htm">events-005</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>transitionend event with property specificity
|
|
<ul class="assert">
|
|
<li>Test checks that property specificity is properly resolved</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="pseudo-elements-001-2.1" class="dom script">
|
|
<td>
|
|
<a href="pseudo-elements-001.htm">pseudo-elements-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>Transitioning Pseudo Elements
|
|
<ul class="assert">
|
|
<li>Test checks that transitions are run on pseudo elements</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-001-2.1" class="dom script">
|
|
<td>
|
|
<a href="transition-property-001.htm">transition-property-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>Parsing transition-property
|
|
<ul class="assert">
|
|
<li>Test checks that transition-property values are parsed properly</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-002-2.1" class="dom script">
|
|
<td>
|
|
<a href="transition-property-002.htm">transition-property-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>Parsing invalid transition-property
|
|
<ul class="assert">
|
|
<li>Test checks that unrecognized or non-animatable properties must be kept in the list to preserve the matching of indices.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-003-2.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-003.htm">transition-property-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - none
|
|
<ul class="assert">
|
|
<li>The 'transition-duration' property set 'none' means that no property will be transitioned.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-004-2.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-004.htm">transition-property-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - all
|
|
<ul class="assert">
|
|
<li>The 'transition-duration' property set 'all' means that all properties are transitioned.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-property-005-2.1" class="interact">
|
|
<td>
|
|
<a href="transition-property-005.htm">transition-property-005</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-property - height width(more than one properties specified)
|
|
<ul class="assert">
|
|
<li>The 'transition-duration' property set more than one properties like 'height, width' means only the specified properties will be transitioned.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-test-2.1" class="">
|
|
<td>
|
|
<a href="transition-test.htm">transition-test</a></td>
|
|
<td><a href="reference/transition-test-ref.htm">=</a> </td>
|
|
<td></td>
|
|
<td>invalid values cause all properites to animate.
|
|
<ul class="assert">
|
|
<li>When an invalid value is specified as one of the transition properties, it causes the the transition-property to change to 'all'. Instead of leaving the invalid property in and animating the valid properites with matching durations.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s2.1.#single-transition-property">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.1.#the-transition-property-property-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.1.#transition-property">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.2">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s2.2">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#transition-duration-property">2.2 The ‘transition-duration’ Property</a></th></tr>
|
|
<!-- 4 tests -->
|
|
<tr id="transition-duration-001-2.2" class="dom script">
|
|
<td>
|
|
<a href="transition-duration-001.htm">transition-duration-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>Parsing transition-duration
|
|
<ul class="assert">
|
|
<li>Test checks that transition-duration values are parsed properly</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-duration-002-2.2" class="interact">
|
|
<td>
|
|
<a href="transition-duration-002.htm">transition-duration-002</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-duration - positive number
|
|
<ul class="assert">
|
|
<li>The 'transition-duration' property set positive number specifies the time that transition from the old value to the new value should take.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-duration-003-2.2" class="interact">
|
|
<td>
|
|
<a href="transition-duration-003.htm">transition-duration-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-duration - 0s(initial value)
|
|
<ul class="assert">
|
|
<li>Test checks that the initial value of 'transition-duration' property is '0s' which means the transition is immediate.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-duration-004-2.2" class="interact">
|
|
<td>
|
|
<a href="transition-duration-004.htm">transition-duration-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-duration - negative number
|
|
<ul class="assert">
|
|
<li>A negative value for 'transition-duration renders the declaration invalid which means the transition is immediate.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s2.2.#the-transition-duration-property-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.2.#transition-duration">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.3">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s2.3">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#transition-timing-function-property">2.3 The ‘transition-timing-function’ Property</a></th></tr>
|
|
<!-- 1 tests -->
|
|
<tr id="transition-timing-function-001-2.3" class="dom script">
|
|
<td>
|
|
<a href="transition-timing-function-001.htm">transition-timing-function-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>Parsing transition-timing-function
|
|
<ul class="assert">
|
|
<li>Test checks that transition-timing-function values are parsed properly</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s2.3.#single-transition-timing-function">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.3.#transition-timing-function">
|
|
<!-- 12 tests -->
|
|
<tr id="transition-timing-function-002-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-002.htm">transition-timing-function-002</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - 'ease' equivalent to 'cubic-bezier(0.25, 0.1, 0.25, 1.0)'
|
|
<ul class="assert">
|
|
<li>The 'transition-timing-function' property set 'ease' is equivalent to cubic-bezier(0.25, 0.1, 0.25, 1.0)</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-003-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-003.htm">transition-timing-function-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - 'ease-in' equivalent to 'cubic-bezier(0.42, 0, 1.0, 1.0)'
|
|
<ul class="assert">
|
|
<li>The 'transition-timing-function' property set 'ease-in' is equivalent to cubic-bezier(0.42, 0, 1.0, 1.0)</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-004-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-004.htm">transition-timing-function-004</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - 'ease-in-out' equivalent to 'cubic-bezier(0.42, 0, 0.58, 1.0)'
|
|
<ul class="assert">
|
|
<li>The 'transition-timing-function' property set 'ease-in-out' is equivalent to cubic-bezier(0.42, 0, 0.58, 1.0)</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-005-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-005.htm">transition-timing-function-005</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - 'ease-out' equivalent to 'cubic-bezier(0, 0, 0.58, 1.0)'
|
|
<ul class="assert">
|
|
<li>The 'transition-timing-function' property set 'ease-out' is equivalent to cubic-bezier(0, 0, 0.58, 1.0)</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-006-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-006.htm">transition-timing-function-006</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - 'linear' equivalent to 'cubic-bezier(0.0, 0.0, 1.0, 1.0)'
|
|
<ul class="assert">
|
|
<li>The 'transition-timing-function' property set 'linear' is equivalent to cubic-bezier(0.0, 0.0, 1.0, 1.0)</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-007-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-007.htm">transition-timing-function-007</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - 'step-end' equivalent to 'steps(1, end)'
|
|
<ul class="assert">
|
|
<li>The 'transition-timing-function' property set 'step-end' is equivalent to 'steps(1, end)'</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-008-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-008.htm">transition-timing-function-008</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - 'step-start' equivalent to 'steps(1, start)'
|
|
<ul class="assert">
|
|
<li>The 'transition-timing-function' property set 'step-start' is equivalent to 'steps(1, start)'</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-009-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-009.htm">transition-timing-function-009</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - ease(initial value)
|
|
<ul class="assert">
|
|
<li>Test checks that the initial value of 'transition-timing-function' property is 'ease'.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-010-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-010.htm">transition-timing-function-010</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - steps(2)
|
|
<ul class="assert">
|
|
<li>Test checks that the first parameter of 'steps()' function specifies the number of intervals.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-011-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-011.htm">transition-timing-function-011</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - steps(the second parameter default 'end')
|
|
<ul class="assert">
|
|
<li>Test checks that the second parameter of 'steps()' function is default 'end'.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-012-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-012.htm">transition-timing-function-012</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - steps(-2)
|
|
<ul class="assert">
|
|
<li>Test checks that the 'steps()' function with negative number is invalid, the transition-timing-function will use 'ease' as default.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-timing-function-013-2.3.#transition-timing-function" class="interact">
|
|
<td>
|
|
<a href="transition-timing-function-013.htm">transition-timing-function-013</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-timing-function - steps(0)
|
|
<ul class="assert">
|
|
<li>Test checks that the 'steps()' function with '0' is invalid, the transition-timing-function will use 'ease' as default.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s2.3.#transition-timing-function_tag">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.4">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s2.4">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#transition-delay-property">2.4 The ‘transition-delay’ Property</a></th></tr>
|
|
<!-- 5 tests -->
|
|
<tr id="events-003-2.4" class="dom script">
|
|
<td>
|
|
<a href="events-003.htm">events-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>transitionend event with negative delay
|
|
<ul class="assert">
|
|
<li>Test checks that transitionend event is triggered for duration time being canceled out by negative delay</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-delay-000-2.4" class="interact">
|
|
<td>
|
|
<a href="transition-delay-000.htm">transition-delay-000</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-delay - positive number
|
|
<ul class="assert">
|
|
<li>The 'transition-delay' property set positive number to delay the execution of transition</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-delay-001-2.4" class="dom script">
|
|
<td>
|
|
<a href="transition-delay-001.htm">transition-delay-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>Parsing transition-delay
|
|
<ul class="assert">
|
|
<li>Test checks that transition-delay values are parsed properly</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-delay-002-2.4" class="interact">
|
|
<td>
|
|
<a href="transition-delay-002.htm">transition-delay-002</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-delay - 0s
|
|
<ul class="assert">
|
|
<li>Test checks that the 'transition-delay' property set 0 will not delay the execution of transition</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="transition-delay-003-2.4" class="interact">
|
|
<td>
|
|
<a href="transition-delay-003.htm">transition-delay-003</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>transition-delay - negative number
|
|
<ul class="assert">
|
|
<li>Test checks that the 'transition-delay' property set negative number will not delay the execution of transition</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s2.4.#the-transition-delay-property-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.4.#transition-delay">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.5">
|
|
<tr><th colspan="4" scope="rowgroup">
|
|
<a href="#s2.5">+</a>
|
|
<a href="https://www.w3.org/TR/css3-transitions/#transition-shorthand-property">2.5 The ‘transition’ Shorthand Property</a></th></tr>
|
|
<!-- 1 tests -->
|
|
<tr id="transition-001-2.5" class="dom script">
|
|
<td>
|
|
<a href="transition-001.htm">transition-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>Parsing transition shorthand
|
|
<ul class="assert">
|
|
<li>Test checks that transition shorthand values are parsed properly</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody id="s2.5.#single-transition">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.5.#the-transition-shorthand-property-">
|
|
<!-- 0 tests -->
|
|
</tbody>
|
|
<tbody id="s2.5.#transition">
|
|
<!-- 1 tests -->
|
|
<tr id="caret-color-017-2.5.#transition" class="interact">
|
|
<td>
|
|
<a href="caret-color-017.htm">caret-color-017</a></td>
|
|
<td></td>
|
|
<td><abbr class="interact" title="Requires user interaction">Interact</abbr></td>
|
|
<td>caret-color transition
|
|
<ul class="assert">
|
|
<li>Test checks that caret-color can be used in a transition</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
</body>
|
|
</html> |