diff options
Diffstat (limited to 'layout/reftests/css-ruby')
115 files changed, 2915 insertions, 0 deletions
diff --git a/layout/reftests/css-ruby/bidi-1-ref.html b/layout/reftests/css-ruby/bidi-1-ref.html new file mode 100644 index 000000000..c69bb0467 --- /dev/null +++ b/layout/reftests/css-ruby/bidi-1-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1141928 - Position of ruby annotation in RTL text</title> + <style> + body { color: transparent; } + rb { background: green; } + rtc { background: red; } + rt { background: cyan; } + </style> +</head> +<body style="text-align: right"> + <ruby><rb>base<rtc><rt>text</ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/bidi-1.html b/layout/reftests/css-ruby/bidi-1.html new file mode 100644 index 000000000..4b22c6535 --- /dev/null +++ b/layout/reftests/css-ruby/bidi-1.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1141928 - Position of ruby annotation in RTL text</title> + <style> + body { color: transparent; } + rb { background: green; } + rtc { background: red; } + rt { background: cyan; } + </style> +</head> +<body dir="rtl"> + <ruby><rb>base<rtc><rt>text</ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/bidi-2-ref.html b/layout/reftests/css-ruby/bidi-2-ref.html new file mode 100644 index 000000000..c46e956e0 --- /dev/null +++ b/layout/reftests/css-ruby/bidi-2-ref.html @@ -0,0 +1,39 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1141931 - Bidi reordering of ruby</title> + <link rel="stylesheet" href="common.css"> + <style> rb { margin: 0 5px; } </style> +</head> +<body> + <p> + <ruby> + <rb>base1</rb><rb>base2</rb> + <rt>text1</rt><rt>text2</rt> + <rb>base4</rb><rb>base3</rb> + <rt>text4</rt><rt>text3</rt> + </ruby> + <ruby> + <rb>base7</rb><rb>base8</rb> + <rt>text7</rt><rt>text8</rt> + <rb>base6</rb><rb>base5</rb> + <rt>text6</rt><rt>text5</rt> + </ruby> + </p> + <p style="text-align: right"> + <ruby> + <rb>base5</rb><rb>base6</rb> + <rt>text5</rt><rt>text6</rt> + <rb>base8</rb><rb>base7</rb> + <rt>text8</rt><rt>text7</rt> + </ruby> + <ruby> + <rb>base3</rb><rb>base4</rb> + <rt>text3</rt><rt>text4</rt> + <rb>base2</rb><rb>base1</rb> + <rt>text2</rt><rt>text1</rt> + </ruby> + </p> +</body> +</html> diff --git a/layout/reftests/css-ruby/bidi-2.html b/layout/reftests/css-ruby/bidi-2.html new file mode 100644 index 000000000..a2b2597b6 --- /dev/null +++ b/layout/reftests/css-ruby/bidi-2.html @@ -0,0 +1,51 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1141931 - Bidi reordering of ruby</title> + <link rel="stylesheet" href="common.css"> + <style> rb { margin: 0 5px; } </style> +</head> +<body> + <p> + <ruby> + <rb>base1</rb><rb>base2</rb> + <rtc dir="rtl"> + <rt>text1</rt><rt>text2</rt> + </rtc> + <rbc dir="rtl"> + <rb>base3</rb><rb>base4</rb> + </rbc> + <rt>text3</rt><rt>text4</rt> + </ruby> + <ruby dir="rtl"> + <rb>base5</rb><rb>base6</rb> + <rt>text5</rt><rt>text6</rt> + <rbc dir="ltr"> + <rb>base7</rb><rb>base8</rb> + </rbc> + <rt>text7</rt><rt>text8</rt> + </ruby> + </p> + <p dir="rtl"> + <ruby> + <rb>base1</rb><rb>base2</rb> + <rtc dir="ltr"> + <rt>text1</rt><rt>text2</rt> + </rtc> + <rbc dir="ltr"> + <rb>base3</rb><rb>base4</rb> + </rbc> + <rt>text3</rt><rt>text4</rt> + </ruby> + <ruby dir="ltr"> + <rb>base5</rb><rb>base6</rb> + <rt>text5</rt><rt>text6</rt> + <rbc dir="rtl"> + <rb>base7</rb><rb>base8</rb> + </rbc> + <rt>text7</rt><rt>text8</rt> + </ruby> + </p> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-1-ref.html b/layout/reftests/css-ruby/box-generation-1-ref.html new file mode 100644 index 000000000..55ea0b27e --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-1-ref.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body class="large"> + + <p>|<ruby><rbc><rb>a</rb><rb><span> </span></rb><rb>b</rb></rbc + ><rtc pseudo><rt>c</rt><rt pseudo><span> </span></rt><rt>d</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>e</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>f</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>g</rb></rbc><rtc><rt>h</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>i</rb><rb><span> <span>j</span> + </span></rb></rbc><rtc pseudo><rt>k</rt></rtc><rbc><rb><span> <span>l</span> + </span></rb></rbc><rbc><rb>m</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>n</rb></rbc + ><rtc><rt>o</rt></rtc><rtc><rt>p</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>q</rb></rbc><rtc pseudo><rt>r</rt></rtc + ><rtc><rt>s</rt></rtc><rtc pseudo><rt>t</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>u</rb></rbc><rbc><rb><span> <span>v</span> + <span>w</span> </span></rb></rbc><rtc><rt>x</rt></rtc><rbc><rb><span> + <span>y</span> </span></rb><rb>z</rb></rbc></ruby>|</p> + + <p>|<span> </span><ruby><rbc><rb>a</rb><rb><span> </span></rb><rb>b</rb></rbc + ><rtc pseudo><rt>c</rt><rt pseudo><span> </span></rt><rt>d</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>e</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>f</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>g</rb></rbc><rtc><rt>h</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>i</rb></rbc></ruby><span> <span>j</span> + </span><ruby><rbc></rbc><rtc pseudo><rt>k</rt></rtc></ruby><span> <span>l</span> + </span><ruby><rbc><rb>m</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>n</rb></rbc + ><rtc><rt>o</rt></rtc><rtc><rt>p</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>q</rb></rbc><rtc pseudo><rt>r</rt></rtc + ><rtc><rt>s</rt></rtc><rtc pseudo><rt>t</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>u</rb></rbc></ruby><span> <span>v</span> + <span>w</span> </span><ruby><rbc></rbc><rtc><rt>x</rt></rtc></ruby><span> + <span>y</span> </span><ruby><rbc><rb>z</rb></rbc></ruby><span> </span>|</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-1.html b/layout/reftests/css-ruby/box-generation-1.html new file mode 100644 index 000000000..2b829528f --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-1.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1088489#c13"> +</head> +<body class="large"> + + <p>|<ruby> + <rb>a</rb> <rb>b</rb> + <rt>c</rt> <rt>d</rt> + <rb>e</rb> <rbc><rb>f</rb></rbc> + <rb>g</rb> <rtc><rt>h</rt></rtc> + <rb>i</rb> <span>j</span> + <rt>k</rt> <span>l</span> + <rbc><rb>m</rb></rbc> <rbc><rb>n</rb></rbc> + <rtc><rt>o</rt></rtc> <rtc><rt>p</rt></rtc> + <rbc><rb>q</rb></rbc> <rt>r</rt> + <rtc><rt>s</rt></rtc> <rt>t</rt> + <rbc><rb>u</rb></rbc> <span>v</span> + <span>w</span> <rtc><rt>x</rt></rtc> + <span>y</span> <rb>z</rb> + </ruby>|</p> + + <p>| <rb>a</rb> <rb>b</rb> + <rt>c</rt> <rt>d</rt> + <rb>e</rb> <rbc><rb>f</rb></rbc> + <rb>g</rb> <rtc><rt>h</rt></rtc> + <rb>i</rb> <span>j</span> + <rt>k</rt> <span>l</span> + <rbc><rb>m</rb></rbc> <rbc><rb>n</rb></rbc> + <rtc><rt>o</rt></rtc> <rtc><rt>p</rt></rtc> + <rbc><rb>q</rb></rbc> <rt>r</rt> + <rtc><rt>s</rt></rtc> <rt>t</rt> + <rbc><rb>u</rb></rbc> <span>v</span> + <span>w</span> <rtc><rt>x</rt></rtc> + <span>y</span> <rb>z</rb> |</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-2-ref.html b/layout/reftests/css-ruby/box-generation-2-ref.html new file mode 100644 index 000000000..879681c4c --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-2-ref.html @@ -0,0 +1,49 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body class="large"> + + <p>|<ruby><rbc></rbc + ><rtc pseudo><rt>a</rt><rt pseudo><span> </span></rt><rt>b</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>c</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>d</rb></rbc + ><rtc pseudo><rt>e</rt></rtc><rtc><rt>f</rt></rtc + ><rtc pseudo><rt>g</rt></rtc><rbc><rb><span> h + </span></rb></rbc><rtc pseudo><rt>i</rt></rtc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>j</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>k</rb></rbc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>l</rb></rbc + ><rtc><rt>m</rt></rtc><rtc><rt>n</rt></rtc><rbc><rb><span> + o p + </span></rb></rbc><rtc><rt>q</rt></rtc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>r</rb></rbc><rbc><rb><span> + s </span></rb></rbc><rbc><rb>t</rb></rbc + ><rtc><rt>u</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>v</rb><rb><span> + </span></rb><rb>w</rb><rb><span> x + </span></rb><rb>y</rb></rbc><rtc pseudo><rt>z</rt></rtc></ruby>|</p> + + <p>|<span> </span><ruby><rbc></rbc + ><rtc pseudo><rt>a</rt><rt pseudo><span> </span></rt><rt>b</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>c</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>d</rb></rbc + ><rtc pseudo><rt>e</rt></rtc><rtc><rt>f</rt></rtc + ><rtc pseudo><rt>g</rt></rtc></ruby><span> h + </span><ruby><rbc></rbc><rtc pseudo><rt>i</rt></rtc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>j</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>k</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>l</rb></rbc + ><rtc><rt>m</rt></rtc><rtc><rt>n</rt></rtc></ruby><span> + o p + </span><ruby><rbc></rbc><rtc><rt>q</rt></rtc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>r</rb></rbc></ruby><span> + s </span><ruby><rbc><rb>t</rb></rbc + ><rtc><rt>u</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>v</rb><rb><span> + </span></rb><rb>w</rb></rbc></ruby><span> x + </span><ruby><rbc><rb>y</rb></rbc><rtc pseudo><rt>z</rt></rtc></ruby><span> </span>|</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-2.html b/layout/reftests/css-ruby/box-generation-2.html new file mode 100644 index 000000000..0d734aa75 --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-2.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1088489#c13"> +</head> +<body class="large"> + + <p>|<ruby> + <rt>a</rt> <rt>b</rt> + <rbc><rb>c</rb></rbc> <rbc><rb>d</rb></rbc> + <rt>e</rt> <rtc><rt>f</rt></rtc> + <rt>g</rt> <span>h</span> + <rt>i</rt> <rb>j</rb> + <rbc><rb>k</rb></rbc> <rb>l</rb> + <rtc><rt>m</rt></rtc> <rtc><rt>n</rt></rtc> + <span>o</span> <span>p</span> + <rtc><rt>q</rt></rtc> <rbc><rb>r</rb></rbc> + <span>s</span> <rbc><rb>t</rb></rbc> + <rtc><rt>u</rt></rtc> <rb>v</rb> + <rb>w</rb> <span>x</span> + <rb>y</rb> <rt>z</rt> + </ruby>|</p> + + <p>| <rt>a</rt> <rt>b</rt> + <rbc><rb>c</rb></rbc> <rbc><rb>d</rb></rbc> + <rt>e</rt> <rtc><rt>f</rt></rtc> + <rt>g</rt> <span>h</span> + <rt>i</rt> <rb>j</rb> + <rbc><rb>k</rb></rbc> <rb>l</rb> + <rtc><rt>m</rt></rtc> <rtc><rt>n</rt></rtc> + <span>o</span> <span>p</span> + <rtc><rt>q</rt></rtc> <rbc><rb>r</rb></rbc> + <span>s</span> <rbc><rb>t</rb></rbc> + <rtc><rt>u</rt></rtc> <rb>v</rb> + <rb>w</rb> <span>x</span> + <rb>y</rb> <rt>z</rt> |</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-3-ref.html b/layout/reftests/css-ruby/box-generation-3-ref.html new file mode 100644 index 000000000..65c3b8c1c --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-3-ref.html @@ -0,0 +1,45 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body class="large"> + + <p>|<ruby><rbc><rb>a</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>b</rb></rbc + ><rtc><rt>c</rt></rtc><rtc><rt>d</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>e</rb></rbc><rbc><rb><span> <span>f</span> + </span></rb></rbc><rbc><rb>g</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>h</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>i</rb></rbc><rtc pseudo><rt>j</rt></rtc + ><rtc><rt>k</rt></rtc><rtc pseudo><rt>l</rt></rtc><rbc><rb><span> + <span>m</span> <span>n</span> + </span></rb><rb>o</rb><rb><span> </span></rb><rb>p</rb><rb><span> + <span>q</span> </span></rb></rbc><rtc><rt>r</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>s</rb></rbc><rtc><rt>t</rt></rtc><rbc><rb><span> + <span>u</span> </span></rb></rbc><rtc pseudo><rt>v</rt><rt pseudo><span> + </span></rt><rt>w</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>x</rb></rbc + ><rtc pseudo><rt>y</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>z</rb></rbc + ></ruby>|</p> + + <p>|<span> </span><ruby><rbc><rb>a</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>b</rb></rbc + ><rtc><rt>c</rt></rtc><rtc><rt>d</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>e</rb></rbc></ruby><span> <span>f</span> + </span><ruby><rbc><rb>g</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>h</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>i</rb></rbc><rtc pseudo><rt>j</rt></rtc + ><rtc><rt>k</rt></rtc><rtc pseudo><rt>l</rt></rtc></ruby><span> + <span>m</span> <span>n</span> + </span><ruby><rbc><rb>o</rb><rb><span> </span></rb><rb>p</rb></rbc></ruby><span> + <span>q</span> </span><ruby><rbc></rbc><rtc><rt>r</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>s</rb></rbc><rtc><rt>t</rt></rtc></ruby><span> + <span>u</span> </span><ruby><rbc></rbc><rtc pseudo><rt>v</rt><rt pseudo><span> + </span><rt>w</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>x</rb></rbc + ><rtc pseudo><rt>y</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>z</rb></rbc></ruby + ><span> </span>|</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-3.html b/layout/reftests/css-ruby/box-generation-3.html new file mode 100644 index 000000000..8a4c43e71 --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-3.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1088489#c13"> +</head> +<body class="large"> + + <p>|<ruby> + <rbc><rb>a</rb></rbc> <rbc><rb>b</rb></rbc> + <rtc><rt>c</rt></rtc> <rtc><rt>d</rt></rtc> + <rbc><rb>e</rb></rbc> <span>f</span> + <rbc><rb>g</rb></rbc> <rb>h</rb> + <rbc><rb>i</rb></rbc> <rt>j</rt> + <rtc><rt>k</rt></rtc> <rt>l</rt> + <span>m</span> <span>n</span> + <rb>o</rb> <rb>p</rb> + <span>q</span> <rtc><rt>r</rt></rtc> + <rb>s</rb> <rtc><rt>t</rt></rtc> + <span>u</span> <rt>v</rt> + <rt>w</rt> <rb>x</rb> + <rt>y</rt> <rbc><rb>z</rb></rbc> + </ruby>|</p> + + <p>| <rbc><rb>a</rb></rbc> <rbc><rb>b</rb></rbc> + <rtc><rt>c</rt></rtc> <rtc><rt>d</rt></rtc> + <rbc><rb>e</rb></rbc> <span>f</span> + <rbc><rb>g</rb></rbc> <rb>h</rb> + <rbc><rb>i</rb></rbc> <rt>j</rt> + <rtc><rt>k</rt></rtc> <rt>l</rt> + <span>m</span> <span>n</span> + <rb>o</rb> <rb>p</rb> + <span>q</span> <rtc><rt>r</rt></rtc> + <rb>s</rb> <rtc><rt>t</rt></rtc> + <span>u</span> <rt>v</rt> + <rt>w</rt> <rb>x</rb> + <rt>y</rt> <rbc><rb>z</rb></rbc> |</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-4-ref.html b/layout/reftests/css-ruby/box-generation-4-ref.html new file mode 100644 index 000000000..8670d54a4 --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-4-ref.html @@ -0,0 +1,49 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body class="large"> + + <p>|<ruby><rbc></rbc + ><rtc><rt>a</rt></rtc><rtc><rt>b</rt></rtc><rbc><rb><span> + <span>c</span> <span>d</span> + </span></rb></rbc><rtc><rt>e</rt></rtc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>f</rb></rbc + ><rtc><rt>g</rt></rtc><rtc pseudo><rt>h</rt></rtc + ><rtc><rt>i</rt></rtc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>j</rb></rbc><rbc><rb><span> + <span>k</span> </span></rb></rbc><rbc><rb>l</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>m</rb><rb><span> </span></rb><rb>n</rb></rbc + ><rtc pseudo><rt>o</rt><rt pseudo><span> </span></rt><rt>p</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>q</rb><rb><span> <span>r</span> + </span></rb></rbc><rtc pseudo><rt>s</rt></rtc><rbc><rb><span> <span>t</span> + </span></rb></rbc><rbc><rb>u</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>v</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>w</rb></rbc><rtc pseudo><rt>x</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>y</rb></rbc><rtc><rt>z</rt></rtc + ></ruby>|</p> + + <p>|<span> </span><ruby><rbc></rbc + ><rtc><rt>a</rt></rtc><rtc><rt>b</rt></rtc></ruby><span> + <span>c</span> <span>d</span> + </span><ruby><rbc></rbc><rtc><rt>e</rt></rtc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>f</rb></rbc + ><rtc><rt>g</rt></rtc><rtc pseudo><rt>h</rt></rtc + ><rtc><rt>i</rt></rtc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>j</rb></rbc></ruby><span> + <span>k</span> </span><ruby><rbc><rb>l</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>m</rb><rb><span> </span></rb><rb>n</rb></rbc + ><rtc pseudo><rt>o</rt><rt pseudo><span> </span></rt><rt>p</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>q</rb></rbc></ruby><span> <span>r</span> + </span><ruby><rbc></rbc><rtc pseudo><rt>s</rt></rtc></ruby><span> <span>t</span> + </span><ruby><rbc><rb>u</rb></rbc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>v</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>w</rb></rbc><rtc pseudo><rt>x</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>y</rb></rbc><rtc><rt>z</rt></rtc></ruby + ><span> </span>|</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-4.html b/layout/reftests/css-ruby/box-generation-4.html new file mode 100644 index 000000000..2dc24d3ee --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-4.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1088489#c13"> +</head> +<body class="large"> + + <p>|<ruby> + <rtc><rt>a</rt></rtc> <rtc><rt>b</rt></rtc> + <span>c</span> <span>d</span> + <rtc><rt>e</rt></rtc> <rb>f</rb> + <rtc><rt>g</rt></rtc> <rt>h</rt> + <rtc><rt>i</rt></rtc> <rbc><rb>j</rb></rbc> + <span>k</span> <rbc><rb>l</rb></rbc> + <rb>m</rb> <rb>n</rb> + <rt>o</rt> <rt>p</rt> + <rb>q</rb> <span>r</span> + <rt>s</rt> <span>t</span> + <rb>u</rb> <rbc><rb>v</rb></rbc> + <rbc><rb>w</rb></rbc> <rt>x</rt> + <rbc><rb>y</rb></rbc> <rtc><rt>z</rt></rtc> + </ruby>|</p> + + <p>| <rtc><rt>a</rt></rtc> <rtc><rt>b</rt></rtc> + <span>c</span> <span>d</span> + <rtc><rt>e</rt></rtc> <rb>f</rb> + <rtc><rt>g</rt></rtc> <rt>h</rt> + <rtc><rt>i</rt></rtc> <rbc><rb>j</rb></rbc> + <span>k</span> <rbc><rb>l</rb></rbc> + <rb>m</rb> <rb>n</rb> + <rt>o</rt> <rt>p</rt> + <rb>q</rb> <span>r</span> + <rt>s</rt> <span>t</span> + <rb>u</rb> <rbc><rb>v</rb></rbc> + <rbc><rb>w</rb></rbc> <rt>x</rt> + <rbc><rb>y</rb></rbc> <rtc><rt>z</rt></rtc> |</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-5-ref.html b/layout/reftests/css-ruby/box-generation-5-ref.html new file mode 100644 index 000000000..32ed1f97e --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-5-ref.html @@ -0,0 +1,47 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body class="large"> + + <p>|<ruby><rbc><rb><span><span>a</span> <span>b</span> + </span></rb><rb>c</rb><rb><span> </span></rb><rb>d</rb><rb><span> + <span>e</span> </span></rb></rbc><rtc pseudo><rt>f</rt></rtc><rbc><rb><span> + <span>g</span> </span></rb></rbc><rbc><rb>h</rb></rbc><rbc><rb><span> + <span>i</span> </span></rb></rbc><rtc><rt>j</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>k</rb></rbc><rtc><rt>l</rt></rtc + ><rtc pseudo><rt>m</rt><rt pseudo><span> </span></rt><rt>n</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>o</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>p</rb></rbc + ><rtc pseudo><rt>q</rt></rtc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>r</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>s</rb></rbc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>t</rb></rbc + ><rtc pseudo><rt>u</rt></rtc><rtc><rt>v</rt></rtc + ><rtc><rt>w</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>x</rb></rbc + ><rtc><rt>y</rt></rtc><rbc><rb><span> <span>z</span></span></rb></rbc + ></ruby>|</p> + + <p>|<span> <span>a</span> <span>b</span> + </span><ruby + ><rbc><rb>c</rb><rb><span> </span></rb><rb>d</rb></rbc></ruby><span> + <span>e</span> </span><ruby><rbc></rbc><rtc pseudo><rt>f</rt></rtc></ruby><span> + <span>g</span> </span><ruby><rbc><rb>h</rb></rbc></ruby><span> + <span>i</span> </span><ruby><rbc></rbc><rtc><rt>j</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>k</rb></rbc><rtc><rt>l</rt></rtc + ><rtc pseudo><rt>m</rt><rt pseudo><span> </span></rt><rt>n</rt></rtc><rbc><rb><span> + </span></rb></rbc><rbc><rb>o</rb></rbc + ><rbc><rb><span> </span></rb></rbc><rbc><rb>p</rb></rbc + ><rtc pseudo><rt>q</rt></rtc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>r</rb></rbc><rbc><rb><span> + </span></rb></rbc><rbc><rb>s</rb></rbc><rbc><rb><span> </span></rb></rbc + ><rbc><rb>t</rb></rbc + ><rtc pseudo><rt>u</rt></rtc><rtc><rt>v</rt></rtc + ><rtc><rt>w</rt></rtc><rbc><rb><span> </span></rb></rbc><rbc><rb>x</rb></rbc + ><rtc><rt>y</rt></rtc></ruby><span> <span>z</span> </span>|</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-generation-5.html b/layout/reftests/css-ruby/box-generation-5.html new file mode 100644 index 000000000..043cf7576 --- /dev/null +++ b/layout/reftests/css-ruby/box-generation-5.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1088489 - Test for pseudo ruby box generation</title> + <link rel="stylesheet" href="common.css"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1088489#c13"> +</head> +<body class="large"> + + <p>|<ruby> + <span>a</span> <span>b</span> + <rb>c</rb> <rb>d</rb> + <span>e</span> <rt>f</rt> + <span>g</span> <rbc><rb>h</rb></rbc> + <span>i</span> <rtc><rt>j</rt></rtc> + <rb>k</rb> <rtc><rt>l</rt></rtc> + <rt>m</rt> <rt>n</rt> + <rbc><rb>o</rb></rbc> <rbc><rb>p</rb></rbc> + <rt>q</rt> <rb>r</rb> + <rbc><rb>s</rb></rbc> <rb>t</rb> + <rt>u</rt> <rtc><rt>v</rt></rtc> + <rtc><rt>w</rt></rtc> <rbc><rb>x</rb></rbc> + <rtc><rt>y</rt></rtc> <span>z</span> + </ruby>|</p> + + <p>| <span>a</span> <span>b</span> + <rb>c</rb> <rb>d</rb> + <span>e</span> <rt>f</rt> + <span>g</span> <rbc><rb>h</rb></rbc> + <span>i</span> <rtc><rt>j</rt></rtc> + <rb>k</rb> <rtc><rt>l</rt></rtc> + <rt>m</rt> <rt>n</rt> + <rbc><rb>o</rb></rbc> <rbc><rb>p</rb></rbc> + <rt>q</rt> <rb>r</rb> + <rbc><rb>s</rb></rbc> <rb>t</rb> + <rt>u</rt> <rtc><rt>v</rt></rtc> + <rtc><rt>w</rt></rtc> <rbc><rb>x</rb></rbc> + <rtc><rt>y</rt></rtc> <span>z</span> |</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-1-ref.html b/layout/reftests/css-ruby/box-properties-1-ref.html new file mode 100644 index 000000000..a8e340653 --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-1-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> +</head> +<body style="line-height: 5;"> + <div> + |<span style="background: aqua; padding: 10px; border: 12px solid red; outline: 5px solid yellow; margin: 10px;" + ><span>base1</span> + <!-- width: 256px = 300px - 2 * (padding: 2px + border: 4px + margin: 16px) --> + <span style="background: green; padding: 2px; border: 4px solid blue; outline: 8px solid pink; margin: 16px;"><div style="display: inline-block; text-align: center; width: 256px; line-height: normal;">base2</div></span> + <span>base3</span + ></span>| + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-1.html b/layout/reftests/css-ruby/box-properties-1.html new file mode 100644 index 000000000..1b463eb5b --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-1.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="line-height: 5;"> + <div> + |<ruby style="background: aqua; padding: 10px; border: 12px solid red; outline: 5px solid yellow; margin: 10px;"> + <rb>base1</rb> + <rb style="background: green; padding: 2px; border: 4px solid blue; outline: 8px solid pink; margin: 16px;">base2</rb> + <rb>base3</rb> + <rtc style="font-size: 0;"> + <rt></rt> + <rt><div style="width: 300px; height: 0px;"></div></rt> + </rtc> + </ruby>| + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-2-ref.html b/layout/reftests/css-ruby/box-properties-2-ref.html new file mode 100644 index 000000000..5abfa2e84 --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-2-ref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> +</head> +<body style="line-height: 10"> + <ruby> + <rb>base1</rb> + <rb><div></div></rb> + <rb>base3</rb> + <rtc> + <rt></rt> + <rt style="margin: 22px 0;"><div id="rtblock" style="width: 256px; text-align:center; background: silver; padding: 2px; border: 4px solid gray; outline: 8px solid black; margin: 16px;"><span id="inline">text1</span></div></rt> + <!-- margin: 22px = margin: 16px + padding: 2px + border: 4px --> + <!-- width: 256px = 300px - 2 * (padding: 2px + border: 4px + margin: 16px) --> + </rtc> + </ruby> + <script type="text/javascript"> + // normal height of an one-line inline-block is the line-height, + // we need to adjust it to the height of the inline box to simulate + // the ruby text box. + makeBSizeMatchInlineBox(document.getElementById('rtblock'), + document.getElementById('inline')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-2.html b/layout/reftests/css-ruby/box-properties-2.html new file mode 100644 index 000000000..ca1201693 --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-2.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> +</head> +<body style="line-height: 10"> + <ruby> + <rb>base1</rb> + <rb><div style="width: 300px;"></div></rb> + <rb>base3</rb> + <rtc> + <rt></rt> + <rt style="background: silver; padding: 2px; border: 4px solid gray; outline: 8px solid black; margin: 16px;"><div id="rtblock"><span id="inline">text1</span></div></rt> + </rtc> + </ruby> + <script type="text/javascript"> + // alter the height to make it easier to match the reference page + makeBSizeMatchInlineBox(document.getElementById('rtblock'), + document.getElementById('inline')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-3-ref.html b/layout/reftests/css-ruby/box-properties-3-ref.html new file mode 100644 index 000000000..465e54758 --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-3-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="line-height: 5"> + <ruby> + <rbc> + <rb style="background: aqua; outline: 8px solid teal; margin: 16px;">base1</rb> + </rbc><rbc></rbc> + <rtc> + <rt style="outline: 8px solid purple;"><span style="background: fuchsia">text1</span></rt> + </rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-3.html b/layout/reftests/css-ruby/box-properties-3.html new file mode 100644 index 000000000..6b014c268 --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-3.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="line-height: 5"> + <ruby> + <rbc style="background: aqua; padding: 2px; border: 4px solid red; outline: 8px solid teal; margin: 16px;"> + <rb>base1</rb> + </rbc><rbc></rbc> + <rtc style="background: fuchsia; padding: 2px; border: 4px solid red; outline: 8px solid purple; margin: 16px;"> + <rt>text1</rt> + </rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-4-ref.html b/layout/reftests/css-ruby/box-properties-4-ref.html new file mode 100644 index 000000000..db6788daa --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-4-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> + <link rel="stylesheet" href="common.css"> + <style> + .inside { + display: inline-block; + width: 50px; height: 10px; + background: black; + } + </style> +</head> +<body> + <div style="width: 80px"> + <span style="background: silver; padding: 0 20px; border: 10px solid gray; border-width: 0 10px;" + ><div class="inside"></div + ><div class="inside" style="padding: 0 15px;"></div + ><div class="inside"></div + ></span> + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/box-properties-4.html b/layout/reftests/css-ruby/box-properties-4.html new file mode 100644 index 000000000..6e953bc3a --- /dev/null +++ b/layout/reftests/css-ruby/box-properties-4.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055667 - Box properties on ruby boxes</title> + <link rel="stylesheet" href="common.css"> + <style> + .inside { + width: 50px; height: 10px; + background: black; + } + </style> +</head> +<body> + <div style="width: 80px"> + <ruby style="background: silver; padding: 0 20px; border: 10px solid gray; border-width: 0 10px;" + ><rb><div class="inside"></div></rb + ><rb><div class="inside" style="padding: 0 15px;"></div></rb + ><rb><div class="inside"></div></rb + ></ruby> + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/bug1181890-notref.html b/layout/reftests/css-ruby/bug1181890-notref.html new file mode 100644 index 000000000..0e97415a8 --- /dev/null +++ b/layout/reftests/css-ruby/bug1181890-notref.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<p style="ruby-align: start"> + <ruby><rb>A</rb><rt>aaaaaaaaaaaa</rt></ruby> + <ruby><rb>BBBBB</rb><rt>b</rt></ruby> +</p> +<p style="ruby-align: start"> + <ruby><rb>A</rb><rt>aaaaaaaaaaaa</rt></ruby> + <ruby><rb>BBBBB</rb><rt>b</rt></ruby> +</p> diff --git a/layout/reftests/css-ruby/bug1181890-ref.html b/layout/reftests/css-ruby/bug1181890-ref.html new file mode 100644 index 000000000..41a46d13e --- /dev/null +++ b/layout/reftests/css-ruby/bug1181890-ref.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<p style="ruby-align: center"> + <ruby><rb>A</rb><rt>aaaaaaaaaaaa</rt></ruby> + <ruby><rb>BBBBB</rb><rt>b</rt></ruby> +</p> +<p style="ruby-align: space-between"> + <ruby><rb>A</rb><rt>aaaaaaaaaaaa</rt></ruby> + <ruby><rb>BBBBB</rb><rt>b</rt></ruby> +</p> diff --git a/layout/reftests/css-ruby/bug1181890.html b/layout/reftests/css-ruby/bug1181890.html new file mode 100644 index 000000000..3369a7482 --- /dev/null +++ b/layout/reftests/css-ruby/bug1181890.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<p style="ruby-align: center"> + <ruby><rb>A</rb><rt>aaaaaaaaaaaa</rt></ruby> + <ruby><rb>BBBBB</rb><rt>b</rt></ruby> +</p> +<p style="ruby-align: space-between"> + <ruby><rb>A</rb><rt>aaaaaaaaaaaa</rt></ruby> + <ruby><rb>BBBBB</rb><rt>b</rt></ruby> +</p> +‎ diff --git a/layout/reftests/css-ruby/common.css b/layout/reftests/css-ruby/common.css new file mode 100644 index 000000000..45bdd379c --- /dev/null +++ b/layout/reftests/css-ruby/common.css @@ -0,0 +1,22 @@ +@font-face { + font-family: Ahem; + src: url(../fonts/Ahem.ttf); +} +rbc { + display: ruby-base-container; + unicode-bidi: isolate; +} +[pseudo] { + font-size: inherit; + line-height: inherit; +} +[pseudo] > rt { + font-size: 50%; +} +[pseudo] > rt[pseudo] { + font-size: inherit; +} + +.large { + font-size: 200%; +} diff --git a/layout/reftests/css-ruby/dynamic-insertion-1-ref.html b/layout/reftests/css-ruby/dynamic-insertion-1-ref.html new file mode 100644 index 000000000..b174b85c8 --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-insertion-1-ref.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic insertion of ruby frames</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + + <p>One space should exist between 'a' and 'b':</p> + + <p>a<rbc><rb></rb> <rb></rb></rbc>b</p> + <p>a<ruby><rb></rb> <rb></rb></ruby>b</p> + <p>a<ruby><rbc></rbc> <rbc></rbc></ruby>b</p> + <p>a<rtc><rt></rt> <rt></rt></rtc>b</p> + <p>a<ruby><rt></rt> <rt></rt></ruby>b</p> + + <p>a<rbc><rb></rb> <rb></rb></rbc>b</p> + <p>a<ruby><rb></rb> <rb></rb></ruby>b</p> + <p>a<ruby><rbc></rbc> <rbc></rbc></ruby>b</p> + <p>a<rtc><rt></rt> <rt></rt></rtc>b</p> + <p>a<ruby><rt></rt> <rt></rt></ruby>b</p> + + <p>a<rb></rb><span></span> <rt></rt>b</p> + <p>a<rb></rb> <span></span><rt></rt>b</p> + <p>a<rb></rb> <rb></rb><rt></rt>b</p> + <p>a<rt></rt><rb></rb> <rb></rb>b</p> + <p>a<rbc></rbc> <rbc></rbc><rt></rt>b</p> + <p>a<rb></rb><rt></rt> <rt></rt>b</p> + <p>a<rt></rt> <rt></rt><rb></rb>b</p> + + <p>a<rb></rb> <rb></rb>b</p> + <p>a<rbc></rbc> <rbc></rbc>b</p> + <p>a<rt></rt> <rt></rt>b</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-insertion-1.html b/layout/reftests/css-ruby/dynamic-insertion-1.html new file mode 100644 index 000000000..72bf5aeb6 --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-insertion-1.html @@ -0,0 +1,55 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic insertion of ruby frames</title> + <link rel="stylesheet" href="common.css"> + <script src="dynamic-insertion.js"></script> +</head> +<body> + + <p>One space should exist between 'a' and 'b':</p> + + <!-- leading white space --> + <!-- => inter-base white space --> + <p>a<rbc data-insert="start" data-tag="rb"> <rb></rb></rbc>b</p> + <p>a<ruby data-insert="start" data-tag="rb"> <rb></rb></ruby>b</p> + <!-- => inter-segment white space --> + <p>a<ruby data-insert="start" data-tag="rbc"> <rbc></rbc></ruby>b</p> + <!-- => inter-annotation white space --> + <p>a<rtc data-insert="start" data-tag="rt"> <rt></rt></rtc>b</p> + <p>a<ruby data-insert="start" data-tag="rt"> <rt></rt></ruby>b</p> + + <!-- trailing white space --> + <!-- => inter-base white space --> + <p>a<rbc data-insert="end" data-tag="rb"><rb></rb> </rbc>b</p> + <p>a<ruby data-insert="end" data-tag="rb"><rb></rb> </ruby>b</p> + <!-- => inter-segment white space --> + <p>a<ruby data-insert="end" data-tag="rbc"><rbc></rbc> </ruby>b</p> + <!-- => inter-annotation white space --> + <p>a<rtc data-insert="end" data-tag="rt"><rt></rt> </rtc>b</p> + <p>a<ruby data-insert="end" data-tag="rt"><rt></rt> </ruby>b</p> + + <!-- inter-level white space --> + <!-- => normal white space --> + <p>a<rb data-insert="after" data-tag="span"></rb> <rt></rt>b</p> + <p>a<rb></rb> <rt data-insert="before" data-tag="span"></rt>b</p> + <!-- => inter-base white space --> + <p>a<rb></rb> <rt data-insert="before" data-tag="rb"></rt>b</p> + <p>a<rt data-insert="after" data-tag="rb"></rt> <rb></rb>b</p> + <!-- => inter-segment white space --> + <p>a<rbc></rbc> <rt data-insert="before" data-tag="rbc"></rt>b</p> + <!-- => inter-annotation white space --> + <p>a<rb data-insert="after" data-tag="rt"></rb> <rt></rt>b</p> + <p>a<rt></rt> <rb data-insert="before" data-tag="rt"></rb>b</p> + + <!-- insert white space --> + <!-- inter-base white space --> + <p>a<rb data-insert="after" data-text=" "></rb><rb></rb>b</p> + <!-- inter-segment white space --> + <p>a<rbc data-insert="after" data-text=" "></rbc><rbc></rbc>b</p> + <!-- inter-annotation white space --> + <p>a<rt data-insert="after" data-text=" "></rt><rt></rt>b</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-insertion-2-ref.html b/layout/reftests/css-ruby/dynamic-insertion-2-ref.html new file mode 100644 index 000000000..eba1901bf --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-insertion-2-ref.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic insertion of ruby frames</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + + <p>No space should exist between 'a' and 'b':</p> + + <p><span>a</span><rb></rb> <rt></rt>b</p> + <p>a<rb></rb> <rt></rt><span>b</span></p> + <p>a<rb></rb> <rt></rt><rb></rb>b</p> + <p>a<rbc></rbc> <rt></rt><rb></rb>b</p> + <p>a<rt></rt><rb></rb> <rt></rt>b</p> + + <p>a<ruby> <rb></rb></ruby>b</p> + <p>a<rbc> <rb></rb></rbc>b</p> + <p>a<rtc> <rt></rt></rtc>b</p> + <p>a<ruby><rb></rb> </ruby>b</p> + <p>a<rbc><rb></rb> </rbc>b</p> + <p>a<rtc><rt></rt> </rtc>b</p> + <p>a<rb></rb> <rt></rt>b</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-insertion-2.html b/layout/reftests/css-ruby/dynamic-insertion-2.html new file mode 100644 index 000000000..c1ec56594 --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-insertion-2.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic insertion of ruby frames</title> + <link rel="stylesheet" href="common.css"> + <script src="dynamic-insertion.js"></script> +</head> +<body> + + <p>No space should exist between 'a' and 'b':</p> + + <!-- inter-level white space --> + <!-- <= normal white space --> + <p><span data-insert="after" data-tag="rb">a</span> <rt></rt>b</p> + <p>a<rb></rb> <span data-insert="before" data-tag="rt">b</span></p> + <!-- <= inter-base white space --> + <p>a<rb></rb> <rb data-insert="before" data-tag="rt"></rb>b</p> + <!-- <= inter-segment white space --> + <p>a<rbc></rbc> <rb data-insert="before" data-tag="rt"></rb>b</p> + <!-- <= inter-annotation white space --> + <p>a<rt data-insert="after" data-tag="rb"></rt> <rt></rt>b</p> + + <!-- insert white space --> + <!-- leading white space --> + <p>a<ruby data-insert="start" data-text=" "><rb></rb></ruby>b</p> + <p>a<rbc data-insert="start" data-text=" "><rb></rb></rbc>b</p> + <p>a<rtc data-insert="start" data-text=" "><rt></rt></rtc>b</p> + <!-- trailing white space --> + <p>a<ruby data-insert="end" data-text=" "><rb></rb></ruby>b</p> + <p>a<rbc data-insert="end" data-text=" "><rb></rb></rbc>b</p> + <p>a<rtc data-insert="end" data-text=" "><rt></rt></rtc>b</p> + <!-- inter-level white space --> + <p>a<rb data-insert="after" data-text=" "></rb><rt></rt>b</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-insertion-3-ref.html b/layout/reftests/css-ruby/dynamic-insertion-3-ref.html new file mode 100644 index 000000000..a26c3d4fe --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-insertion-3-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic insertion of ruby frames</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + + <p>'a' and 'b' should be paired with 'x' and 'y' respectively:</p> + + <p><rb></rb><span></span><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + <p><rb></rb><rt></rt><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + <p><rb>a</rb><rt>x</rt><rb>b</rb><rt>y</rt></p> + <p><rbc><span>a</span><rb></rb>b</rbc><rt>x</rt><rt></rt><rt>y</rt></p> + <p><rb>a</rb><rb></rb><rb>b</rb><rtc><span>x</span><rt></rt>y</rtc></p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-insertion-3.html b/layout/reftests/css-ruby/dynamic-insertion-3.html new file mode 100644 index 000000000..f19d70260 --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-insertion-3.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic insertion of ruby frames</title> + <link rel="stylesheet" href="common.css"> + <script src="dynamic-insertion.js"></script> +</head> +<body> + + <p>'a' and 'b' should be paired with 'x' and 'y' respectively:</p> + + <!-- split --> + <!-- pseudo ruby --> + <p><rb data-insert="after" data-tag="span"></rb><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + <!-- pseudo ruby base container --> + <p><rb data-insert="after" data-tag="rt"></rb><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + <!-- pseudo ruby text container --> + <p><rb>a</rb><rt data-insert="after" data-tag="rb" data-text="b">x</rt><rt>y</rt></p> + <!-- pseudo ruby base --> + <p><rbc><span data-insert="after" data-tag="rb">a</span>b</rbc><rt>x</rt><rt></rt><rt>y</rt></p> + <!-- pseudo ruby text --> + <p><rb>a</rb><rb></rb><rb>b</rb><rtc><span data-insert="after" data-tag="rt">x</span>y</rtc></p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-insertion.js b/layout/reftests/css-ruby/dynamic-insertion.js new file mode 100644 index 000000000..0bf6cd969 --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-insertion.js @@ -0,0 +1,42 @@ +window.onload = function() { + // Force a reflow before any changes. + document.body.clientWidth; + + var elems = document.querySelectorAll('[data-insert]'); + Array.from(elems).forEach(function(e) { + var parent, ref; + switch (e.dataset.insert) { + case 'start': + parent = e; + ref = e.firstChild; + break; + + case 'end': + parent = e; + ref = null; + break; + + case 'before': + parent = e.parentNode; + ref = e; + break; + + case 'after': + parent = e.parentNode; + ref = e.nextSibling; + break; + } + + var elem, textnode; + if ('text' in e.dataset) { + textnode = document.createTextNode(e.dataset.text); + } + if ('tag' in e.dataset) { + elem = document.createElement(e.dataset.tag); + if (textnode) { + elem.appendChild(textnode); + } + } + parent.insertBefore(elem ? elem : textnode, ref); + }); +}; diff --git a/layout/reftests/css-ruby/dynamic-removal-1-ref.html b/layout/reftests/css-ruby/dynamic-removal-1-ref.html new file mode 100644 index 000000000..5fdcd8a7d --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-removal-1-ref.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic removal of ruby frames</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + + <p>No space should exist between 'a' and 'b':</p> + + <p>a<ruby> <rb></rb></ruby>b</p> + <p>a<ruby><rb></rb> </ruby>b</p> + <p>a<ruby><rb></rb> <rt></rt></ruby>b</p> + + <p>a<ruby> <rbc></rbc></ruby>b</p> + <p>a<ruby><rbc></rbc> </ruby>b</p> + <p>a<rbc></rbc> <rtc></rtc>b</p> + + <p><rb>a</rb><rb>b</rb><rtc> <rt>x</rt></rtc></p> + <p><rb>a</rb><rb>b</rb><rtc><rt>x</rt> </rtc></p> + <p><rb>a</rb><rb>b</rb> <rt>x</rt></p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-removal-1.html b/layout/reftests/css-ruby/dynamic-removal-1.html new file mode 100644 index 000000000..edff9246e --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-removal-1.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic removal of ruby frames</title> + <link rel="stylesheet" href="common.css"> + <script src="dynamic-removal.js"></script> +</head> +<body> + + <p>No space should exist between 'a' and 'b':</p> + + <!-- inter-base white space --> + <!-- => leading white space --> + <p>a<ruby><rb class="remove"></rb> <rb></rb></ruby>b</p> + <!-- => trailing white space --> + <p>a<ruby><rb></rb> <rb class="remove"></rb></ruby>b</p> + <!-- => inter-level white space --> + <p>a<ruby><rb></rb> <rb class="remove"></rb><rt></rt></ruby>b</p> + + <!-- inter-segment white space --> + <!-- => leading white space --> + <p>a<ruby><rbc class="remove"></rbc> <rbc></rbc></ruby>b</p> + <!-- => trailing white space --> + <p>a<ruby><rbc></rbc> <rbc class="remove"></rbc></ruby>b</p> + <!-- => inter-level white space --> + <p>a<rbc></rbc> <rbc class="remove"></rbc><rtc></rtc>b</p> + + <!-- inter-annotation white space --> + <!-- => leading white space --> + <p><rb>a</rb><rb>b</rb><rtc><rt class="remove"></rt> <rt>x</rt></rtc></p> + <!-- => trailing white space --> + <p><rb>a</rb><rb>b</rb><rtc><rt>x</rt> <rt class="remove"></rt></rtc></p> + <!-- => inter-level white space --> + <p><rb>a</rb><rb>b</rb><rt class="remove"></rt> <rt>x</rt></p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-removal-2-ref.html b/layout/reftests/css-ruby/dynamic-removal-2-ref.html new file mode 100644 index 000000000..53500358c --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-removal-2-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic removal of ruby frames</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + + <p>One space should exist between 'a' and 'b':</p> + + <p>a <rt></rt>b</p> + <p>a<rb></rb> b</p> + <p>a<rb></rb> <rb></rb>b</p> + <p>a<rbc></rbc> <rbc></rbc>b</p> + <p><rb>a</rb> <rb>b</rb><rt>x</rt> <rt>y</rt></p> + +</body> diff --git a/layout/reftests/css-ruby/dynamic-removal-2.html b/layout/reftests/css-ruby/dynamic-removal-2.html new file mode 100644 index 000000000..f1d3cb67c --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-removal-2.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic removal of ruby frames</title> + <link rel="stylesheet" href="common.css"> + <script src="dynamic-removal.js"></script> +</head> +<body> + + <p>One space should exist between 'a' and 'b':</p> + + <!-- inter-level white space --> + <!-- => normal white space --> + <p>a<rb class="remove"></rb> <rt></rt>b</p> + <p>a<rb></rb> <rt class="remove"></rt>b</p> + <!-- => inter-base white space --> + <p>a<rb></rb> <rt class="remove"></rt><rb></rb>b</p> + <!-- => inter-segment white space --> + <p>a<rbc></rbc> <rtc class="remove"></rtc><rbc></rbc>b</p> + <!-- => inter-annotation white space --> + <p><rb>a</rb> <rb>b</rb><rt>x</rt><rb class="remove"></rb> <rt>y</rt></p> + +</body> diff --git a/layout/reftests/css-ruby/dynamic-removal-3-ref.html b/layout/reftests/css-ruby/dynamic-removal-3-ref.html new file mode 100644 index 000000000..2f36b2c7a --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-removal-3-ref.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic removal of ruby frames</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + + <p>'a' and 'b' should be paired with 'x' and 'y' respectively:</p> + + + <p><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + <p><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + <p><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + + <p><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + <p><rb>a</rb><rb>b</rb><rt>x</rt><rt>y</rt></p> + + <p>'ab' should be paried with 'xy':</p> + + <p><rbc>ab</rbc><rt>xy</rt></p> + <p><rb>ab</rb><rtc style="letter-spacing: 1px">xy</rtc></p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-removal-3.html b/layout/reftests/css-ruby/dynamic-removal-3.html new file mode 100644 index 000000000..4d757ecec --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-removal-3.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1087872 - Test for dynamic removal of ruby frames</title> + <link rel="stylesheet" href="common.css"> + <script src="dynamic-removal.js"></script> +</head> +<body> + + <p>'a' and 'b' should be paired with 'x' and 'y' respectively:</p> + + <!-- merge --> + <!-- pseudo ruby --> + <p><rb>a</rb><span class="remove"></span><rb>b</rb><rt>x</rt><rt>y</rt></p> + <!-- pseudo ruby base container --> + <p><rb>a</rb><rt class="remove"></rt><rb>b</rb><rt>x</rt><rt>y</rt></p> + <!-- pseudo ruby text container --> + <p><rb>a</rb><rb>b</rb><rt>x</rt><rb class="remove"></rb><rt>y</rt></p> + + <!-- white space removal --> + <!-- inter-base white space --> + <p><rb class="remove-after">a</rb> <rb>b</rb><rt>x</rt><rt>y</rt></p> + <!-- inter-annotation white space --> + <p><rb>a</rb><rb>b</rb><rt class="remove-after">x</rt> <rt>y</rt></p> + + <p>'ab' should be paried with 'xy':</p> + + <!-- merge --> + <!-- pseudo ruby base --> + <p><rbc>a<rb class="remove"></rb>b</rbc><rt>xy</rt></p> + <!-- pseudo ruby text --> + <!-- letter-spacing is added here to avoid fuzzy on Windows. See bug 1111891 --> + <p><rb>ab</rb><rtc style="letter-spacing: 1px">x<rt class="remove"></rt>y</rtc></p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/dynamic-removal.js b/layout/reftests/css-ruby/dynamic-removal.js new file mode 100644 index 000000000..f258f28cf --- /dev/null +++ b/layout/reftests/css-ruby/dynamic-removal.js @@ -0,0 +1,14 @@ +function getElements(className) { + return Array.from(document.getElementsByClassName(className)); +} +window.onload = function() { + // Force a reflow before any changes. + document.body.clientWidth; + + getElements('remove').forEach(function(e) { + e.parentNode.removeChild(e); + }); + getElements('remove-after').forEach(function(e) { + e.parentNode.removeChild(e.nextSibling); + }); +}; diff --git a/layout/reftests/css-ruby/float-handling-ref.html b/layout/reftests/css-ruby/float-handling-ref.html new file mode 100644 index 000000000..d95796d32 --- /dev/null +++ b/layout/reftests/css-ruby/float-handling-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title></title> + <link rel="stylesheet" href="common.css"> + <style> + ruby div { + width: 10px; height: 10px; + background-color: grey; + margin: 2px; + } + .left { float: left; } + .right { float: right; } + </style> +</head> +<body> + <div><ruby><rb><div class="left"></div>HELLO WORLD</rb><rt>hello world</rt></ruby></div> + <div><ruby><rb><div class="left"></div>HELLO WORLD</rb><rt>hello world</rt></ruby></div> + <div><ruby><rb><div class="right"></div>HELLO WORLD</rb><rt>hello world</rt></ruby></div> + <div><ruby><rb><div class="right"></div>HELLO WORLD</rb><rt>hello world</rt></ruby></div> +</body> +</html> diff --git a/layout/reftests/css-ruby/float-handling.html b/layout/reftests/css-ruby/float-handling.html new file mode 100644 index 000000000..587483ec1 --- /dev/null +++ b/layout/reftests/css-ruby/float-handling.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title></title> + <link rel="stylesheet" href="common.css"> + <style> + ruby div { + width: 10px; height: 10px; + background-color: grey; + margin: 2px; + } + .left { float: left; } + .right { float: right; } + </style> +</head> +<body> + <div><ruby><rb>HELLO WORLD</rb><rt><div class="left"></div>hello world</rt></ruby></div> + <div><ruby><rb>HELLO WORLD</rb><rt>hello<div class="left"></div> world</rt></ruby></div> + <div><ruby><rb>HELLO WORLD</rb><rt><div class="right"></div>hello world</rt></ruby></div> + <div><ruby><rb>HELLO WORLD</rb><rt>hello<div class="right"></div> world</rt></ruby></div> +</body> +</html> diff --git a/layout/reftests/css-ruby/inflated-ruby-1-ref.html b/layout/reftests/css-ruby/inflated-ruby-1-ref.html new file mode 100644 index 000000000..7ae6e5825 --- /dev/null +++ b/layout/reftests/css-ruby/inflated-ruby-1-ref.html @@ -0,0 +1,6 @@ +<!DOCTYPE HTML> +<style> +div { font-family: monospace; font-size: 34px; width: 450px; } +rt { font-size: 50%; } +</style> +<div><ruby><rb>base<rt>rubytext</ruby></div> diff --git a/layout/reftests/css-ruby/inflated-ruby-1.html b/layout/reftests/css-ruby/inflated-ruby-1.html new file mode 100644 index 000000000..f9c6f1947 --- /dev/null +++ b/layout/reftests/css-ruby/inflated-ruby-1.html @@ -0,0 +1,10 @@ +<!DOCTYPE HTML> +<style> +div { font-family: monospace; font-size: 12px; width: 450px; } +rt { font-size: 50%; } +</style> +<!-- +In a 450px container, the minimum font size at 15em per line is 30px. +This means we map 0px-45px into 30px-45px, so 12px gets mapped to 34px. +--> +<div><ruby><rb>base<rt>rubytext</ruby></div> diff --git a/layout/reftests/css-ruby/intra-level-whitespace-1-ref.html b/layout/reftests/css-ruby/intra-level-whitespace-1-ref.html new file mode 100644 index 000000000..7cc105032 --- /dev/null +++ b/layout/reftests/css-ruby/intra-level-whitespace-1-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1099807 - Intra-level whitespace pairing</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <p><ruby> + <rb>a</rb><rb pseudo><span> </span></rb><rb>b</rb> + <rt>x</rt><rt pseudo><span> </span></rt><rt>y</rt> + </ruby></p> + <p><ruby> + <rb>a</rb><rb pseudo><span> </span></rb><rb>b</rb> + <rt>x</rt><rt></rt><rt>y</rt> + </ruby></p> + <p><ruby> + <rb>a</rb><rb pseudo></rb><rb>b</rb> + <rt>x</rt><rt pseudo><span> </span></rt><rt>y</rt> + </ruby></p> +</body> +</html> diff --git a/layout/reftests/css-ruby/intra-level-whitespace-1.html b/layout/reftests/css-ruby/intra-level-whitespace-1.html new file mode 100644 index 000000000..d1f23cbdb --- /dev/null +++ b/layout/reftests/css-ruby/intra-level-whitespace-1.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1099807 - Intra-level whitespace pairing</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <p><ruby> + <rb>a</rb> <rb>b</rb> + <rt>x</rt> <rt>y</rt> + </ruby></p> + <p><ruby> + <rb>a</rb> <rb>b</rb> + <rt>x</rt><rt>y</rt> + </ruby></p> + <p><ruby> + <rb>a</rb><rb>b</rb> + <rt>x</rt> <rt>y</rt> + </ruby></p> +</body> +</html> diff --git a/layout/reftests/css-ruby/intra-level-whitespace-2-ref.html b/layout/reftests/css-ruby/intra-level-whitespace-2-ref.html new file mode 100644 index 000000000..fe580bb44 --- /dev/null +++ b/layout/reftests/css-ruby/intra-level-whitespace-2-ref.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1099807 - Intra-level whitespace pairing</title> + <link rel="stylesheet" href="common.css"> + <style> + body { font-family: monospace; } + .container { border: 1px solid blue; margin: 20px; } + </style> + <style id="style"></style> +</head> +<body> + <span id="ref1">12345</span> <span id="ref2">12345 67890</span> + <div class="container"><ruby><rb>12345</rb> <rb>67890</rb><rt>09876</rt><rt>54321</rt></ruby></div> + <div class="container"><ruby><rb>12345</rb><rb>67890</rb><rt>09876</rt> <rt>54321</rt></ruby></div> + <div class="container"><ruby><rb>12345</rb> <rb>67890</rb><rt>09876</rt> <rt>54321</rt></ruby></div> + <script type="text/javascript"> + var ref2 = document.getElementById('ref2'); + var style = document.getElementById('style'); + var width2 = ref2.getBoundingClientRect().width + 'px'; + // This is the same as the script in the corresponding + // testcase, except that here we skip the intermediate + // size and jump straight to the final size. + style.textContent = '.container { width: ' + width2 + '; }'; + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/intra-level-whitespace-2.html b/layout/reftests/css-ruby/intra-level-whitespace-2.html new file mode 100644 index 000000000..f2eddba6c --- /dev/null +++ b/layout/reftests/css-ruby/intra-level-whitespace-2.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1099807 - Intra-level whitespace pairing</title> + <link rel="stylesheet" href="common.css"> + <style> + body { font-family: monospace; } + .container { border: 1px solid blue; margin: 20px; } + </style> + <style id="style"></style> +</head> +<body> + <span id="ref1">12345</span> <span id="ref2">12345 67890</span> + <div class="container"><ruby><rb>12345</rb> <rb>67890</rb><rt>09876</rt><rt>54321</rt></ruby></div> + <div class="container"><ruby><rb>12345</rb><rb>67890</rb><rt>09876</rt> <rt>54321</rt></ruby></div> + <div class="container"><ruby><rb>12345</rb> <rb>67890</rb><rt>09876</rt> <rt>54321</rt></ruby></div> + <script type="text/javascript"> + var ref1 = document.getElementById('ref1'); + var ref2 = document.getElementById('ref2'); + var style = document.getElementById('style'); + var width1 = ref1.getBoundingClientRect().width + 'px'; + var width2 = ref2.getBoundingClientRect().width + 'px'; + // It changes the width of the containers to test incremental + // layout with intra-level whitespace columns being pushed and + // pulled up across a line-break. + style.textContent = '.container { width: ' + width1 + '; }'; + document.body.offsetHeight; // force reflow + style.textContent = '.container { width: ' + width2 + '; }'; + document.body.offsetHeight; // force reflow + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/intra-level-whitespace-3-ref.html b/layout/reftests/css-ruby/intra-level-whitespace-3-ref.html new file mode 100644 index 000000000..1e43d0eac --- /dev/null +++ b/layout/reftests/css-ruby/intra-level-whitespace-3-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1099807 - Intra-level whitespace pairing</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + |<ruby> + <rbc><rb>before</rb><rb>base</rb><rb> </rb></rbc> + <rtc><rt> </rt><rt>text</rt><rt>after</rt></rtc> + </ruby>| +</body> +</html> diff --git a/layout/reftests/css-ruby/intra-level-whitespace-3.html b/layout/reftests/css-ruby/intra-level-whitespace-3.html new file mode 100644 index 000000000..a3a9b6313 --- /dev/null +++ b/layout/reftests/css-ruby/intra-level-whitespace-3.html @@ -0,0 +1,34 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1099807 - Intra-level whitespace pairing</title> + <link rel="stylesheet" href="common.css"> + <style> + rbc::before { + display: ruby-base; + content: "before"; + } + rbc::after { + display: ruby-base; + content: " "; + } + rtc::before { + display: ruby-text; + content: " "; + } + rtc::after { + display: ruby-text; + content: "after"; + } + </style> +</head> +<body> + <!-- This test ensures that we don't treat all-whitespace + ::before/::after content as intra-level whitespace --> + |<ruby> + <rbc><rb>base</rb></rbc> + <rtc><rt>text</rt></rtc> + </ruby>| +</body> +</html> diff --git a/layout/reftests/css-ruby/intrinsic-isize-1-ref.html b/layout/reftests/css-ruby/intrinsic-isize-1-ref.html new file mode 100644 index 000000000..902e8537c --- /dev/null +++ b/layout/reftests/css-ruby/intrinsic-isize-1-ref.html @@ -0,0 +1,49 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1134432 - Intrinsic ISize calculation of ruby</title> + <style> + div { + display: inline-block; + border: 1px solid black; + } + span { + white-space: nowrap; + } + </style> +</head> +<body> + <div style="width: -moz-min-content"> + <span>ABC</span><span>DEF</span> + </div> + <div style="width: -moz-max-content"> + <span>ABC</span><span>DEF</span> + </div> + <br> + + <div style="width: -moz-min-content"> + XYZ<span>ABC</span><span>DEF</span>XYZ + </div> + <div style="width: -moz-max-content"> + XYZ<span>ABC</span><span>DEF</span>XYZ + </div> + <br> + + <div style="width: -moz-min-content"> + <span>あい</span><span>うえ</span> + </div> + <div style="width: -moz-max-content"> + <span>あい</span><span>うえ</span> + </div> + <br> + + <div style="width: -moz-min-content"> + お<span>あい</span><span>うえ</span>お + </div> + <div style="width: -moz-max-content"> + お<span>あい</span><span>うえ</span>お + </div> + <br> +</body> +</html> diff --git a/layout/reftests/css-ruby/intrinsic-isize-1.html b/layout/reftests/css-ruby/intrinsic-isize-1.html new file mode 100644 index 000000000..dd900b4b7 --- /dev/null +++ b/layout/reftests/css-ruby/intrinsic-isize-1.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1134432 - Intrinsic ISize calculation of ruby</title> + <style> + div { + display: inline-block; + border: 1px solid black; + } + </style> +</head> +<body> + <div style="width: -moz-min-content"> + <ruby><rb>ABC<rb>DEF</ruby> + </div> + <div style="width: -moz-max-content"> + <ruby><rb>ABC<rb>DEF</ruby> + </div> + <br> + + <div style="width: -moz-min-content"> + XYZ<ruby><rb>ABC<rb>DEF</ruby>XYZ + </div> + <div style="width: -moz-max-content"> + XYZ<ruby><rb>ABC<rb>DEF</ruby>XYZ + </div> + <br> + + <div style="width: -moz-min-content"> + <ruby><rb>あい<rb>うえ</ruby> + </div> + <div style="width: -moz-max-content"> + <ruby><rb>あい<rb>うえ</ruby> + </div> + <br> + + <div style="width: -moz-min-content"> + お<ruby><rb>あい<rb>うえ</ruby>お + </div> + <div style="width: -moz-max-content"> + お<ruby><rb>あい<rb>うえ</ruby>お + </div> + <br> +</body> +</html> diff --git a/layout/reftests/css-ruby/intrinsic-isize-2-ref.html b/layout/reftests/css-ruby/intrinsic-isize-2-ref.html new file mode 100644 index 000000000..cb706c13e --- /dev/null +++ b/layout/reftests/css-ruby/intrinsic-isize-2-ref.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1180443 - Intrinsic ISize calculation of ruby with whitespace</title> + <style> + div { + display: inline-block; + border: 1px solid black; + } + </style> +</head> +<body> + <p>No line break should happen in any block, and the content should just fit in the block.</p> + + <div> + ABC DEF + </div> + <div> + XYZ ABCDEF XYZ + </div> + + <div> + あい うえ + </div> + <div> + お あいうえ お + </div> + <br> +</body> +</html> diff --git a/layout/reftests/css-ruby/intrinsic-isize-2.html b/layout/reftests/css-ruby/intrinsic-isize-2.html new file mode 100644 index 000000000..05991bb1c --- /dev/null +++ b/layout/reftests/css-ruby/intrinsic-isize-2.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1180443 - Intrinsic ISize calculation of ruby with whitespace</title> + <style> + div { + display: inline-block; + border: 1px solid black; + } + </style> +</head> +<body> + <p>No line break should happen in any block, and the content should just fit in the block.</p> + + <div> + <ruby><rb>ABC</rb> <rb>DEF</rb></ruby> + </div> + <div> + XYZ <ruby><rb>ABC</rb><rb>DEF</rb></ruby> XYZ + </div> + + <div> + <ruby><rb>あい</rb> <rb>うえ</rb></ruby> + </div> + <div> + お <ruby><rb>あい</rb><rb>うえ</rb></ruby> お + </div> + <br> +</body> +</html> diff --git a/layout/reftests/css-ruby/justification-1-ref.html b/layout/reftests/css-ruby/justification-1-ref.html new file mode 100644 index 000000000..f695fd118 --- /dev/null +++ b/layout/reftests/css-ruby/justification-1-ref.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1116631 - Justification with ruby span</title> + <link rel="stylesheet" href="common.css"> + <style> + body { line-height: 2; } + </style> +</head> +<body> + <div style="width: 200px; height: 100px; text-align-last: justify; overflow: auto;"><ruby> + <rb>a</rb><rb>b</rb> + </ruby></div> +</body> +</html> diff --git a/layout/reftests/css-ruby/justification-1.html b/layout/reftests/css-ruby/justification-1.html new file mode 100644 index 000000000..78dc3f439 --- /dev/null +++ b/layout/reftests/css-ruby/justification-1.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1116631 - Justification with ruby span</title> + <link rel="stylesheet" href="common.css"> + <style> + body { line-height: 2; } + </style> +</head> +<body> + <div style="width: 200px; height: 100px; text-align-last: justify; overflow: auto;"><ruby> + <rb>a</rb><rb>b</rb> + <rtc><div style="width: 100px;"></div></rtc> + </ruby></div> +</body> +</html> diff --git a/layout/reftests/css-ruby/justification-2-ref.html b/layout/reftests/css-ruby/justification-2-ref.html new file mode 100644 index 000000000..02a573de1 --- /dev/null +++ b/layout/reftests/css-ruby/justification-2-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1116631 - Justification with ruby span</title> + <link rel="stylesheet" href="common.css"> + <style> + div { + ruby-position: under; + width: 300px; height: 100px; + text-align-last: justify; + overflow: auto; + text-decoration: underline; + } + </style> +</head> +<body> + <div><rb>仮</rb><rb>名</rb><rt>が</rt><rt>な</rt></div> +</body> +</html> diff --git a/layout/reftests/css-ruby/justification-2.html b/layout/reftests/css-ruby/justification-2.html new file mode 100644 index 000000000..5c184f9a9 --- /dev/null +++ b/layout/reftests/css-ruby/justification-2.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1116631 - Justification with ruby span</title> + <link rel="stylesheet" href="common.css"> + <style> + div { + ruby-position: under; + width: 300px; height: 100px; + text-align-last: justify; + overflow: auto; + text-decoration: underline; + } + </style> +</head> +<body> + <div> + <rb>仮</rb><rb>名</rb> + <rt>が</rt><rt>な</rt> + <!-- --> + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/lang-specific-style-1-ref.html b/layout/reftests/css-ruby/lang-specific-style-1-ref.html new file mode 100644 index 000000000..379c82bd3 --- /dev/null +++ b/layout/reftests/css-ruby/lang-specific-style-1-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1133624 - Test for lang-specific default stylesheet for ruby</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="font: 200%/normal Ahem !important"> + <p><ruby><rb>base x x<rt style="ruby-align: space-around; font-size: 50%">text x x</ruby></p> + <p><ruby><rb>base x x<rt style="ruby-align: space-around; font-size: 50%">text x x</ruby></p> + <p><ruby><rb>base x x<rt style="ruby-align: center; font-size: 50%">text x x</ruby></p> + <p><ruby><rb>base x x<rt style="ruby-align: center; font-size: 30%">text x x</ruby></p> +</body> +</html> diff --git a/layout/reftests/css-ruby/lang-specific-style-1.html b/layout/reftests/css-ruby/lang-specific-style-1.html new file mode 100644 index 000000000..1df3e71e5 --- /dev/null +++ b/layout/reftests/css-ruby/lang-specific-style-1.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="UTF-8"> + <title>Bug 1133624 - Test for lang-specific default stylesheet for ruby</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="font: 200%/normal Ahem !important"> + <p lang="en"><ruby><rb>base x x<rt>text x x</ruby></p> + <p lang="ja"><ruby><rb>base x x<rt>text x x</ruby></p> + <p lang="zh-CN"><ruby><rb>base x x<rt>text x x</ruby></p> + <p lang="zh-TW"><ruby><rb>base x x<rt>text x x</ruby></p> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-1-ref.html b/layout/reftests/css-ruby/line-break-suppression-1-ref.html new file mode 100644 index 000000000..2823a6d7d --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-1-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Test for ruby line break suppression</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <ruby>ab</ruby><br> + <rbc>ab</rbc><br> + <rtc>ab</rtc><br> + <rb>ab</rb><br> + <rt>ab</rt> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-1.html b/layout/reftests/css-ruby/line-break-suppression-1.html new file mode 100644 index 000000000..eb05af68a --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-1.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Test for ruby line break suppression</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <ruby>a<br>b</ruby><br> + <rbc>a<br>b</rbc><br> + <rtc>a<br>b</rtc><br> + <rb>a<br>b</rb><br> + <rt>a<br>b</rt> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-2-ref.html b/layout/reftests/css-ruby/line-break-suppression-2-ref.html new file mode 100644 index 000000000..a39ca0baa --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-2-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Test for ruby line break suppression</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <div style="width: 1em; border: 1px solid"> + <ruby>aaaaaaaaaabbbbbbbbbb</ruby><br> + <rbc>aaaaaaaaaabbbbbbbbbb</rbc><br> + <rtc>aaaaaaaaaabbbbbbbbbb</rtc><br> + <rb>aaaaaaaaaabbbbbbbbbb</rb><br> + <rt>aaaaaaaaaabbbbbbbbbb</rt><br> + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-2.html b/layout/reftests/css-ruby/line-break-suppression-2.html new file mode 100644 index 000000000..e05df48d9 --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-2.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Test for ruby line break suppression</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <div style="width: 1em; border: 1px solid"> + <ruby>aaaaaaaaaa<div></div>bbbbbbbbbb</ruby><br> + <rbc>aaaaaaaaaa<div></div>bbbbbbbbbb</rbc><br> + <rtc>aaaaaaaaaa<div></div>bbbbbbbbbb</rtc><br> + <rb>aaaaaaaaaa<div></div>bbbbbbbbbb</rb><br> + <rt>aaaaaaaaaa<div></div>bbbbbbbbbb</rt><br> + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-3-ref.html b/layout/reftests/css-ruby/line-break-suppression-3-ref.html new file mode 100644 index 000000000..8b0da6694 --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-3-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Test for ruby line break suppression</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <ruby><span>a +b</span></ruby><br> + <rbc><span>a +b</span></rbc><br> + <rtc><span>a +b</span></rtc><br> + <rb><span>a +b</span></rb><br> + <rt><span>a +b</span></rt><br> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-3.html b/layout/reftests/css-ruby/line-break-suppression-3.html new file mode 100644 index 000000000..c75bcee06 --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-3.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Test for ruby line break suppression</title> + <link rel="stylesheet" href="common.css"> + <style> + span { white-space: pre; } + </style> +</head> +<body> + <ruby><span>a +b</span></ruby><br> + <rbc><span>a +b</span></rbc><br> + <rtc><span>a +b</span></rtc><br> + <rb><span>a +b</span></rb><br> + <rt><span>a +b</span></rt><br> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-4-ref.html b/layout/reftests/css-ruby/line-break-suppression-4-ref.html new file mode 100644 index 000000000..5e680a298 --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-4-ref.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1149009 - Line break suppression on whitespaces wrapped but not contained in ruby boxes</title> +</head> +<body> + <span style="white-space: pre"><rb>a</rb><rb> +</rb><rb>b</rb></span> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-4.html b/layout/reftests/css-ruby/line-break-suppression-4.html new file mode 100644 index 000000000..90d7e73de --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-4.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1149009 - Line break suppression on whitespaces wrapped but not contained in ruby boxes</title> +</head> +<body> + <span style="white-space: pre"><rb>a</rb> +<rb>b</rb></span> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-5-ref.html b/layout/reftests/css-ruby/line-break-suppression-5-ref.html new file mode 100644 index 000000000..d646dba0c --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-5-ref.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1186720 - Line break suppression with soft hyphen</title> +</head> +<body style="width: 1px"> + x<ruby>a</ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-break-suppression-5.html b/layout/reftests/css-ruby/line-break-suppression-5.html new file mode 100644 index 000000000..a44856c8d --- /dev/null +++ b/layout/reftests/css-ruby/line-break-suppression-5.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1186720 - Line break suppression with soft hyphen</title> +</head> +<body style="width: 1px"> + x<ruby>a­</ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-breaking-1-ref.html b/layout/reftests/css-ruby/line-breaking-1-ref.html new file mode 100644 index 000000000..5d8e10e8e --- /dev/null +++ b/layout/reftests/css-ruby/line-breaking-1-ref.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1089431 - Meet the specification for line breaking between ruby bases</title> + <link rel="stylesheet" href="common.css"> + <style> + body { line-height: 3; } + span { white-space: nowrap; } + </style> +</head> +<body> + <div style="width: .5em; border: 1px solid silver;"> + <span>「</span><span>な</span><span>に</span><span>、</span><span>誰</span><span>？</span><span>」</span><span>「</span><span>私</span><span>です</span><span>」</span> + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-breaking-1.html b/layout/reftests/css-ruby/line-breaking-1.html new file mode 100644 index 000000000..e2e794918 --- /dev/null +++ b/layout/reftests/css-ruby/line-breaking-1.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1089431 - Meet the specification for line breaking between ruby bases</title> + <link rel="stylesheet" href="common.css"> + <style> + body { line-height: 3; } + </style> +</head> +<body> + <div style="width: .5em; border: 1px solid silver;"> + <ruby> + <rb>「<rb>な<rb>に<rb>、<rb>誰<rb>？<rb>」<rb>「<rb>私<rb>です<rb>」</rb> + <!-- Check if ruby text containers are skipped from the text run --> + <rtc><rt> + </ruby> + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-breaking-2-ref.html b/layout/reftests/css-ruby/line-breaking-2-ref.html new file mode 100644 index 000000000..53ec9d3e4 --- /dev/null +++ b/layout/reftests/css-ruby/line-breaking-2-ref.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1140264</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <div style="width: 5em; border: 1px solid silver;"> + の「<span style="font-family: Ahem; padding: 0 10rem;">X</span>」 + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-breaking-2.html b/layout/reftests/css-ruby/line-breaking-2.html new file mode 100644 index 000000000..0a330741d --- /dev/null +++ b/layout/reftests/css-ruby/line-breaking-2.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1140264</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <div style="width: 5em; border: 1px solid silver;"> + の「<ruby style="font-family: Ahem;">X<rt style="font-size: 0;"><div style="width: 21rem"></div></ruby>」 + </div> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-height-1-ref.html b/layout/reftests/css-ruby/line-height-1-ref.html new file mode 100644 index 000000000..821765f5c --- /dev/null +++ b/layout/reftests/css-ruby/line-height-1-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1069519 - Ruby line height calculation</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> +</head> +<body style="line-height: 1"> + <div id="base"> + <span id="inline">base</span> + <span id="text" style="font-size: 50%; color: transparent">text</span> + </div> + <script> + // Simulate the behavior of ruby layout. + var base = document.getElementById('base'); + makeBSizeMatchInlineBox(base, document.getElementById('inline')); + base.style.paddingTop = getBSize(document.getElementById('text')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-height-1.html b/layout/reftests/css-ruby/line-height-1.html new file mode 100644 index 000000000..fc7463e38 --- /dev/null +++ b/layout/reftests/css-ruby/line-height-1.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1069519 - Ruby line height calculation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="line-height: 1"> + <ruby> + <rb>base</rb> + <rtc><rt style="color: transparent">text</rt></rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-height-2-ref.html b/layout/reftests/css-ruby/line-height-2-ref.html new file mode 100644 index 000000000..3d506e4e9 --- /dev/null +++ b/layout/reftests/css-ruby/line-height-2-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1069519 - Ruby line height calculation</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> +</head> +<body style="line-height: 1"> + <div id="base"> + <span id="inline">base</span> + <span id="text" style="font-size: 50%; color: transparent">text</span> + </div> + next line + <script> + // Simulate the behavior of ruby layout. + var base = document.getElementById('base'); + makeBSizeMatchInlineBox(base, document.getElementById('inline')); + base.style.paddingBottom = getBSize(document.getElementById('text')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-height-2.html b/layout/reftests/css-ruby/line-height-2.html new file mode 100644 index 000000000..d84f31da4 --- /dev/null +++ b/layout/reftests/css-ruby/line-height-2.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1069519 - Ruby line height calculation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="line-height: 1"> + <ruby> + <rb>base</rb> + <rtc style="ruby-position: under;"><rt style="color: transparent">text</rt></rtc> + </ruby><br> + next line +</body> +</html> diff --git a/layout/reftests/css-ruby/line-height-3-ref.html b/layout/reftests/css-ruby/line-height-3-ref.html new file mode 100644 index 000000000..8a186c5f2 --- /dev/null +++ b/layout/reftests/css-ruby/line-height-3-ref.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1069519 - Ruby line height calculation</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> +</head> +<body style="line-height: 1"> + <div id="base"> + <span id="inline">base</span> + <span id="text1" style="font-size: 80%; color: transparent">text</span> + <span id="text2" style="font-size: 50%; color: transparent">text</span> + </div> + next line + <script> + // Simulate the behavior of ruby layout. + var base = document.getElementById('base'); + makeBSizeMatchInlineBox(base, document.getElementById('inline')); + base.style.paddingTop = getBSize(document.getElementById('text1')); + base.style.paddingBottom = getBSize(document.getElementById('text2')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/line-height-3.html b/layout/reftests/css-ruby/line-height-3.html new file mode 100644 index 000000000..ea2bf632a --- /dev/null +++ b/layout/reftests/css-ruby/line-height-3.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1069519 - Ruby line height calculation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body style="line-height: 1"> + <ruby> + <rb>base</rb> + <rtc style="ruby-position: over; font-size: 80%;"><rt style="color: transparent">text</rt></rtc> + <rtc style="ruby-position: under; font-size: 50%;"><rt style="color: transparent">text</rt></rtc> + </ruby><br> + next line +</body> +</html> diff --git a/layout/reftests/css-ruby/line-height-4-ref.html b/layout/reftests/css-ruby/line-height-4-ref.html new file mode 100644 index 000000000..4ef96858e --- /dev/null +++ b/layout/reftests/css-ruby/line-height-4-ref.html @@ -0,0 +1,15 @@ +<title>Bug 1134206 - Ruby line spacing adjustment on quirks mode</title> +<script type="text/javascript" src="utils.js"></script> +<div id="base"> + <span id="inline">base</span> + <span id="text1" style="font-size: 80%; color: transparent">text</span> + <span id="text2" style="font-size: 50%; color: transparent">text</span> +</div> +next line +<script> + // Simulate the behavior of ruby layout. + var base = document.getElementById('base'); + makeBSizeMatchInlineBox(base, document.getElementById('inline')); + base.style.paddingTop = getBSize(document.getElementById('text1')); + base.style.paddingBottom = getBSize(document.getElementById('text2')); +</script> diff --git a/layout/reftests/css-ruby/line-height-4.html b/layout/reftests/css-ruby/line-height-4.html new file mode 100644 index 000000000..978aa5c70 --- /dev/null +++ b/layout/reftests/css-ruby/line-height-4.html @@ -0,0 +1,7 @@ +<title>Bug 1134206 - Ruby line spacing adjustment on quirks mode</title> +<ruby> + <rb>base</rb> + <rtc style="ruby-position: over; font-size: 80%;"><rt style="color: transparent">text</rt></rtc> + <rtc style="ruby-position: under; font-size: 50%;"><rt style="color: transparent">text</rt></rtc> +</ruby><br> +next line diff --git a/layout/reftests/css-ruby/min-font-size-1-ref.html b/layout/reftests/css-ruby/min-font-size-1-ref.html new file mode 100644 index 000000000..93b4bba2c --- /dev/null +++ b/layout/reftests/css-ruby/min-font-size-1-ref.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1165538 - Minimum font size on ruby text</title> +</head> +<body style="font-size: 16px"> + <ruby> + <rb>超電磁砲</rb> + <rt>レールガン</rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/min-font-size-1.html b/layout/reftests/css-ruby/min-font-size-1.html new file mode 100644 index 000000000..150e03221 --- /dev/null +++ b/layout/reftests/css-ruby/min-font-size-1.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<html lang="ja"> +<head> + <meta charset="UTF-8"> + <title>Bug 1165538 - Minimum font size on ruby text</title> +</head> +<body style="font-size: 1px"> + <ruby> + <rb>超電磁砲</rb> + <rt>レールガン</rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/nested-ruby-1.html b/layout/reftests/css-ruby/nested-ruby-1.html new file mode 100644 index 000000000..b3e76768e --- /dev/null +++ b/layout/reftests/css-ruby/nested-ruby-1.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1120313 - Nested ruby inside ruby annotation</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <ruby> + <rb>base1</rb> + <rt> + <ruby> + <rb>base2</rb> + <rt>text</rt> + </ruby> + </rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/no-transform-ref.html b/layout/reftests/css-ruby/no-transform-ref.html new file mode 100644 index 000000000..df9d6fdc0 --- /dev/null +++ b/layout/reftests/css-ruby/no-transform-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1121738 - Ruby should not support transform</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <ruby> + <rbc><rb>a</rb><rb>b</rb></rbc> + <rtc><rt>A</rt><rt>B</rt></rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/no-transform.html b/layout/reftests/css-ruby/no-transform.html new file mode 100644 index 000000000..ac78c16d4 --- /dev/null +++ b/layout/reftests/css-ruby/no-transform.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1121738 - Ruby should not support transform</title> + <link rel="stylesheet" href="common.css"> + <style> + ruby, rbc, rb, rtc, rt { + transform: translateX(50px); + } + </style> +</head> +<body> + <ruby> + <rbc><rb>a</rb><rb>b</rb></rbc> + <rtc><rt>A</rt><rt>B</rt></rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/reftest-stylo.list b/layout/reftests/css-ruby/reftest-stylo.list new file mode 100644 index 000000000..1ed58bea4 --- /dev/null +++ b/layout/reftests/css-ruby/reftest-stylo.list @@ -0,0 +1,59 @@ +# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing +== bidi-1.html bidi-1.html +== bidi-2.html bidi-2.html +== box-generation-1.html box-generation-1.html +== box-generation-2.html box-generation-2.html +== box-generation-3.html box-generation-3.html +== box-generation-4.html box-generation-4.html +== box-generation-5.html box-generation-5.html +== box-properties-1.html box-properties-1.html +== box-properties-2.html box-properties-2.html +== box-properties-3.html box-properties-3.html +== box-properties-4.html box-properties-4.html +== dynamic-insertion-1.html dynamic-insertion-1.html +== dynamic-insertion-2.html dynamic-insertion-2.html +== dynamic-insertion-3.html dynamic-insertion-3.html +== dynamic-removal-1.html dynamic-removal-1.html +== dynamic-removal-2.html dynamic-removal-2.html +== dynamic-removal-3.html dynamic-removal-3.html +== float-handling.html float-handling.html +fails test-pref(dom.meta-viewport.enabled,true) test-pref(font.size.inflation.emPerLine,15) test-pref(font.size.inflation.forceEnabled,true) test-pref(font.size.inflation.lineThreshold,0) == inflated-ruby-1.html inflated-ruby-1.html +== intra-level-whitespace-1.html intra-level-whitespace-1.html +== intra-level-whitespace-2.html intra-level-whitespace-2.html +== intra-level-whitespace-3.html intra-level-whitespace-3.html +== intrinsic-isize-1.html intrinsic-isize-1.html +== intrinsic-isize-2.html intrinsic-isize-2.html +== justification-1.html justification-1.html +== justification-2.html justification-2.html +fuzzy-if(winWidget,255,792) == lang-specific-style-1.html lang-specific-style-1.html +# bug 1134947 +== line-breaking-1.html line-breaking-1.html +== line-breaking-2.html line-breaking-2.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu),3,2) == line-break-suppression-1.html line-break-suppression-1.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu),3,2) == line-break-suppression-2.html line-break-suppression-2.html +== line-break-suppression-3.html line-break-suppression-3.html +== line-break-suppression-4.html line-break-suppression-4.html +== line-break-suppression-5.html line-break-suppression-5.html +== line-height-1.html line-height-1.html +== line-height-2.html line-height-2.html +== line-height-3.html line-height-3.html +== line-height-4.html line-height-4.html +test-pref(font.minimum-size.ja,16) == min-font-size-1.html min-font-size-1.html +skip load nested-ruby-1.html +== no-transform.html no-transform.html +== relative-positioning-1.html relative-positioning-1.html +== relative-positioning-2.html relative-positioning-2.html +== ruby-align-1.html ruby-align-1.html +== ruby-align-1a.html ruby-align-1a.html +== ruby-align-2.html ruby-align-2.html +== ruby-align-2a.html ruby-align-2a.html +== ruby-position-horizontal.html ruby-position-horizontal.html +== ruby-position-vertical-lr.html ruby-position-vertical-lr.html +== ruby-position-vertical-rl.html ruby-position-vertical-rl.html +== ruby-reflow-1-opaqueruby.html ruby-reflow-1-opaqueruby.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu),13,1) == ruby-reflow-1-transparentruby.html ruby-reflow-1-transparentruby.html +== ruby-span-1.html ruby-span-1.html +== ruby-whitespace-1.html ruby-whitespace-1.html +== ruby-whitespace-2.html ruby-whitespace-2.html +== bug1181890.html bug1181890.html +== bug1181890.html bug1181890.html diff --git a/layout/reftests/css-ruby/reftest.list b/layout/reftests/css-ruby/reftest.list new file mode 100644 index 000000000..d940d8513 --- /dev/null +++ b/layout/reftests/css-ruby/reftest.list @@ -0,0 +1,57 @@ +== bidi-1.html bidi-1-ref.html +== bidi-2.html bidi-2-ref.html +== box-generation-1.html box-generation-1-ref.html +== box-generation-2.html box-generation-2-ref.html +== box-generation-3.html box-generation-3-ref.html +== box-generation-4.html box-generation-4-ref.html +== box-generation-5.html box-generation-5-ref.html +== box-properties-1.html box-properties-1-ref.html +== box-properties-2.html box-properties-2-ref.html +== box-properties-3.html box-properties-3-ref.html +== box-properties-4.html box-properties-4-ref.html +== dynamic-insertion-1.html dynamic-insertion-1-ref.html +== dynamic-insertion-2.html dynamic-insertion-2-ref.html +== dynamic-insertion-3.html dynamic-insertion-3-ref.html +== dynamic-removal-1.html dynamic-removal-1-ref.html +== dynamic-removal-2.html dynamic-removal-2-ref.html +== dynamic-removal-3.html dynamic-removal-3-ref.html +== float-handling.html float-handling-ref.html +test-pref(dom.meta-viewport.enabled,true) test-pref(font.size.inflation.emPerLine,15) test-pref(font.size.inflation.forceEnabled,true) test-pref(font.size.inflation.lineThreshold,0) == inflated-ruby-1.html inflated-ruby-1-ref.html +== intra-level-whitespace-1.html intra-level-whitespace-1-ref.html +== intra-level-whitespace-2.html intra-level-whitespace-2-ref.html +== intra-level-whitespace-3.html intra-level-whitespace-3-ref.html +== intrinsic-isize-1.html intrinsic-isize-1-ref.html +== intrinsic-isize-2.html intrinsic-isize-2-ref.html +== justification-1.html justification-1-ref.html +== justification-2.html justification-2-ref.html +fuzzy-if(winWidget,255,792) == lang-specific-style-1.html lang-specific-style-1-ref.html # bug 1134947 +== line-breaking-1.html line-breaking-1-ref.html +== line-breaking-2.html line-breaking-2-ref.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu),3,2) == line-break-suppression-1.html line-break-suppression-1-ref.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu),3,2) == line-break-suppression-2.html line-break-suppression-2-ref.html +== line-break-suppression-3.html line-break-suppression-3-ref.html +== line-break-suppression-4.html line-break-suppression-4-ref.html +== line-break-suppression-5.html line-break-suppression-5-ref.html +== line-height-1.html line-height-1-ref.html +== line-height-2.html line-height-2-ref.html +== line-height-3.html line-height-3-ref.html +== line-height-4.html line-height-4-ref.html +test-pref(font.minimum-size.ja,16) == min-font-size-1.html min-font-size-1-ref.html +load nested-ruby-1.html +== no-transform.html no-transform-ref.html +== relative-positioning-1.html relative-positioning-1-ref.html +== relative-positioning-2.html relative-positioning-2-ref.html +== ruby-align-1.html ruby-align-1-ref.html +== ruby-align-1a.html ruby-align-1-ref.html +== ruby-align-2.html ruby-align-2-ref.html +== ruby-align-2a.html ruby-align-2-ref.html +== ruby-position-horizontal.html ruby-position-horizontal-ref.html +== ruby-position-vertical-lr.html ruby-position-vertical-lr-ref.html +== ruby-position-vertical-rl.html ruby-position-vertical-rl-ref.html +!= ruby-reflow-1-opaqueruby.html ruby-reflow-1-noruby.html +fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu),13,1) == ruby-reflow-1-transparentruby.html ruby-reflow-1-noruby.html +== ruby-span-1.html ruby-span-1-ref.html +== ruby-whitespace-1.html ruby-whitespace-1-ref.html +== ruby-whitespace-2.html ruby-whitespace-2-ref.html +== bug1181890.html bug1181890-ref.html +!= bug1181890.html bug1181890-notref.html diff --git a/layout/reftests/css-ruby/relative-positioning-1-ref.html b/layout/reftests/css-ruby/relative-positioning-1-ref.html new file mode 100644 index 000000000..1819ba920 --- /dev/null +++ b/layout/reftests/css-ruby/relative-positioning-1-ref.html @@ -0,0 +1,22 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055658 - Relative positioning for ruby</title> + <script type="text/javascript" src="utils.js"></script> +</head> +<body> + <div style="height: 80px; line-height: 80px; width: 50px; text-align: center"> + <span id="inline" style="position: relative"> + <div id="annotation" style="position: absolute; width: 50px; top: -100%"> + a<span style="position: relative; top: -10px;">b</span>c + </div> + base + </span> + </div> + <script type="text/javascript"> + makeBSizeMatchInlineBox(document.getElementById('annotation'), + document.getElementById('inline')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/relative-positioning-1.html b/layout/reftests/css-ruby/relative-positioning-1.html new file mode 100644 index 000000000..66dcf62c7 --- /dev/null +++ b/layout/reftests/css-ruby/relative-positioning-1.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055658 - Relative positioning for ruby</title> + <link rel="stylesheet" href="common.css"> + <style> + body { + line-height: 80px; + } + rtc, rt { + font-size: 100% !important; + line-height: 1 !important; + } + </style> +</head> +<body> + <ruby style="position: relative;"> + <rb>base</rb> + <rtc><rt>a<span style="position: relative; top: -10px;">b</span>c</rt></rtc> + <rtc><div style="width: 50px; height: 0;"></div></rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/relative-positioning-2-ref.html b/layout/reftests/css-ruby/relative-positioning-2-ref.html new file mode 100644 index 000000000..a5fc13090 --- /dev/null +++ b/layout/reftests/css-ruby/relative-positioning-2-ref.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055658 - Relative positioning for ruby</title> + <script type="text/javascript" src="utils.js"></script> +</head> +<body style="font-family: monospace"> + <div style="height: 80px; line-height: 80px;"> + before + <div style="position: relative; top: 20px; display: inline-block"> + <span id="inline" style="position: relative"> + <div id="annotation" style="position: absolute; top: -100%;"> + text1 + <span style="position: relative; top: -20px;">text2</span> + <span style="position: relative; right: 10px;">text3</span> + </div> + base1 + <span style="position: relative; left: 10px;">base2</span> + <span style="position: relative; bottom: -20px;">base3</span> + </span> + </div> + after + </div> + <script type="text/javascript"> + makeBSizeMatchInlineBox(document.getElementById('annotation'), + document.getElementById('inline')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/relative-positioning-2.html b/layout/reftests/css-ruby/relative-positioning-2.html new file mode 100644 index 000000000..0e91b7b37 --- /dev/null +++ b/layout/reftests/css-ruby/relative-positioning-2.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055658 - Relative positioning for ruby</title> + <link rel="stylesheet" href="common.css"> + <style> + body { + font-family: monospace; + line-height: 80px; + } + rtc, rt { + font-size: 100% !important; + line-height: 1 !important; + } + </style> +</head> +<body> + before + <ruby style="position: relative; top: 20px;"> + <rb>base1</rb> + <rtc>text1</rtc> + <rb style="position: relative; left: 10px;">base2</rb> + <rtc style="position: relative; top: -20px;">text2</rtc> + <rbc style="position: relative; bottom: -20px;"><rb>base3</rb></rbc> + <rtc><rt style="position: relative; right: 10px;">text3</rt></rtc> + </ruby> + after +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-align-1-ref.html b/layout/reftests/css-ruby/ruby-align-1-ref.html new file mode 100644 index 000000000..6f6ffcd30 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-align-1-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055676 - Tests for ruby-align</title> + <link rel="stylesheet" href="common.css"> + <style> + div { width: 160px; box-sizing: border-box; } + </style> +</head> +<body style="font: 16px/3 Ahem"> + <div>X X X</div> + <div style="text-align: center">X X X</div> + <div style="text-align-last: justify">X X X</div> + <!-- 8px = (width: 160px - 5 * font-size: 16px) / + (1 + justification opportunities: 4) / 2 --> + <div style="text-align-last: justify; padding: 0 8px">X X X</div> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-align-1.html b/layout/reftests/css-ruby/ruby-align-1.html new file mode 100644 index 000000000..3acd5fcf3 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-align-1.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055676 - Tests for ruby-align</title> + <link rel="stylesheet" href="common.css"> + <style> + ruby { line-height: 0; } + rt > div { width: 160px; } + </style> +</head> +<body style="font: 16px/3 Ahem"> + <ruby style="ruby-align: start"> + <rb>X X X<rt><div></div></rt> + </ruby><br> + <ruby style="ruby-align: center"> + <rb>X X X<rt><div></div></rt> + </ruby><br> + <ruby style="ruby-align: space-between"> + <rb>X X X<rt><div></div></rt> + </ruby><br> + <ruby style="ruby-align: space-around"> + <rb>X X X<rt><div></div></rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-align-1a.html b/layout/reftests/css-ruby/ruby-align-1a.html new file mode 100644 index 000000000..795f0f4fa --- /dev/null +++ b/layout/reftests/css-ruby/ruby-align-1a.html @@ -0,0 +1,26 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055676 - Tests for ruby-align</title> + <link rel="stylesheet" href="common.css"> + <style> + ruby { line-height: 0; } + rt > div { width: 160px; } + </style> +</head> +<body style="font: 16px/3 Ahem"> + <ruby> + <rb style="ruby-align: start">X X X<rt><div></div></rt> + </ruby><br> + <ruby> + <rb style="ruby-align: center">X X X<rt><div></div></rt> + </ruby><br> + <ruby> + <rb style="ruby-align: space-between">X X X<rt><div></div></rt> + </ruby><br> + <ruby> + <rb style="ruby-align: space-around">X X X<rt><div></div></rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-align-2-ref.html b/layout/reftests/css-ruby/ruby-align-2-ref.html new file mode 100644 index 000000000..465dd1d10 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-align-2-ref.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055676 - Tests for ruby-align</title> + <link rel="stylesheet" href="common.css"> + <style> + ruby { line-height: 0; } + rt { font-size: 100%; } + rt > div { width: 160px; box-sizing: border-box; } + </style> +</head> +<body style="font: 16px/3 Ahem"> + <ruby> + <rt><div>X X X</div></rt> + </ruby><br> + <ruby> + <rt><div style="text-align: center">X X X</div></rt> + </ruby><br> + <ruby> + <rt><div style="text-align-last: justify">X X X</div></rt> + </ruby><br> + <!-- 8px = (width: 160px - 5 * font-size: 16px) / + (1 + justification opportunities: 4) / 2 --> + <ruby> + <rt><div style="text-align-last: justify; padding: 0 8px">X X X</div></rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-align-2.html b/layout/reftests/css-ruby/ruby-align-2.html new file mode 100644 index 000000000..8e520e408 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-align-2.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055676 - Tests for ruby-align</title> + <link rel="stylesheet" href="common.css"> + <style> + ruby { line-height: 0; } + rt { font-size: 100%; } + rb > div { width: 160px; } + </style> +</head> +<body style="font: 16px/3 Ahem"> + <ruby style="ruby-align: start"> + <rb><div></div><rt>X X X</rt> + </ruby><br> + <ruby style="ruby-align: center"> + <rb><div></div><rt>X X X</rt> + </ruby><br> + <ruby style="ruby-align: space-between"> + <rb><div></div><rt>X X X</rt> + </ruby><br> + <ruby style="ruby-align: space-around"> + <rb><div></div><rt>X X X</rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-align-2a.html b/layout/reftests/css-ruby/ruby-align-2a.html new file mode 100644 index 000000000..8944bd920 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-align-2a.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055676 - Tests for ruby-align</title> + <link rel="stylesheet" href="common.css"> + <style> + ruby { line-height: 0; } + rt { font-size: 100%; } + rb > div { width: 160px; } + </style> +</head> +<body style="font: 16px/3 Ahem"> + <ruby> + <rb><div></div><rt style="ruby-align: start">X X X</rt> + </ruby><br> + <ruby> + <rb><div></div><rt style="ruby-align: center">X X X</rt> + </ruby><br> + <ruby> + <rb><div></div><rt style="ruby-align: space-between">X X X</rt> + </ruby><br> + <ruby> + <rb><div></div><rt style="ruby-align: space-around">X X X</rt> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-position-horizontal-ref.html b/layout/reftests/css-ruby/ruby-position-horizontal-ref.html new file mode 100644 index 000000000..9cb0ceaf4 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-position-horizontal-ref.html @@ -0,0 +1,35 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055665 - Test for ruby-position</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> + <style> + body { + font-family: monospace; + } + .annotation, .annotation > div { + position: absolute; + } + </style> +</head> +<body> + <div style="height: 8em; line-height: 8em;"> + <div style="display: inline-block;"> + <div class="annotation"> + <div style="top: -100%;"><span>over##</span></div> + <div style="top: 100%;"><span>under#</span></div> + <div style="top: -200%;"><span>over2#</span></div> + <div style="top: 200%;"><span>under2</span></div> + <!-- to give container the proper block-axis size --> + <span> </span> + </div> + <span>base##</span> + </div> + </div> + <script type="text/javascript"> + makeBSizeOfParentMatch(document.getElementsByTagName('span')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-position-horizontal.html b/layout/reftests/css-ruby/ruby-position-horizontal.html new file mode 100644 index 000000000..e6d9e8393 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-position-horizontal.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055665 - Test for ruby-position</title> + <link rel="stylesheet" href="common.css"> + <style> + body { + font-family: monospace; + /* use a large line-height here to avoid additional leadings */ + line-height: 8em; + } + rtc, rt { + font-size: 100% !important; + line-height: normal !important; + } + </style> +</head> +<body> + <ruby> + <rb>base##</rb> + <rtc style="ruby-position: over"><rt>over##</rt></rtc> + <rtc style="ruby-position: under"><rt>under#</rt></rtc> + <rtc style="ruby-position: over"><rt>over2#</rt></rtc> + <rtc style="ruby-position: under"><rt>under2</rt></rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-position-vertical-lr-ref.html b/layout/reftests/css-ruby/ruby-position-vertical-lr-ref.html new file mode 100644 index 000000000..2c432e424 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-position-vertical-lr-ref.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055665 - Test for ruby-position</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> + <style> + html { + writing-mode: vertical-lr; + } + body { + font-family: monospace; + } + .annotation, .annotation > div { + position: absolute; + } + </style> +</head> +<body> + <div style="width: 8em; line-height: 8em;"> + <div style="display: inline-block;"> + <div class="annotation"> + <div style="right: 100%;"><span>left##</span></div> + <div style="right: -100%;"><span>right#</span></div> + <div style="right: 200%;"><span>left2#</span></div> + <div style="right: -200%;"><span>right2</span></div> + <!-- to give container the proper block-axis size --> + <span> </span> + </div> + <span>base##</span> + </div> + </div> + <script type="text/javascript"> + makeBSizeOfParentMatch(document.getElementsByTagName('span')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-position-vertical-lr.html b/layout/reftests/css-ruby/ruby-position-vertical-lr.html new file mode 100644 index 000000000..6dee8f7cc --- /dev/null +++ b/layout/reftests/css-ruby/ruby-position-vertical-lr.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055665 - Test for ruby-position</title> + <link rel="stylesheet" href="common.css"> + <style> + html { + writing-mode: vertical-lr; + } + body { + font-family: monospace; + /* use a large line-height here to avoid additional leadings */ + line-height: 8em; + } + rtc, rt { + font-size: 100% !important; + line-height: normal !important; + } + </style> +</head> +<body> + <ruby> + <rb>base##</rb> + <rtc style="ruby-position: under"><rt>left##</rt></rtc> + <rtc style="ruby-position: over"><rt>right#</rt></rtc> + <rtc style="ruby-position: under"><rt>left2#</rt></rtc> + <rtc style="ruby-position: over"><rt>right2</rt></rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-position-vertical-rl-ref.html b/layout/reftests/css-ruby/ruby-position-vertical-rl-ref.html new file mode 100644 index 000000000..edeeeb5f4 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-position-vertical-rl-ref.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055665 - Test for ruby-position</title> + <link rel="stylesheet" href="common.css"> + <script type="text/javascript" src="utils.js"></script> + <style> + html { + writing-mode: vertical-rl; + } + body { + font-family: monospace; + } + .annotation, .annotation > div { + position: absolute; + } + </style> +</head> +<body> + <div style="width: 8em; line-height: 8em;"> + <div style="display: inline-block;"> + <div class="annotation"> + <div style="right: 100%;"><span>left##</span></div> + <div style="right: -100%;"><span>right#</span></div> + <div style="right: 200%;"><span>left2#</span></div> + <div style="right: -200%;"><span>right2</span></div> + <!-- to give container the proper block-axis size --> + <span> </span> + </div> + <span>base##</span> + </div> + </div> + <script type="text/javascript"> + makeBSizeOfParentMatch(document.getElementsByTagName('span')); + </script> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-position-vertical-rl.html b/layout/reftests/css-ruby/ruby-position-vertical-rl.html new file mode 100644 index 000000000..1d9378176 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-position-vertical-rl.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1055665 - Test for ruby-position</title> + <link rel="stylesheet" href="common.css"> + <style> + html { + writing-mode: vertical-rl; + } + body { + font-family: monospace; + /* use a large line-height here to avoid additional leadings */ + line-height: 8em; + } + rtc, rt { + font-size: 100% !important; + line-height: normal !important; + } + </style> +</head> +<body> + <ruby> + <rb>base##</rb> + <rtc style="ruby-position: under"><rt>left##</rt></rtc> + <rtc style="ruby-position: over"><rt>right#</rt></rtc> + <rtc style="ruby-position: under"><rt>left2#</rt></rtc> + <rtc style="ruby-position: over"><rt>right2</rt></rtc> + </ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-reflow-1-noruby.html b/layout/reftests/css-ruby/ruby-reflow-1-noruby.html new file mode 100644 index 000000000..4119dc9bd --- /dev/null +++ b/layout/reftests/css-ruby/ruby-reflow-1-noruby.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html style="overflow:hidden;"> +<head> +<title>CSS Test: Ruby Base Frames Reflowed</title> +<link rel="author" title="Susanna Bowen" href="mailto:sgbowen8@gmail.com"> +<link rel="help" href="http://www.w3.org/TR/2014/WD-css-ruby-1-20140805/"> +<meta name="assert" content="Test checks that ruby bases are reflowed."> +<meta charset="UTF-8"> +<link rel="stylesheet" href="common.css"> +<style> +body { line-height: 2em; } +</style> +</head> +<body> +新幹線 +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-reflow-1-opaqueruby.html b/layout/reftests/css-ruby/ruby-reflow-1-opaqueruby.html new file mode 100644 index 000000000..245d7136d --- /dev/null +++ b/layout/reftests/css-ruby/ruby-reflow-1-opaqueruby.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html style="overflow:hidden;"> +<head> +<title>CSS Test: Ruby Text Frames Visible</title> +<link rel="author" title="Susanna Bowen" href="mailto:sgbowen8@gmail.com"> +<link rel="help" href="http://www.w3.org/TR/2014/WD-css-ruby-1-20140805/"> +<meta name="assert" content="Test checks that ruby text is rendered."> +<meta charset="UTF-8"> +<link rel="stylesheet" href="common.css"> +<style> +body { line-height: 2em; } +</style> +</head> +<body> +<ruby> + <rbc><rb>新</rb><rb>幹</rb><rb>線</rb></rbc> + <rtc><rt>しん</rt><rt>かん</rt><rt>せん</rt></rtc> +</ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-reflow-1-transparentruby.html b/layout/reftests/css-ruby/ruby-reflow-1-transparentruby.html new file mode 100644 index 000000000..0d2967a38 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-reflow-1-transparentruby.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html style="overflow:hidden;"> +<head> +<title>CSS Test: Ruby Base Frames Reflowed</title> +<link rel="author" title="Susanna Bowen" href="mailto:sgbowen8@gmail.com"> +<link rel="help" href="http://www.w3.org/TR/2014/WD-css-ruby-1-20140805/"> +<meta name="assert" content="Test checks that ruby bases are reflowed."> +<meta charset="UTF-8"> +<link rel="stylesheet" href="common.css"> +<style> +body { line-height: 2em; } +rtc { color: transparent; } +</style> +</head> +<body> +<ruby> + <rbc><rb>新</rb><rb>幹</rb><rb>線</rb></rbc> + <rtc><rt>しん</rt><rt>かん</rt><rt>せん</rt></rtc> +</ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-span-1-ref.html b/layout/reftests/css-ruby/ruby-span-1-ref.html new file mode 100644 index 000000000..e8b9d91e7 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-span-1-ref.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1117597</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <ruby><rb>The Ruby Base</rb><rtc><rt>span</rt></rtc></ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-span-1.html b/layout/reftests/css-ruby/ruby-span-1.html new file mode 100644 index 000000000..4862ecc10 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-span-1.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>Bug 1117597</title> + <link rel="stylesheet" href="common.css"> +</head> +<body> + <ruby><rb>The Ruby Base</rb><rtc>span</rtc></ruby> +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-whitespace-1-ref.html b/layout/reftests/css-ruby/ruby-whitespace-1-ref.html new file mode 100644 index 000000000..7018627d1 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-whitespace-1-ref.html @@ -0,0 +1,36 @@ +<html> +<head> +<meta charset="UTF-8"> +<link rel="stylesheet" href="common.css"> +<style> +body { line-height: 5em; } +</style> +</head> +<body> + +<p> + <ruby><rbc><rb><span> </span></rb><rb><span> </span></rb><rb>Base three</rb></rbc + ><rtc><rt><span> </span></rt><rt><span> </span></rt><rt>Text three</rt></rtc + ><rtc><rt></rt></rtc + ><rbc><rb><span> </span></rb></rbc + ><rbc><rb>Segment two</rb></rbc + ><rtc><rt></rt></rtc></ruby> +</p> + +<p> + <ruby><rbc><rb>Base one</rb><rb><span> </span></rb><rb>Base three</rb></rbc + ><rtc pseudo><rt>Text one</rt><rt pseudo><span> </span></rt><rt>Text three</rt></rtc></ruby> +</p> + +<p> + <ruby><rbc><rb>Segment one</rb></rbc + ><rbc><rb><span> </span></rb></rbc + ><rbc><rb><span> </span></rb><rb><span> </span></rb><rb>Base three</rb></rbc + ><rtc><rt><span> </span></rt><rt><span> </span></rt><rt>Text three</rt></rtc + ><rbc><rb><span> </span></rb></rbc + ><rbc><rb>Base one</rb><rb><span> </span></rb><rb>Base three</rb></rbc + ><rtc><rt>Text one</rt><rt></rt><rt>Text two/three</rt></rtc></ruby> +</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-whitespace-1.html b/layout/reftests/css-ruby/ruby-whitespace-1.html new file mode 100644 index 000000000..acb5da3e6 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-whitespace-1.html @@ -0,0 +1,34 @@ +<html> +<head> +<meta charset="UTF-8"> +<link rel="stylesheet" href="common.css"> +<style> +body { line-height: 5em; } +</style> +</head> +<body> + +<p> + <ruby> + <rbc> <rb> </rb> <rb>Base three</rb> </rbc> + <rtc> <rt> </rt> <rt>Text three</rt> </rtc> <rtc><rt></rt></rtc> + <rbc><rb>Segment two</rb></rbc><rtc><rt></rt></rtc> + </ruby> +</p> + +<p> + <ruby> + <rb>Base one</rb> <rb>Base three</rb> + <rt>Text one</rt> <rt>Text three</rt> + </ruby> +</p> + +<p> + <rb>Segment one</rb> <rbc> <rb> </rb> <rb>Base three</rb> </rbc + > <rtc><rt> </rt> <rt>Text three</rt></rtc> + + <rb>Base one</rb> <rb>Base three</rb> <rt>Text one</rt><rt>Text two/three</rt> +</p> + +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-whitespace-2-ref.html b/layout/reftests/css-ruby/ruby-whitespace-2-ref.html new file mode 100644 index 000000000..f52b0685a --- /dev/null +++ b/layout/reftests/css-ruby/ruby-whitespace-2-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="UTF-8"> +<link rel="stylesheet" href="common.css"> +</head> + +<body> + +<!-- Unclear how this should render. See http://lists.w3.org/Archives/Public/www-style/2014Jul/0620.html //--> +abcd<ruby><rbc><rb><span> BASE</span></rb></rbc><rtc pseudo><rt>TEXT</rt></rtc></ruby> + +abcd<ruby><rbc><rb><span>BASE</span></rb></rbc><rtc pseudo><rt>TEXT</rt></rtc></ruby> + +abcd<ruby><rbc><rb><span> BASE</span></rb></rbc><rtc pseudo><rt>TEXT</rt></rtc></ruby> + +<ruby><rbc></rbc></ruby> + +</body> +</html> diff --git a/layout/reftests/css-ruby/ruby-whitespace-2.html b/layout/reftests/css-ruby/ruby-whitespace-2.html new file mode 100644 index 000000000..7f65a7683 --- /dev/null +++ b/layout/reftests/css-ruby/ruby-whitespace-2.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="UTF-8"> +<link rel="stylesheet" href="common.css"> +</head> + +<body> + +abcd<rbc> BASE</rbc><rt>TEXT</rt> + +abcd<rbc> <span>BASE</span></rbc><rt>TEXT</rt> + +abcd<rbc><span> BASE</span></rbc><rt>TEXT</rt> + +<rbc> </rbc> + +</body> +</html> diff --git a/layout/reftests/css-ruby/utils.js b/layout/reftests/css-ruby/utils.js new file mode 100644 index 000000000..1fee84cc2 --- /dev/null +++ b/layout/reftests/css-ruby/utils.js @@ -0,0 +1,33 @@ +function getBlockAxisName(elem) { + var wm = getComputedStyle(elem).writingMode; + return (!wm || wm == 'horizontal-tb') ? 'height' : 'width'; +} + +function getBSize(elem) { + return elem.getBoundingClientRect()[getBlockAxisName(elem)] + 'px'; +} + +function setBSize(elem, bsize) { + elem.style[getBlockAxisName(elem)] = bsize; + elem.style.lineHeight = bsize; +} + +// Ruby annotations are placed based on block-axis size of inline boxes +// instead of line box. Block-axis size of an inline box is the max +// height of the font, while that of line box is line height. Hence we +// sometimes need to explicitly set the block-axis size of an inline +// box to a block to simulate the exact behavior, which is what the +// following two functions do. + +function makeBSizeMatchInlineBox(block, inline) { + setBSize(block, getBSize(inline)); +} + +function makeBSizeOfParentMatch(elems) { + // The size change is divided into two phases to avoid + // triggering reflow for every element. + for (var elem of elems) + elem.dataset.bsize = getBSize(elem); + for (var elem of elems) + setBSize(elem.parentNode, elem.dataset.bsize); +} |