Skip to content

GitLab

T
tangled
Commit dd96d9e6 authored by Kent Tamura's avatar Kent Tamura Committed by Commit Bot
Browse files
Options

css-ruby: Add a test for '3.5. Line Spacing' 

Bug: crbug.com/1069817
Change-Id: Ie3b4bb52e9151939026df20e37459de596d78545
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2217714
Commit-Queue: Kent Tamura <tkent@chromium.org>
Commit-Queue: Koji Ishii <kojii@chromium.org>
Reviewed-by: default avatarKoji Ishii <kojii@chromium.org>
Cr-Commit-Position: refs/heads/master@{#772573}
parent beaa0025
Hide whitespace changes
Inline Side-by-side
Showing with 72 additions and 0 deletions
third_party/blink/web_tests/external/wpt/css/css-ruby/line-spacing.html 0 → 100644
View file @ dd96d9e6
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-ruby/#line-height">
<link rel="stylesheet" href="/fonts/ahem.css">
<style>
body {
font: 16px/1 Ahem;
}
body > div {
border: 1px solid lime;
}
</style>
<body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
function renderRuby(source) {
document.body.insertAdjacentHTML('afterbegin', source);
const firstChild = document.body.firstChild;
const container = firstChild.tagName == 'RUBY' ? null : firstChild;
const ruby = firstChild.tagName == 'RUBY' ? firstChild : firstChild.querySelector('ruby');
return {container: container, ruby: ruby, rt: ruby.querySelector('rt')}
}
function renderRubyAndGetBoxes(source) {
const {container, ruby, rt} = renderRuby(source);
return {
container: container ? container.getBoundingClientRect() : null,
ruby: ruby ? ruby.getBoundingClientRect() : null,
rt: rt ? rt.getBoundingClientRect() : null
};
}
test(() => {
const {container, ruby, rt} = renderRubyAndGetBoxes(
'<div><ruby>base<rt>annotation</rt></ruby></div>');
assert_true(container.top <= rt.top);
assert_true(rt.top < ruby.top);
}, 'Over ruby doesn\'t overflow the block');
test(() => {
const {container, ruby, rt} = renderRubyAndGetBoxes(
'<div>before <span style="vertical-align:32px;">' +
'<ruby>base<rt>annotation</rt></ruby>' +
'</span> after</div>');
assert_true(container.top <= rt.top);
assert_true(rt.top < ruby.top);
}, 'Over ruby + vertical-align doesn\'t overflow the block');
test(() => {
const {container, ruby, rt} = renderRubyAndGetBoxes(
'<div><ruby style="ruby-position:under">base<rt>annotation</rt></ruby></div>');
assert_true(container.bottom >= rt.bottom);
assert_true(rt.bottom > ruby.bottom);
}, 'Under ruby doesn\'t overflow the block');
test(() => {
const {container, ruby, rt} = renderRubyAndGetBoxes(
'<div>before <ruby style="vertical-align:-32px; ruby-position:under">' +
'base<rt>annotation</rt></ruby> after</div>');
assert_true(container.bottom >= rt.bottom);
assert_true(rt.bottom > ruby.bottom);
}, 'Under ruby + vertical-align doesn\'t overflow the block');
test(() => {
const {container, ruby, rt} = renderRuby(
'<div><span>before</span><br><ruby>base<rt style="font-size:16px"' +
'>annotation</rt></ruby></div>');
const firstLine = container.querySelector('span').getBoundingClientRect();
assert_true(ruby.getBoundingClientRect().top - firstLine.bottom > 1);
}, 'Expand inter-lines spacing');
</script>
</body>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment