Bug 1225018 part 5 - Add reftests for line height handling of text-emphasis. r=dholbert
authorXidorn Quan <quanxunzhen@gmail.com>
Tue, 08 Dec 2015 12:55:01 -0500
changeset 310053 56cf53f1d5e26bf486904b1aab4022f31538e80d
parent 310052 bc1562f01b6ac3bfe189865e380bcb1becfb051e
child 310054 67aea49920bc30e931b0f27fbdffc88218d32265
push id5513
push userraliiev@mozilla.com
push dateMon, 25 Jan 2016 13:55:34 +0000
treeherdermozilla-beta@5ee97dd05b5c [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdholbert
bugs1225018
milestone45.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1225018 part 5 - Add reftests for line height handling of text-emphasis. r=dholbert
layout/reftests/w3c-css/submitted/text-decor-3/reftest.list
layout/reftests/w3c-css/submitted/text-decor-3/support/generate-text-emphasis-line-height-tests.py
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001-ref.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001a.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001b.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001z.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-002-ref.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-002a.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-002b.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003-ref.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003a.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003b.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003c.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003d.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004-ref.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004a.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004b.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004c.html
layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004d.html
--- a/layout/reftests/w3c-css/submitted/text-decor-3/reftest.list
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/reftest.list
@@ -110,8 +110,25 @@ skip-if(/^Windows\x20NT\x205\.1/.test(ht
 # START tests from support/generate-text-emphasis-ruby-tests.py
 == text-emphasis-ruby-001.html text-emphasis-ruby-001-ref.html
 == text-emphasis-ruby-002.html text-emphasis-ruby-002-ref.html
 == text-emphasis-ruby-003.html text-emphasis-ruby-003-ref.html
 == text-emphasis-ruby-003a.html text-emphasis-ruby-003-ref.html
 == text-emphasis-ruby-004.html text-emphasis-ruby-004-ref.html
 == text-emphasis-ruby-004a.html text-emphasis-ruby-004-ref.html
 # END tests from support/generate-text-emphasis-ruby-tests.py
+
+# text-emphasis line height
+# START tests from support/generate-text-emphasis-line-height-tests.py
+== text-emphasis-line-height-001a.html text-emphasis-line-height-001-ref.html
+== text-emphasis-line-height-001b.html text-emphasis-line-height-001-ref.html
+== text-emphasis-line-height-002a.html text-emphasis-line-height-002-ref.html
+== text-emphasis-line-height-002b.html text-emphasis-line-height-002-ref.html
+== text-emphasis-line-height-003a.html text-emphasis-line-height-003-ref.html
+== text-emphasis-line-height-003b.html text-emphasis-line-height-003-ref.html
+== text-emphasis-line-height-003c.html text-emphasis-line-height-003-ref.html
+== text-emphasis-line-height-003d.html text-emphasis-line-height-003-ref.html
+== text-emphasis-line-height-004a.html text-emphasis-line-height-004-ref.html
+== text-emphasis-line-height-004b.html text-emphasis-line-height-004-ref.html
+== text-emphasis-line-height-004c.html text-emphasis-line-height-004-ref.html
+== text-emphasis-line-height-004d.html text-emphasis-line-height-004-ref.html
+# END tests from support/generate-text-emphasis-line-height-tests.py
+== text-emphasis-line-height-001z.html text-emphasis-line-height-001-ref.html
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/support/generate-text-emphasis-line-height-tests.py
@@ -0,0 +1,82 @@
+#!/usr/bin/env python
+# - * - coding: UTF-8 - * -
+
+"""
+This script generates tests text-emphasis-line-height-001 ~ 004 except
+001z. They test the line height expansion in different directions. This
+script outputs a list of all tests it generated in the format of Mozilla
+reftest.list to the stdout.
+"""
+
+from __future__ import unicode_literals
+
+TEST_FILE = 'text-emphasis-line-height-{:03}{}.html'
+TEST_TEMPLATE = '''<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, {pos}, {wm}, {tag}</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-{index:03}-ref.html">
+<p>Pass if the emphasis marks are {dir} the black line:</p>
+{start}試験テスト{end}
+'''
+
+REF_FILE = 'text-emphasis-line-height-{:03}-ref.html'
+REF_TEMPLATE='''<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference: text-emphasis line height, {pos}</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<style> rt {{ font-variant-east-asian: inherit; }} </style>
+<p>Pass if the emphasis marks are {dir} the black line:</p>
+<div style="line-height: 1; border-{pos}: 1px solid black; writing-mode: {wm}; ruby-position: {posval}"><ruby>試<rt>&#x25CF;</rt>験<rt>&#x25CF;</rt>テ<rt>&#x25CF;</rt>ス<rt>&#x25CF;</rt>ト<rt>&#x25CF;</rt></ruby></div>
+'''
+
+STYLE1 = 'line-height: 1; border-{pos}: 1px solid black; ' + \
+         'writing-mode: {wm}; text-emphasis-position: {posval};'
+STYLE2 = 'text-emphasis: circle;'
+
+TAGS = [
+    # (tag, start, end)
+    ('div', '<div style="{style1}{style2}">', '</div>'),
+    ('span', '<div style="{style1}"><span style="{style2}">', '</span></div>'),
+    ]
+POSITIONS = [
+    # pos, text-emphasis-position, ruby-position,
+    #   writing-modes, dir text
+    ('top', 'over right', 'over',
+        ['horizontal-tb'], 'below'),
+    ('bottom', 'under right', 'under',
+        ['horizontal-tb'], 'over'),
+    ('right', 'over right', 'over',
+        ['vertical-rl', 'vertical-lr'], 'to the left of'),
+    ('left', 'over left', 'under',
+        ['vertical-rl', 'vertical-lr'], 'to the right of'),
+    ]
+
+import string
+
+def write_file(filename, content):
+    with open(filename, 'wb') as f:
+        f.write(content.encode('UTF-8'))
+
+print("# START tests from {}".format(__file__))
+idx = 0
+for (pos, emphasis_pos, ruby_pos, wms, dir) in POSITIONS:
+    idx += 1
+    ref_file = REF_FILE.format(idx)
+    content = REF_TEMPLATE.format(pos=pos, dir=dir, wm=wms[0], posval=ruby_pos)
+    write_file(ref_file, content)
+    suffix = iter(string.ascii_lowercase)
+    for wm in wms:
+        style1 = STYLE1.format(pos=pos, wm=wm, posval=emphasis_pos)
+        for (tag, start, end) in TAGS:
+            test_file = TEST_FILE.format(idx, next(suffix))
+            content = TEST_TEMPLATE.format(
+                pos=pos, wm=wm, tag=tag, index=idx, dir=dir,
+                start=start.format(style1=style1, style2=STYLE2), end=end)
+            write_file(test_file, content)
+            print("== {} {}".format(test_file, ref_file))
+print("# END tests from {}".format(__file__))
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference: text-emphasis line height, top</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<style> rt { font-variant-east-asian: inherit; } </style>
+<p>Pass if the emphasis marks are below the black line:</p>
+<div style="line-height: 1; border-top: 1px solid black; writing-mode: horizontal-tb; ruby-position: over"><ruby>試<rt>&#x25CF;</rt>験<rt>&#x25CF;</rt>テ<rt>&#x25CF;</rt>ス<rt>&#x25CF;</rt>ト<rt>&#x25CF;</rt></ruby></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001a.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, top, horizontal-tb, div</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-001-ref.html">
+<p>Pass if the emphasis marks are below the black line:</p>
+<div style="line-height: 1; border-top: 1px solid black; writing-mode: horizontal-tb; text-emphasis-position: over right;text-emphasis: circle;">試験テスト</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001b.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, top, horizontal-tb, span</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-001-ref.html">
+<p>Pass if the emphasis marks are below the black line:</p>
+<div style="line-height: 1; border-top: 1px solid black; writing-mode: horizontal-tb; text-emphasis-position: over right;"><span style="text-emphasis: circle;">試験テスト</span></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-001z.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, top, textarea</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-001-ref.html">
+<style>
+textarea {
+  all: inherit;
+  width: 100%;
+  box-sizing: border-box;
+  border: 0 none; margin: 0; padding: 0;
+}
+</style>
+<p>Pass if the emphasis marks are below the black line:</p>
+<textarea style="line-height: 1; border-top: 1px solid black; text-emphasis: circle;">試験テスト</textarea>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-002-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference: text-emphasis line height, bottom</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<style> rt { font-variant-east-asian: inherit; } </style>
+<p>Pass if the emphasis marks are over the black line:</p>
+<div style="line-height: 1; border-bottom: 1px solid black; writing-mode: horizontal-tb; ruby-position: under"><ruby>試<rt>&#x25CF;</rt>験<rt>&#x25CF;</rt>テ<rt>&#x25CF;</rt>ス<rt>&#x25CF;</rt>ト<rt>&#x25CF;</rt></ruby></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-002a.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, bottom, horizontal-tb, div</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-002-ref.html">
+<p>Pass if the emphasis marks are over the black line:</p>
+<div style="line-height: 1; border-bottom: 1px solid black; writing-mode: horizontal-tb; text-emphasis-position: under right;text-emphasis: circle;">試験テスト</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-002b.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, bottom, horizontal-tb, span</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-002-ref.html">
+<p>Pass if the emphasis marks are over the black line:</p>
+<div style="line-height: 1; border-bottom: 1px solid black; writing-mode: horizontal-tb; text-emphasis-position: under right;"><span style="text-emphasis: circle;">試験テスト</span></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference: text-emphasis line height, right</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<style> rt { font-variant-east-asian: inherit; } </style>
+<p>Pass if the emphasis marks are to the left of the black line:</p>
+<div style="line-height: 1; border-right: 1px solid black; writing-mode: vertical-rl; ruby-position: over"><ruby>試<rt>&#x25CF;</rt>験<rt>&#x25CF;</rt>テ<rt>&#x25CF;</rt>ス<rt>&#x25CF;</rt>ト<rt>&#x25CF;</rt></ruby></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003a.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, right, vertical-rl, div</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-003-ref.html">
+<p>Pass if the emphasis marks are to the left of the black line:</p>
+<div style="line-height: 1; border-right: 1px solid black; writing-mode: vertical-rl; text-emphasis-position: over right;text-emphasis: circle;">試験テスト</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003b.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, right, vertical-rl, span</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-003-ref.html">
+<p>Pass if the emphasis marks are to the left of the black line:</p>
+<div style="line-height: 1; border-right: 1px solid black; writing-mode: vertical-rl; text-emphasis-position: over right;"><span style="text-emphasis: circle;">試験テスト</span></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003c.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, right, vertical-lr, div</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-003-ref.html">
+<p>Pass if the emphasis marks are to the left of the black line:</p>
+<div style="line-height: 1; border-right: 1px solid black; writing-mode: vertical-lr; text-emphasis-position: over right;text-emphasis: circle;">試験テスト</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-003d.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, right, vertical-lr, span</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-003-ref.html">
+<p>Pass if the emphasis marks are to the left of the black line:</p>
+<div style="line-height: 1; border-right: 1px solid black; writing-mode: vertical-lr; text-emphasis-position: over right;"><span style="text-emphasis: circle;">試験テスト</span></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference: text-emphasis line height, left</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<style> rt { font-variant-east-asian: inherit; } </style>
+<p>Pass if the emphasis marks are to the right of the black line:</p>
+<div style="line-height: 1; border-left: 1px solid black; writing-mode: vertical-rl; ruby-position: under"><ruby>試<rt>&#x25CF;</rt>験<rt>&#x25CF;</rt>テ<rt>&#x25CF;</rt>ス<rt>&#x25CF;</rt>ト<rt>&#x25CF;</rt></ruby></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004a.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, left, vertical-rl, div</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-004-ref.html">
+<p>Pass if the emphasis marks are to the right of the black line:</p>
+<div style="line-height: 1; border-left: 1px solid black; writing-mode: vertical-rl; text-emphasis-position: over left;text-emphasis: circle;">試験テスト</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004b.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, left, vertical-rl, span</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-004-ref.html">
+<p>Pass if the emphasis marks are to the right of the black line:</p>
+<div style="line-height: 1; border-left: 1px solid black; writing-mode: vertical-rl; text-emphasis-position: over left;"><span style="text-emphasis: circle;">試験テスト</span></div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004c.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, left, vertical-lr, div</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-004-ref.html">
+<p>Pass if the emphasis marks are to the right of the black line:</p>
+<div style="line-height: 1; border-left: 1px solid black; writing-mode: vertical-lr; text-emphasis-position: over left;text-emphasis: circle;">試験テスト</div>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/w3c-css/submitted/text-decor-3/text-emphasis-line-height-004d.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Test: text-emphasis line height, left, vertical-lr, span</title>
+<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="help" href="https://drafts.csswg.org/css-text-decor-3/#text-emphasis-position-property">
+<meta name="assert" content="text emphasis marks should expand the line height like ruby if necessary">
+<link rel="match" href="text-emphasis-position-property-004-ref.html">
+<p>Pass if the emphasis marks are to the right of the black line:</p>
+<div style="line-height: 1; border-left: 1px solid black; writing-mode: vertical-lr; text-emphasis-position: over left;"><span style="text-emphasis: circle;">試験テスト</span></div>