layout/reftests/bugs/84400-1.html

   1 <?xml version="1.0" encoding="UTF-8"?>
   2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
   3                       "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
   4 <html xmlns="http://www.w3.org/1999/xhtml">
   5   <head>
   6     <title>Testing controls that should match :enabled/:disabled</title>
   7     <style type="text/css">
   8       input, textarea, button, *.hideme { display: none; }
   9       div { margin-bottom: 0.2em; }
  10
  11       span, option, optgroup { background-color: red; }
  12       *:enabled + span.true, option.true:enabled, optgroup.true:enabled { color: lime; background-color: lime; }
  13       *:disabled + span.false, option.false:disabled, optgroup.false:disabled { color: lime; background-color: lime; }
  14     </style>
  15     <script type="text/javascript">
  16       // Runs through i1, i2, .... in and toggles the |disabled| attribute
  17       function onLoad() {
  18         var i = 1;
  19         var el = document.getElementById("i1");
  20         while (el) {
  21           if (el.hasAttribute("disabled")) {
  22             el.removeAttribute("disabled");
  23           } else {
  24             el.setAttribute("disabled", "disabled");
  25           }
  26           ++i;
  27           el = document.getElementById("i" + i);
  28         }
  29         if (i != 31) {
  30           alert("onLoad() handler failed!");
  31         }
  32       }
  33
  34       window.addEventListener("load", onLoad);
  35     </script>
  36   </head>
  37   <body>
  38     <div>
  39       There should be no red in the following (note: form styling should be enabled).
  40     </div>
  41
  42     <form method="get" action=".">
  43       <div>
  44         input:
  45         <input/> <span class="true">FAIL</span>
  46         <input disabled="disabled"/> <span class="false">FAIL</span>
  47         <input id="i1"/> <span class="false">FAIL</span>
  48         <input id="i2" disabled="disabled"/> <span class="true">FAIL</span>
  49       </div>
  50
  51       <div>
  52         password:
  53         <input type="password"/> <span class="true">FAIL</span>
  54         <input type="password" disabled="disabled"/> <span class="false">FAIL</span>
  55         <input type="password" id="i3"/> <span class="false">FAIL</span>
  56         <input type="password" id="i4" disabled="disabled"/> <span class="true">FAIL</span>
  57       </div>
  58
  59       <div>
  60         checkbox:
  61         <input type="checkbox"/> <span class="true">FAIL</span>
  62         <input type="checkbox" disabled="disabled"/> <span class="false">FAIL</span>
  63         <input type="checkbox" id="i5"/> <span class="false">FAIL</span>
  64         <input type="checkbox" id="i6" disabled="disabled"/> <span class="true">FAIL</span>
  65       </div>
  66
  67       <div>
  68         radio:
  69         <input type="radio"/> <span class="true">FAIL</span>
  70         <input type="radio" disabled="disabled"/> <span class="false">FAIL</span>
  71         <input type="radio" id="i7"/> <span class="false">FAIL</span>
  72         <input type="radio" id="i8" disabled="disabled"/> <span class="true">FAIL</span>
  73       </div>
  74
  75       <div>
  76         submit:
  77         <input type="submit"/> <span class="true">FAIL</span>
  78         <input type="submit" disabled="disabled"/> <span class="false">FAIL</span>
  79         <input type="submit" id="i9"/> <span class="false">FAIL</span>
  80         <input type="submit" id="i10" disabled="disabled"/> <span class="true">FAIL</span>
  81       </div>
  82
  83       <div>
  84         reset:
  85         <input type="reset"/> <span class="true">FAIL</span>
  86         <input type="reset" disabled="disabled"/> <span class="false">FAIL</span>
  87         <input type="reset" id="i11"/> <span class="false">FAIL</span>
  88         <input type="reset" id="i12" disabled="disabled"/> <span class="true">FAIL</span>
  89       </div>
  90
  91       <div>
  92         file:
  93         <input type="file"/> <span class="true">FAIL</span>
  94         <input type="file" disabled="disabled"/> <span class="false">FAIL</span>
  95         <input type="file" id="i13"/> <span class="false">FAIL</span>
  96         <input type="file" id="i14" disabled="disabled"/> <span class="true">FAIL</span>
  97       </div>
  98
  99       <div>
 100         hidden:
 101         <input type="hidden"/> <span class="true">FAIL</span>
 102         <input type="hidden" disabled="disabled"/> <span class="false">FAIL</span>
 103         <input type="hidden" id="i15"/> <span class="false">FAIL</span>
 104         <input type="hidden" id="i16" disabled="disabled"/> <span class="true">FAIL</span>
 105       </div>
 106
 107       <div>
 108         image:
 109         <input type="image"/> <span class="true">FAIL</span>
 110         <input type="image" disabled="disabled"/> <span class="false">FAIL</span>
 111         <input type="image" id="i17"/> <span class="false">FAIL</span>
 112         <input type="image" id="i18" disabled="disabled"/> <span class="true">FAIL</span>
 113       </div>
 114
 115       <div>
 116         button (input):
 117         <input type="button"/> <span class="true">FAIL</span>
 118         <input type="button" disabled="disabled"/> <span class="false">FAIL</span>
 119         <input type="button" id="i19"/> <span class="false">FAIL</span>
 120         <input type="button" id="i20" disabled="disabled"/> <span class="true">FAIL</span>
 121       </div>
 122
 123       <div>
 124         textarea:
 125         <textarea cols="5" rows="5"></textarea> <span class="true">FAIL</span>
 126         <textarea cols="5" rows="5" disabled="disabled"></textarea> <span class="false">FAIL</span>
 127         <textarea cols="5" rows="5" id="i21"></textarea> <span class="false">FAIL</span>
 128         <textarea cols="5" rows="5" id="i22" disabled="disabled"></textarea> <span class="true">FAIL</span>
 129       </div>
 130
 131       <div>
 132         button:
 133         <button>bogus</button> <span class="true">FAIL</span>
 134         <button disabled="disabled">bogus</button> <span class="false">FAIL</span>
 135         <button id="i23">bogus</button> <span class="false">FAIL</span>
 136         <button id="i24" disabled="disabled">bogus</button> <span class="true">FAIL</span>
 137       </div>
 138
 139       <div>
 140         select:
 141         <select class="hideme"><option>bogus</option></select> <span class="true">FAIL</span>
 142         <select class="hideme" disabled="disabled"><option>bogus</option></select> <span class="false">FAIL</span>
 143         <select class="hideme" id="i25"><option>bogus</option></select> <span class="false">FAIL</span>
 144         <select class="hideme" id="i26" disabled="disabled"><option>bogus</option></select> <span class="true">FAIL</span>
 145
 146       </div>
 147
 148       <div>
 149         option:
 150         <select size="4">
 151           <option class="true">FAIL</option>
 152           <option class="false" disabled="disabled">FAIL</option>
 153           <option class="false" id="i27">FAIL</option>
 154           <option class="true" id="i28" disabled="disabled">FAIL</option>
 155         </select>
 156       </div>
 157
 158       <div>
 159         optgroup:
 160         <select size="4">
 161           <optgroup class="true" label="FAIL">
 162             <option class="hideme">bogus</option>
 163           </optgroup>
 164           <optgroup class="false" disabled="disabled" label="FAIL">
 165             <option class="hideme">bogus</option>
 166           </optgroup>
 167           <optgroup class="false" id="i29" label="FAIL">
 168             <option class="hideme">bogus</option>
 169           </optgroup>
 170           <optgroup class="true" disabled="disabled" id="i30" label="FAIL">
 171             <option class="hideme">bogus</option>
 172           </optgroup>
 173         </select>
 174       </div>
 175
 176     </form>
 177
 178   </body>
 179 </html>