tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

scrollWidthHeight.xht (4409B)

      1 <?xml version="1.0" encoding="UTF-8"?>
      2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      3 <html xmlns="http://www.w3.org/1999/xhtml">
      4     <head>
      5         <title>CSS Test: CSSOM View scrollWidth and scrollHeight</title>
      6         <link rel="author" title="Robert O'Callahan" href="mailto:robert@ocallahan.org" />
      7         <link rel="help" href="http://www.w3.org/TR/cssom-view/#dom-element-scrollwidth" />
      8         <meta name="flags" content="dom" />
      9         <script src="/resources/testharness.js" type="text/javascript" />
     10         <script src="/resources/testharnessreport.js" type="text/javascript" />
     11         <style type="text/css"><![CDATA[
     12             #elemSimple, #elemOverflow, #elemNestedOverflow {
     13                 border:1px solid black;
     14                 overflow:hidden;
     15                 width:200px;
     16                 height:40px;
     17                 padding-bottom:50px;
     18                 padding-right:40px;
     19             }
     20             #elemSimple > div {
     21                 background:yellow;
     22                 width:60px;
     23                 height:30px;
     24             }
     25             #elemOverflow > div {
     26                 background:yellow;
     27                 width:250px;
     28                 height:150px;
     29             }
     30             #elemNestedOverflow > div {
     31                 background:yellow;
     32                 width:60px;
     33                 height:30px;
     34             }
     35             #elemNestedOverflow > div > div {
     36                 background:blue;
     37                 width:250px;
     38                 height:150px;
     39             }
     40         ]]></style>
     41     </head>
     42     <body>
     43         <noscript>Test not run - javascript required.</noscript>
     44         <div id="log" />
     45         <div id="elemSimple">
     46             <div />
     47         </div>
     48         <div id="elemOverflow">
     49             <div />
     50         </div>
     51         <div id="elemNestedOverflow">
     52             <div>
     53                 <div />
     54             </div>
     55         </div>
     56         <script type="text/javascript"><![CDATA[
     57             var elemSimple = document.getElementById("elemSimple");
     58             var elemOverflow = document.getElementById("elemOverflow");
     59             var elemNestedOverflow = document.getElementById("elemNestedOverflow");
     60 
     61             test(function(){
     62                 assert_equals(elemSimple.clientHeight, 90);
     63             }, "elemSimple.clientHeight is the height of the padding edge");
     64 
     65             test(function(){
     66                 assert_equals(elemSimple.scrollHeight, 90);
     67             }, "elemSimple.scrollHeight is its clientHeight");
     68 
     69             test(function(){
     70                 assert_equals(elemSimple.clientWidth, 240);
     71             }, "elemSimple.clientWidth is the width of the padding edge");
     72 
     73             test(function(){
     74                 assert_equals(elemSimple.scrollWidth, 240);
     75             }, "elemSimple.scrollWidth is its clientWidth");
     76 
     77             test(function(){
     78                 assert_equals(elemOverflow.clientHeight, 90);
     79             }, "elemOverflow.clientHeight is the height of the padding edge");
     80 
     81             test(function(){
     82                 assert_equals(elemOverflow.scrollHeight, 200);
     83             }, "elemOverflow.scrollHeight is the height of its scrolled contents (including padding)");
     84 
     85             test(function(){
     86                 assert_equals(elemOverflow.clientWidth, 240);
     87             }, "elemOverflow.clientWidth is the width of the padding edge");
     88 
     89             test(function(){
     90                 assert_equals(elemOverflow.scrollWidth, 290);
     91             }, "elemOverflow.scrollHeight is the width of its scrolled contents (including padding)");
     92 
     93             test(function(){
     94                 assert_equals(elemNestedOverflow.clientHeight, 90);
     95             }, "elemNestedOverflow.clientHeight is the height of the padding edge");
     96 
     97             test(function(){
     98                 assert_equals(elemNestedOverflow.scrollHeight, 150);
     99             }, "elemNestedOverflow.scrollHeight is the height of its scrolled contents (ignoring padding)");
    100 
    101             test(function(){
    102                 assert_equals(elemNestedOverflow.clientWidth, 240);
    103             }, "elemNestedOverflow.clientWidth is the height of the padding edge");
    104 
    105             test(function(){
    106                 assert_equals(elemNestedOverflow.scrollWidth, 250);
    107             }, "elemNestedOverflow.scrollWidth is the width of its scrolled contents (ignoring padding)");
    108 
    109         ]]></script>
    110     </body>
    111 </html>