layout/reftests/bugs/966992-1-ref.html

Wed, 31 Dec 2014 13:27:57 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 13:27:57 +0100
branch
TOR_BUG_3246
changeset 6
8bccb770b82d
permissions
-rw-r--r--

Ignore runtime configuration files generated during quality assurance.

     1 <!DOCTYPE HTML>
     2 <html class="reftest-wait"><head>
     3     <meta charset="utf-8">
     4     <title>Testcases for overflow-clip-box:content-box</title>
     5     <style type="text/css">
     6 font-face {
     7   font-family: DejaVuSansMono;
     8   src: url(../fonts/DejaVuSansMono.woff),url(DejaVuSansMono.woff);
     9 }
    11         html,body {
    12             color:black; background-color:white; font:16px DejaVuSansMono!important; padding:0; margin:7px;
    13         }
    15     input {
    16       width: 100px; padding:50px; -moz-appearance:none; overflow-clip-box:padding-box;
    17       border: 3px solid black;
    18     }
    19     textarea, #textarea {
    20       width: 160px; height:110px; padding:40px; overflow:scroll; -moz-appearance:none; overflow-clip-box:padding-box;
    21       border: 3px solid black;
    22     }
    23     #textarea { word-break: break-all; font:14px DejaVuSansMono!important; }
    26 p {
    27  position:absolute;
    28  margin:0;
    29  width:70%;
    30  height: 1px;
    31  background:magenta;
    32 }
    33 .rel p { width:200%; }
    34 .block {
    35   border:1px solid grey; height:50px; width:200px; padding:20px;
    36   overflow:auto; overflow-clip-box:padding-box;
    37 }
    38 .rel { position:relative; }
    39 .mask1 { position:absolute; width:20px; background:white; top:0; bottom:0; right:0; }
    40 .mask2 { position:absolute; width:20px; background:white; top:0px; bottom:-15px; right:220px; z-index:99; }
    41 .mask3 { position:absolute; width:20px; background:white; top:0; bottom:0; left:200px; }
    42 .mask4 { position:absolute; height:40px; background:white; top:4px; left:3px; width:210px; z-index:99; }
    43 .mask5 { position:absolute; height:40px; background:white; top:3px; right:3px; width:50px; }
    44 .button { width:100px; padding:0 50px; overflow:hidden; }
    45     </style>
    46 <script>
    47 function runTest() {
    48   // the timeout is for avoiding differences in scrollbar fading
    49   document.documentElement.removeAttribute("class");
    50 }
    51 </script>
    52 </head>
    53 <body onload="setTimeout(runTest,5000)">
    55 <div class="rel block">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX<p style="padding-right:20px"></p><div class=mask1></div></div>
    56 <div style="float:right">
    58 <div class="rel block" style="box-sizing:border-box;height:90px"><span style="padding-right:20px">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span><div class=mask1></div></div>
    60 </div>
    62 <div class="rel block"><span style="padding-right:20px">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span><p></p><div class=mask1></div></div>
    63 <div id="d1" class="rel block"><span style="padding-right:20px">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span><span style="position:relative;"><div class=mask2></div><div class=mask1></div></span><p></p></div>
    64 <script>
    65 document.getElementById("d1").scrollLeft = "100000";
    66 </script>
    67 <div class="block"><span style="padding-right:20px"><span style="position:relative;"><div class=mask3></div>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span></span><p></p></div>
    69 <span style="position:relative"><input spellcheck=false type="text" placeholder="someveryveryveryveryverylongvalue"><div class=mask5></div></span>
    70 <span style="position:relative"><input spellcheck=false type="text" value="someveryveryveryveryverylongvalue"><div class=mask5></div></span><br>
    71 <span style="position:relative"><input spellcheck=false type="password" value="someveryveryveryveryverylongpassword"><div class=mask5></div></span>
    72 <span style="position:relative"><input spellcheck=false type="email" value="someveryveryveryveryverylongvalue"><div class=mask5></div></span>
    73 <span style="position:relative"><input spellcheck=false type="blah" value="someveryveryveryveryverylongvalue"><div class=mask5></div></span>
    74 <br>
    75 <input spellcheck=false type="button" value="button" class="button" style="overflow-clip-box:initial">
    76 <input spellcheck=false type="button" value="button" class="button">
    77 <input spellcheck=false type="reset" class="button">
    78 <input spellcheck=false type="submit" class="button"><br>
    79 <input spellcheck=false type="button" value="" class="button">
    80 <input spellcheck=false type="reset" value="" class="button">
    81 <input spellcheck=false type="submit" value="" class="button"><br>
    83 </body>
    84 </html>

mercurial