Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / fast / images / exif-orientation.html
blob4ab4d9863d39cc239f8d12d0d61d5671c51c2538
1 <html>
2 <head>
3 <script>
4 if (window.testRunner) {
5 testRunner.overridePreference('WebKitShouldRespectImageOrientation', 1);
6 testRunner.dumpAsTextWithPixelResults();
9 function log(str) {
10 var li = document.createElement("li");
11 li.appendChild(document.createTextNode(str));
12 var console = document.getElementById("console");
13 console.appendChild(li);
16 function imageSize(el) {
17 var computedStyle = window.getComputedStyle(el);
18 return computedStyle.width + " by " + computedStyle.height;
22 function load() {
23 for(var i = 1; i <= 9; i++)
24 log("img" + i + " size = " + imageSize(document.getElementById("img" + i)))
27 </script>
28 <style>
29 body { overflow: hidden; }
30 img { border: 1px solid black; }
31 div { display: inline-block; margin-right: 20px; margin-bottom: 10px; width: 100px; vertical-align: top; }
32 </style>
33 </head>
34 <body onload="load()">
35 <b>The images should be rotated respecting their EXIF orientation. This test can only be run with testRunner (or by manually setting WebKitShouldRespectImageOrientation to true).</b><br><br>
36 <div><img id="img1" src="resources/exif-orientation-1-ul.jpg"><br>Normal</div>
37 <div><img id="img2" src="resources/exif-orientation-2-ur.jpg"><br>Flipped horizontally</div>
38 <div><img id="img3" src="resources/exif-orientation-3-lr.jpg"><br>Rotated 180&deg;</div>
39 <div><img id="img4" src="resources/exif-orientation-4-lol.jpg"><br>Flipped vertically</div>
40 <br>
41 <div><img id="img5" src="resources/exif-orientation-5-lu.jpg"><br>Rotated 90&deg; CCW and flipped vertically</div>
42 <div><img id="img6" src="resources/exif-orientation-6-ru.jpg"><br>Rotated 90&deg; CCW</div>
43 <div><img id="img7" src="resources/exif-orientation-7-rl.jpg"><br>Rotated 90&deg; CW and flipped vertically </div>
44 <div><img id="img8" src="resources/exif-orientation-8-llo.jpg"><br>Rotated 90&deg; CW</div>
45 <br>
46 <div><img id="img9" src="resources/exif-orientation-9-u.jpg"><br>Undefined (invalid value)</div>
47 <br>
48 <ul id="console"></ul>
49 </body>
50 </html>