Make image-orientation apply to all CSS images associated with an element.
Differential Revision: https://phabricator.services.mozilla.com/D82471
bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1650715
gecko-commit: a6c4ee43e194e7dbe4415bb85c50600d7ea74080
gecko-integration-branch: autoland
gecko-reviewers: dholbert
diff --git a/css/css-images/image-orientation/image-orientation-background-image.html b/css/css-images/image-orientation/image-orientation-background-image.html
index 2687a5c..d294b66 100644
--- a/css/css-images/image-orientation/image-orientation-background-image.html
+++ b/css/css-images/image-orientation/image-orientation-background-image.html
@@ -1,6 +1,6 @@
<!DOCTYPE html>
<meta charset="utf-8">
-<title>CSS Images Module Level 3: image-orientation does not apply to background-image</title>
+<title>CSS Images Module Level 3: image-orientation does apply to background-image</title>
<link rel="author" title="Cameron McCormack" href="mailto:cam@mcc.id.au">
<link rel="help" href="https://drafts.csswg.org/css-images-3/#propdef-image-orientation">
<link rel="match" href="reference/image-orientation-background-image-ref.html">
diff --git a/css/css-images/image-orientation/image-orientation-border-image.html b/css/css-images/image-orientation/image-orientation-border-image.html
index 85b363e..312c673 100644
--- a/css/css-images/image-orientation/image-orientation-border-image.html
+++ b/css/css-images/image-orientation/image-orientation-border-image.html
@@ -1,6 +1,6 @@
<!DOCTYPE html>
<meta charset="utf-8">
-<title>CSS Images Module Level 3: image-orientation does not apply to border images</title>
+<title>CSS Images Module Level 3: image-orientation does apply to border images</title>
<link rel="author" title="Cameron McCormack" href="mailto:cam@mcc.id.au">
<link rel="help" href="https://drafts.csswg.org/css-images-3/#propdef-image-orientation">
<link rel="match" href="reference/image-orientation-border-image-ref.html">
diff --git a/css/css-images/image-orientation/image-orientation-cursor.html b/css/css-images/image-orientation/image-orientation-cursor.html
new file mode 100644
index 0000000..00a80d4
--- /dev/null
+++ b/css/css-images/image-orientation/image-orientation-cursor.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Images Module Level 3: image-orientation does apply to cursor</title>
+<link rel="author" title="Cameron McCormack" href="mailto:cam@mcc.id.au">
+<link rel="help" href="https://drafts.csswg.org/css-images-3/#propdef-image-orientation">
+<link rel="flags" content="interact">
+<style>
+div { width: 100px; height: 100px; border: solid blue; margin-left: 64px; }
+.orient { cursor: url(support/cursor-8-llo.jpg) 33 0, default; }
+.no-orient { cursor: url(support/cursor-8-llo.jpg) 64 33, default; image-orientation: none; }
+</style>
+<p>The test passes if</p>
+<ul>
+ <li>when moved inside either of the blue boxes, the cursor is shown as a
+ black arrow on a white background, with the point of the arrow at the current
+ cursor location</li>
+ <li>in the first box, the cursor points up and to the right</li>
+ <li>in the second box, the cursor points down and to the right</li>
+</ul>
+<div class="orient"></div>
+<div class="no-orient"></div>
diff --git a/css/css-images/image-orientation/image-orientation-iframe.html b/css/css-images/image-orientation/image-orientation-iframe.html
new file mode 100644
index 0000000..69cfb5c
--- /dev/null
+++ b/css/css-images/image-orientation/image-orientation-iframe.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Images Module Level 3: image-orientation does not apply to iframe contents</title>
+<link rel="author" title="Cameron McCormack" href="mailto:cam@mcc.id.au">
+<link rel="help" href="https://drafts.csswg.org/css-images-3/#propdef-image-orientation">
+<link rel="match" href="reference/image-orientation-iframe-ref.html">
+<style>
+.no-orient { image-orientation: none; }
+</style>
+<iframe src="support/exif-orientation-2-ur.jpg"></iframe>
+<iframe src="support/exif-orientation-2-ur.jpg" class="no-orient"></iframe>
diff --git a/css/css-images/image-orientation/image-orientation-list-style-image.html b/css/css-images/image-orientation/image-orientation-list-style-image.html
index 33730a3..926b3ab 100644
--- a/css/css-images/image-orientation/image-orientation-list-style-image.html
+++ b/css/css-images/image-orientation/image-orientation-list-style-image.html
@@ -1,6 +1,6 @@
<!DOCTYPE html>
<meta charset="utf-8">
-<title>CSS Images Module Level 3: image-orientation does not apply to list-style-image</title>
+<title>CSS Images Module Level 3: image-orientation does apply to list-style-image</title>
<link rel="author" title="Cameron McCormack" href="mailto:cam@mcc.id.au">
<link rel="help" href="https://drafts.csswg.org/css-images-3/#propdef-image-orientation">
<link rel="match" href="reference/image-orientation-list-style-image-ref.html">
diff --git a/css/css-images/image-orientation/reference/image-orientation-background-image-ref.html b/css/css-images/image-orientation/reference/image-orientation-background-image-ref.html
index e570906..a3e2ece 100644
--- a/css/css-images/image-orientation/reference/image-orientation-background-image-ref.html
+++ b/css/css-images/image-orientation/reference/image-orientation-background-image-ref.html
@@ -2,8 +2,9 @@
<meta charset="utf-8">
<title>CSS Reference</title>
<style>
-div { width: 100px; height: 50px; background-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg); }
+div { width: 100px; height: 50px; }
+.orient { background-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg); }
+.no-orient { background-image: url(../support/exif-orientation-9-u.jpg); }
</style>
-<div></div>
-<div></div>
-
+<div class="orient"></div>
+<div class="no-orient"></div>
diff --git a/css/css-images/image-orientation/reference/image-orientation-border-image-ref.html b/css/css-images/image-orientation/reference/image-orientation-border-image-ref.html
index 3f9b688..51aa8d0 100644
--- a/css/css-images/image-orientation/reference/image-orientation-border-image-ref.html
+++ b/css/css-images/image-orientation/reference/image-orientation-border-image-ref.html
@@ -6,8 +6,9 @@
width: 100px;
height: 50px;
border: 10px solid black;
- border-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg) 10;
}
+.orient { border-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg) 10; }
+.no-orient { border-image: url(../support/exif-orientation-9-u.jpg) 10; }
</style>
-<div></div>
-<div></div>
+<div class="orient"></div>
+<div class="no-orient"></div>
diff --git a/css/css-images/image-orientation/reference/image-orientation-iframe-ref.html b/css/css-images/image-orientation/reference/image-orientation-iframe-ref.html
new file mode 100644
index 0000000..a9e9b3f
--- /dev/null
+++ b/css/css-images/image-orientation/reference/image-orientation-iframe-ref.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<iframe src="../support/exif-orientation-2-ur.jpg"></iframe>
+<iframe src="../support/exif-orientation-2-ur.jpg"></iframe>
diff --git a/css/css-images/image-orientation/reference/image-orientation-list-style-image-ref.html b/css/css-images/image-orientation/reference/image-orientation-list-style-image-ref.html
index 433cf98..8dcef6a 100644
--- a/css/css-images/image-orientation/reference/image-orientation-list-style-image-ref.html
+++ b/css/css-images/image-orientation/reference/image-orientation-list-style-image-ref.html
@@ -2,7 +2,9 @@
<meta charset="utf-8">
<title>CSS Reference</title>
<style>
-ul { margin-left: 100px; list-style-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg); }
+ul { margin-left: 100px; }
+.orient { list-style-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg); }
+.no-orient { list-style-image: url(../support/exif-orientation-9-u.jpg); }
</style>
-<ul><li> </li></ul>
-<ul><li> </li></ul>
+<ul class="orient"><li> </li></ul>
+<ul class="no-orient"><li> </li></ul>
diff --git a/css/css-images/image-orientation/reference/image-orientation-mask-image-ref.html b/css/css-images/image-orientation/reference/image-orientation-mask-image-ref.html
index ff07824..ba59303 100644
--- a/css/css-images/image-orientation/reference/image-orientation-mask-image-ref.html
+++ b/css/css-images/image-orientation/reference/image-orientation-mask-image-ref.html
@@ -6,9 +6,10 @@
width: 100px;
height: 50px;
background: blue;
- mask-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg);
mask-mode: luminance;
}
+.orient { mask-image: url(../support/exif-orientation-2-ur-pre-rotated.jpg); }
+.no-orient { mask-image: url(../support/exif-orientation-9-u.jpg); }
</style>
-<div></div>
-<div></div>
+<div class="orient"></div>
+<div class="no-orient"></div>
diff --git a/css/css-images/image-orientation/support/cursor-8-llo.jpg b/css/css-images/image-orientation/support/cursor-8-llo.jpg
new file mode 100644
index 0000000..ef26ad4
--- /dev/null
+++ b/css/css-images/image-orientation/support/cursor-8-llo.jpg
Binary files differ
