mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-12-03 18:47:53 +00:00
Bug 1315892 - 'text-orientation: upright' forces used 'direction' to LTR. r=jfkthame
This commit is contained in:
fantasai
Emilio Cobos Álvarez
parent
b08a3cc809
commit
d9d30c73ad
@ -1046,11 +1046,11 @@ fails == css-writing-modes/table-progression-slr-002.html css-writing-modes/tabl
|
||||
fails == css-writing-modes/table-progression-srl-002.html css-writing-modes/table-progression-002-ref.html
|
||||
== css-writing-modes/table-progression-vlr-001.html css-writing-modes/table-progression-001-ref.html
|
||||
fails == css-writing-modes/table-progression-vlr-002.html css-writing-modes/table-progression-002-ref.html
|
||||
fails == css-writing-modes/table-progression-vlr-003.html css-writing-modes/table-progression-001-ref.html
|
||||
== css-writing-modes/table-progression-vlr-003.html css-writing-modes/table-progression-001-ref.html
|
||||
fails == css-writing-modes/table-progression-vlr-004.html css-writing-modes/table-progression-002-ref.html
|
||||
== css-writing-modes/table-progression-vrl-001.html css-writing-modes/table-progression-001-ref.html
|
||||
fails == css-writing-modes/table-progression-vrl-002.html css-writing-modes/table-progression-002-ref.html
|
||||
fails == css-writing-modes/table-progression-vrl-003.html css-writing-modes/table-progression-001-ref.html
|
||||
== css-writing-modes/table-progression-vrl-003.html css-writing-modes/table-progression-001-ref.html
|
||||
fails == css-writing-modes/table-progression-vrl-004.html css-writing-modes/table-progression-002-ref.html
|
||||
fuzzy-if(!webrender&&OSX,255-255,200-200) fuzzy-if(winWidget,0-75,0-404) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == css-writing-modes/text-align-vlr-003.xht reference/ref-filled-green-100px-square.xht
|
||||
fuzzy-if(!webrender&&OSX,255-255,200-200) fuzzy-if(winWidget,0-75,0-404) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == css-writing-modes/text-align-vlr-005.xht reference/ref-filled-green-100px-square.xht
|
||||
|
||||
@ -140,6 +140,8 @@ impl WritingMode {
|
||||
TextOrientation::Mixed => {},
|
||||
TextOrientation::Upright => {
|
||||
flags.insert(WritingMode::UPRIGHT);
|
||||
flags.remove(WritingMode::RTL);
|
||||
flags.remove(WritingMode::INLINE_REVERSED);
|
||||
},
|
||||
TextOrientation::Sideways => {
|
||||
flags.insert(WritingMode::SIDEWAYS);
|
||||
|
||||
@ -1,2 +0,0 @@
|
||||
[table-progression-vlr-003.html]
|
||||
expected: FAIL
|
||||
@ -1,2 +0,0 @@
|
||||
[table-progression-vrl-003.html]
|
||||
expected: FAIL
|
||||
@ -0,0 +1,73 @@
|
||||
<!DOCTYPE html>
|
||||
<title>'text-orientation: upright' forces text to strong LTR in vertical typographic modes</title>
|
||||
<link rel=help href="https://www.w3.org/TR/css-writing-modes-3/#text-orientation">
|
||||
<link rel=match href="reference/direction-upright-001.html">
|
||||
<meta charset=utf-8>
|
||||
<style>
|
||||
body > div {
|
||||
border: solid silver;
|
||||
float: left;
|
||||
margin: 1em;
|
||||
text-align: right;
|
||||
font: 20px/1 sans-serif;
|
||||
}
|
||||
span { text-orientation: upright; }
|
||||
hr { clear: both; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both rows of boxes are identical (order, orientation, and arrangement of contents).
|
||||
|
||||
<!-- test -->
|
||||
|
||||
<div dir=rtl style="writing-mode: vertical-rl">
|
||||
א ב <span>ג ד</span> <span>ה ו</span> ז<br>
|
||||
١ ٢ <span>٣ ٤</span> <span>٥ ٦</span> ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: vertical-lr">
|
||||
א ב <span>ג ד</span> <span>ה ו</span> ז<br>
|
||||
١ ٢ <span>٣ ٤</span> <span>٥ ٦</span> ٧
|
||||
</div>
|
||||
|
||||
<!-- control -->
|
||||
|
||||
<div dir=rtl>
|
||||
א ב <span>ג ד</span> <span>ה ו</span> ז<br>
|
||||
١ ٢ <span>٣ ٤</span> <span>٥ ٦</span> ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl">
|
||||
א ב <span>ג ד</span> <span>ה ו</span> ז<br>
|
||||
١ ٢ <span>٣ ٤</span> <span>٥ ٦</span> ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr">
|
||||
א ב <span>ג ד</span> <span>ה ו</span> ז<br>
|
||||
١ ٢ <span>٣ ٤</span> <span>٥ ٦</span> ٧
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<!-- reference -->
|
||||
|
||||
<div style="writing-mode: vertical-rl">
|
||||
<bdo dir=ltr>
|
||||
ז <span>ג ד</span> <span>ה ו</span> ב א<br>
|
||||
٧ <span>٣ ٤</span> <span>٥ ٦</span> ٢ ١
|
||||
</bdo>
|
||||
</div>
|
||||
<div style="writing-mode: vertical-lr">
|
||||
<bdo dir=ltr>
|
||||
ז <span>ג ד</span> <span>ה ו</span> ב א<br>
|
||||
٧ <span>٣ ٤</span> <span>٥ ٦</span> ٢ ١
|
||||
</bdo>
|
||||
</div>
|
||||
|
||||
<div dir=rtl> א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl">
|
||||
א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr">
|
||||
א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
@ -0,0 +1,138 @@
|
||||
<!DOCTYPE html>
|
||||
<title>'text-orientation: upright' forces used 'direction' to LTR in vertical typographic modes</title>
|
||||
<link rel=help href="https://www.w3.org/TR/css-writing-modes-3/#text-orientation">
|
||||
<link rel=help href="https://www.w3.org/TR/css-flexbox-1/#flex-direction-property">
|
||||
<link rel=help href="https://www.w3.org/TR/css-grid-1/#grid-auto-flow-property">
|
||||
<link rel=help href="https://www.w3.org/TR/css-ruby-1/#bidi">
|
||||
<link rel=match href="reference/direction-upright-002.html">
|
||||
|
||||
<style>
|
||||
body > div {
|
||||
border: solid silver;
|
||||
float: left;
|
||||
margin: 1em;
|
||||
border-inline-start-color: orange;
|
||||
border-block-start-color: aqua;
|
||||
border-inline-end-color: lime;
|
||||
border-block-end-color: yellow;
|
||||
}
|
||||
colgroup:first-child { background: fuchsia; }
|
||||
col:last-child { background: purple; }
|
||||
.flex { display: flex; }
|
||||
.grid { grid-template-columns: auto auto }
|
||||
hr { clear: both }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both rows of boxes are identical (coloring, order, orientation, and arrangement of contents).
|
||||
|
||||
<!-- test -->
|
||||
|
||||
<div dir=rtl style="writing-mode: vertical-rl; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: vertical-lr; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
|
||||
<!-- control -->
|
||||
|
||||
<div dir=rtl style="text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<!-- reference -->
|
||||
|
||||
<div style="writing-mode: vertical-rl; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div style="writing-mode: vertical-lr; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
|
||||
<div dir=rtl>
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
@ -0,0 +1,71 @@
|
||||
<!DOCTYPE html>
|
||||
<title>Reftest Reference</title>
|
||||
<meta charset=utf-8>
|
||||
<style>
|
||||
body > div {
|
||||
border: solid silver;
|
||||
float: left;
|
||||
margin: 1em;
|
||||
text-align: right;
|
||||
font: 20px/1 sans-serif;
|
||||
}
|
||||
span { text-orientation: upright; }
|
||||
hr { clear: both; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both rows of boxes are identical (order, orientation, and arrangement of contents).
|
||||
|
||||
|
||||
<div style="writing-mode: vertical-rl">
|
||||
<bdo dir=ltr>
|
||||
ז <span>ג ד</span> <span>ה ו</span> ב א<br>
|
||||
٧ <span>٣ ٤</span> <span>٥ ٦</span> ٢ ١
|
||||
</bdo>
|
||||
</div>
|
||||
<div style="writing-mode: vertical-lr">
|
||||
<bdo dir=ltr>
|
||||
ז <span>ג ד</span> <span>ה ו</span> ב א<br>
|
||||
٧ <span>٣ ٤</span> <span>٥ ٦</span> ٢ ١
|
||||
</bdo>
|
||||
</div>
|
||||
|
||||
<div dir=rtl> א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl">
|
||||
א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr">
|
||||
א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
|
||||
|
||||
<hr>
|
||||
|
||||
|
||||
<div style="writing-mode: vertical-rl">
|
||||
<bdo dir=ltr>
|
||||
ז <span>ג ד</span> <span>ה ו</span> ב א<br>
|
||||
٧ <span>٣ ٤</span> <span>٥ ٦</span> ٢ ١
|
||||
</bdo>
|
||||
</div>
|
||||
<div style="writing-mode: vertical-lr">
|
||||
<bdo dir=ltr>
|
||||
ז <span>ג ד</span> <span>ה ו</span> ב א<br>
|
||||
٧ <span>٣ ٤</span> <span>٥ ٦</span> ٢ ١
|
||||
</bdo>
|
||||
</div>
|
||||
|
||||
<div dir=rtl> א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl">
|
||||
א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr">
|
||||
א ב ג ד ה ו ז<br>
|
||||
١ ٢ ٣ ٤ ٥ ٦ ٧
|
||||
</div>
|
||||
@ -0,0 +1,127 @@
|
||||
<!DOCTYPE html>
|
||||
<title>Reftest Reference</title>
|
||||
|
||||
<style>
|
||||
body > div {
|
||||
border: solid silver;
|
||||
float: left;
|
||||
margin: 1em;
|
||||
border-inline-start-color: orange;
|
||||
border-block-start-color: aqua;
|
||||
border-inline-end-color: lime;
|
||||
border-block-end-color: yellow;
|
||||
}
|
||||
colgroup:first-child { background: fuchsia; }
|
||||
col:last-child { background: purple; }
|
||||
.flex { display: flex; }
|
||||
.grid { grid-template-columns: auto auto }
|
||||
hr { clear: both }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both rows of boxes are identical (coloring, order, orientation, and arrangement of contents).
|
||||
|
||||
<div style="writing-mode: vertical-rl; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div style="writing-mode: vertical-lr; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
|
||||
<div dir=rtl>
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div style="writing-mode: vertical-rl; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div style="writing-mode: vertical-lr; text-orientation: upright">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
|
||||
<div dir=rtl>
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-rl">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
<div dir=rtl style="writing-mode: sideways-lr">
|
||||
<table>
|
||||
<colgroup></colgroup>
|
||||
<colgroup><col><col></colgroup>
|
||||
<tr><td>A<td>B<td>C
|
||||
</table>
|
||||
<div class=flex>A <span>B</span></div>
|
||||
<div class=grid>A <span>B</span></div>
|
||||
<div>A <ruby>B<rt>b</rt> C<rt>c</rt></ruby><ruby>D<rt>d</rt> E<rt>e</rt></ruby></div>
|
||||
</div>
|
||||
Loading…
Reference in New Issue
Block a user