summaryrefslogtreecommitdiffstats
path: root/layout/base/tests/test_frame_reconstruction_for_column_span.html
blob: c36890124146a64f5d1addc8e4aded5ecd5c21b2 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!DOCTYPE html>
<html>
  <meta charset="utf-8">
  <title>
    Test for Bug 1503420: Test we don't reframe multi-column containing block
    when appending a block containing a spanner kid.
  </title>
  <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
  <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>

  <script>
  SimpleTest.waitForExplicitFinish();

  const utils = SpecialPowers.getDOMWindowUtils(window);

  function appendBlock() {
    // Create a subtree like the following, and append it to columns.
    // <div>
    //   <h3>spanner</h3>
    //   block2
    // </div>
    var spanner = document.createElement("h3");
    var spannerText = document.createTextNode("spanner");
    spanner.appendChild(spannerText);

    var block2 = document.createElement("div");
    var block2Text = document.createTextNode("block2");
    block2.appendChild(spanner);
    block2.appendChild(block2Text)

    var column = document.getElementById("column");
    column.appendChild(block2);
  }

  function runTest() {
    document.documentElement.offsetTop;
    // We expected to construct 6 more frames.
    // 1) Block frame for <div>
    // 2) Block frame for <h3>
    // 3) Text frame for "spanner"
    // 4) Text frame for "block2"
    // 5) Column-span wrapper for <h3>, which is a sibling of <div>
    // 6) Column-span wrapper for 5), which is a sibling of <article>
    // Note: creating a continuation frame doesn't increase the count.
    const expectedFrameConstructCount = utils.framesConstructed + 6;

    appendBlock();
    document.documentElement.offsetTop;

    is(utils.framesConstructed, expectedFrameConstructCount,
       "We shouldn't construct unexpected frames.");

    SimpleTest.finish();
  }
  </script>

  <style>
  #column {
    column-count: 3;
    column-rule: 6px solid;
    width: 400px;
    outline: 1px solid black;
  }
  h3 {
    column-span: all;
    outline: 1px solid blue;
  }
  </style>

  <body onload="runTest();">
    <article id="column">
      <div>block1</div>
    </article>
  </body>
</html>