| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| #content-for-region { |
| background-color: yellow; |
| -webkit-flow-into: flow; |
| width: 100px; |
| height: 100px; |
| } |
| #region { |
| background-color: gray; |
| -webkit-flow-from: flow; |
| width: 200px; |
| height: 200px; |
| } |
| </style> |
| </head> |
| <body> |
| <p>This test verifies that a selection in a region is painted correctly when a user drags it.</p> |
| <p>Steps:</p> |
| <ol> |
| <li>Starting at "Some text", select all of the text in the yellow box.</li> |
| <li>While the text is selected, press the mouse down on the link. Do not release the mouse.</li> |
| <li>Drag the selection to the whitespace on the right.</li> |
| </ol> |
| <p>Expected Results:</p> |
| <ul> |
| <li>A faded image of the selected text and link should follow the mouse as you drag.</li> |
| <li>The faded image should only contain the selected text and link.</li> |
| <li>The faded image should have a transparent background, not yellow and not gray.</li> |
| </ul> |
| <div id="content-for-region"> |
| Some text, followed by a <a href="#">link</a>. |
| </div> |
| <div id="region"></div> |
| </body> |
| </html> |
