summaryrefslogtreecommitdiffstats
path: root/layout/reftests/text-overflow/xulscroll.html
blob: c43f951232510312980c666f8d24f93c1f20771b (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
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<!-- Any copyright is dedicated to the Public Domain.
   - http://creativecommons.org/publicdomain/zero/1.0/ -->
<!DOCTYPE HTML>
<html class="reftest-wait"><head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Testcase for bug 672944</title>
    <style type="text/css">
@font-face {
  font-family: DejaVuSansMono;
  src: url(../fonts/DejaVuSansMono.woff),url(DejaVuSansMono.woff);
}
html,body {
    color:black; background-color:white; font-size:16px; padding:0; margin:0; font-family:DejaVuSansMono;
}
	
  .bacon {
    white-space:    nowrap;
    text-overflow:  ellipsis ellipsis;
    overflow:       hidden;
    width:          30ch;
    display:        -moz-box;
    background:     lime;
    margin-bottom:  1em;
  }

  .auto {
    overflow-x:       auto;
    padding-bottom: 2ch;
    width:          29.5ch;
    text-overflow:  "" "";
  }
  .scroll {
    overflow:       auto;
    padding:        2ch;
    border:         3px solid black;
    text-overflow:  "" "";
  }
  .scroll2 {
    overflow:       auto;
    padding:        3ch;
    text-overflow:  "" "";
  }
  .scroll3 {
    overflow:       auto;
    padding:        2ch;
    text-indent:    -3ch;
    text-overflow:  "" "";
  }
  .scroll4 {
    overflow:       auto;
    padding:        2ch 0.2ch;
    text-overflow:  "" "";
  }
span { background-color:white; }

#block-hover {
  position:fixed;
  top:0;left:0;width:100%;height:100%;
}
    </style>
    <script type="text/javascript">
function init() {

  // The behaviour of this test may be subtly different when this code runs
  // before the first paint vs after the first paint. If you encounter
  // intermittent failures in this reftest, you might have luck turning it into
  // a reliable failure by wrapping this function body in a
  // requestAnimationFrame callback to force it to run after the first paint.
  // Alternatively you might need to force it to run before the first paint,
  // perhaps by running it inline (not as an onload handler) or something.

  // workaround bug 936936
  document.body.style.display = "block";
  document.body.getBoundingClientRect();

  document.getElementById('rtl_auto').scrollLeft=999999;

  document.documentElement.removeAttribute('class');
}
    </script>
</head>
<body onload="init();" style="display: inline;">

<div style="float:right;" dir="rtl">
  <div class="bacon"><span>1Beef hamburger bacon tri-tip, jowl biltong tail ribeye ham</span></div><br>
  <div id="rtl_auto" class="bacon auto"><span>2Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll"><span>3Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll2"><span>4Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll3"><span>5Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll4"><span>6Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
</div>

<div>
  <div class="bacon"><span>1Beef hamburger bacon tri-tip, jowl biltong tail ribeye ham</span></div><br>
  <div class="bacon auto"><span>2Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll"><span>3Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll2"><span>4Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll3"><span>5Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
  <div class="bacon scroll4"><span>6Beef hamburger bacon tri-tipJOWLBILTONG tail ribeye ham</span></div><br>
</div>

<div id="block-hover"></div>
</body>
</html>