third_party/WebKit/LayoutTests/imported/wpt/mathml/relations/html5-tree/display-1.html - Issue 2434253002: Import wpt@7e8373f4bd144e66c88535983aa735b28c934cfe

Side by Side Diff: third_party/WebKit/LayoutTests/imported/wpt/mathml/relations/html5-tree/display-1.html

Issue 2434253002: Import wpt@7e8373f4bd144e66c88535983aa735b28c934cfe (Closed)

Patch Set: Modify TestExpectations or download new baselines for tests. Created 4 years, 2 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

« no previous file with comments | « third_party/WebKit/LayoutTests/imported/wpt/mathml/relations/html5-tree/color-attributes-1-expected.html ('k') | third_party/WebKit/LayoutTests/imported/wpt/mathml/relations/html5-tree/display-1-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!DOCTYPE html>

	2 <html>

	3 <head>

	4 <meta charset="utf-8"/>

	5 <title>MathML display attribute</title>

	6 <link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S2.html#S S1.SSS2">

	7 <meta name="assert" content="Verify that the display attribute on the math eleme nt is supported and impacts centering and line breaking with surrounding content .">

	8 <script src="/resources/testharness.js"></script>

	9 <script src="/resources/testharnessreport.js"></script>

	10 <script>

	11 function getBox(aId) {

	12 return document.getElementById(aId).getBoundingClientRect();

	13 }

	14 window.addEventListener("DOMContentLoaded", function() {

	15 var content = getBox("content");

	16

	17 var before_block = getBox("before_block");

	18 var mspace_block = getBox("mspace_block");

	19 var after_block = getBox("after_block");

	20 test(function() {

	21 assert_approx_equals(before_block.left, content.left, 1,

	22 "content before must be left aligned");

	23 assert_approx_equals((mspace_block.left + mspace_block.right) / 2,

	24 (content.left + content.right) / 2,

	25 1,

	26 "math must be centered.");

	27 assert_approx_equals(after_block.left, content.left, 1,

	28 "content before must be left aligned");

	29 assert_less_than_equal(before_block.bottom, mspace_block.top,

	30 "new line before math");

	31 assert_less_than_equal(mspace_block.bottom, after_block.top,

	32 "new line after math");

	33 }, "Test display math");

	34

	35 var before_inline = getBox("before_inline");

	36 var mspace_inline = getBox("mspace_inline");

	37 var after_inline = getBox("after_inline");

	38 test(function() {

	39 assert_approx_equals((before_inline.top + before_inline.bottom) / 2,

	40 (mspace_inline.top + mspace_inline.bottom) / 2,

	41 1,

	42 "content before must be horizontally aligned with mat h");

	43 assert_approx_equals((after_inline.top + after_inline.bottom) / 2,

	44 (mspace_inline.top + mspace_inline.bottom) / 2,

	45 1,

	46 "content after must be horizontally aligned with math ");

	47 assert_less_than_equal(before_inline.right, mspace_inline.left,

	48 "content before must be on the left of math");

	49 assert_less_than_equal(mspace_inline.right, after_inline.left,

	50 "content after must be on the right of math");

	51 }, "Test inline math");

	52

	53 done();

	54 });

	55 </script>

	56 <style>

	57 #content {

	58 width: 600px;

	59 background: #ccc;

	60 }

	61 span.square {

	62 display: inline-block;

	63 width: 50px;

	64 height: 50px;

	65 background: black;

	66 }

	67 mspace {

	68 background: black;

	69 }

	70 </style>

	71 </head>

	72 <body>

	73 <div id="content">

	74 <span id="before_block" class="square"></span>

	75 <math display="block"><mspace id="mspace_block" width="50px" height="50px"/> </math>

	76 <span id="after_block" class="square"></span>

	77 <br/>

	78 <span id="before_inline" class="square"></span>

	79 <math display="inline"><mspace id="mspace_inline" width="50px" height="50px" /></math>

	80 <span id="after_inline" class="square"></span>

	81 </div>

	82 </body>

	83 </html>

OLD	NEW