| <!DOCTYPE html> |
| <style> |
| .group { |
| float: left; width: 180px; |
| } |
| |
| embed, iframe, object, img, input[type="image"], canvas, media, video { |
| margin: 10px 0 20px 10px; |
| outline: 4px solid black; |
| border: 10px solid transparent; |
| background-color: blue; |
| display: block; |
| height: 100px; |
| width: 100px; |
| } |
| </style> |
| |
| <script> |
| if (window.testRunner) { |
| var dumpPixelResults = true; |
| testRunner.dumpAsText(dumpPixelResults); |
| |
| // Disable plugins, because otherwise the "Test WebKit PlugIn" steals <embed>s referencing PNGs. |
| testRunner.setPluginsEnabled(false); |
| } |
| </script> |
| |
| <body> |
| All the replaced elements below should have a solid black outline.<p> |
| |
| <div class="group"> |
| <video> |
| <video src=""></video> |
| <canvas> |
| <canvas src="one day maybe"></canvas> |
| <media> |
| <media src=""></media> |
| </div> |
| |
| <div class="group"> |
| <iframe> |
| <iframe src="resources/square-blue-100x100.png"></iframe> |
| <embed> |
| <embed data="resources/square-blue-100x100.png"> |
| <object> |
| <object src="resources/square-blue-100x100.png"></object> |
| </div> |
| |
| <div class="group"> |
| <input type=image> |
| <input type="image" src="resources/square-blue-100x100.png"> |
| <img> |
| <img src="resources/square-blue-100x100.png"> |
| </div> |
| |
| </body> |
