third_party/webdriver/test_data/rich_text.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   2         "http://www.w3.org/TR/html4/loose.dtd">
   3 <html>
   4 <head>
   5 <script type="text/javascript">
   6 function setKeypressHandler (el, keyHandler) {
   7   if (el.addEventListener) {
   8     el.addEventListener('keypress', keyHandler, false);
   9     el.addEventListener('keydown', keyHandler, false);
  10     el.addEventListener('keyup', keyHandler, false);
  11   } else {
  12     el.attachEvent('onkeypress', keyHandler);
  13     el.attachEvent('onkeydown', keyHandler);
  14     el.attachEvent('onkeyup', keyHandler);
  15   }
  16 }
  17
  18 function output (text) {
  19   var div = document.getElementById('debugOutput');
  20   div.appendChild(document.createTextNode(text));
  21   div.appendChild(document.createElement('br'));
  22 }
  23
  24 window.onload = function () {
  25   // Super dumb browser detection
  26   var isIE = window.navigator.userAgent.search('MSIE') != -1;
  27
  28   var editFrame = document.getElementById('editFrame').contentWindow;
  29   setKeypressHandler(editFrame.document, printEventData);
  30   if (isIE) {
  31     editFrame.document.body.contentEditable = true;
  32   } else {
  33     editFrame.document.designMode = 'On';
  34     // Attach a name to the containing HTML element
  35     editFrame.document.getElementsByTagName("html")[0].id = "frameHtml";
  36   }
  37
  38   var editDiv = document.getElementById('editDiv');
  39   setKeypressHandler(editDiv, printEventData);
  40   editDiv.contentEditable = true;
  41
  42   editFrame.document.body.style.margin = 1;
  43   editFrame.document.body.style.padding = 0;
  44   editFrame.document.body.id = 'theBody';
  45
  46   editDiv.style.margin = 1;
  47   editDiv.style.padding = 0;
  48
  49   window.setTimeout(function() {
  50     var pre = document.createElement('pre');
  51     function write(text) {
  52       pre.appendChild(document.createTextNode(text));
  53       pre.appendChild(document.createElement('br'));
  54     }
  55
  56     write('frame.contentWindow.document.designMode: ' +
  57       editFrame.document.designMode);
  58     write('frame.contentWindow.document.body.contentEditable: ' +
  59       editFrame.document.body.contentEditable);
  60     document.getElementById('editFrameInfo').appendChild(pre);
  61
  62     pre = document.createElement('pre');
  63     write('div.ownerDocument.designMode: ' +
  64       editDiv.ownerDocument.designMode);
  65     write('div.ownerDocument.body.contentEditable: ' +
  66       editDiv.ownerDocument.body.contentEditable);
  67     write('div.contentEditable: ' +
  68       editDiv.contentEditable);
  69     document.getElementById('editDivInfo').appendChild(pre);
  70   }, 0);
  71 };
  72
  73 function isDef(obj, prop) {
  74   return typeof obj[prop] != 'undefined';
  75 }
  76
  77 function printEventData(e) {
  78   e = e || window.event;
  79
  80   function write(id, text, opt_color) {
  81     var el = document.getElementById(id);
  82     el.innerHTML = '[' + text + ']';
  83     el.style.backgroundColor = opt_color || 'white';
  84   }
  85   write('type', e.type);
  86   write('tagName', isDef(e, 'target') ? e.target.tagName : e.srcElement.tagName);
  87   write('tagId', isDef(e, 'target') ? e.target.id : e.srcElement.id);
  88   write('keyidentifier', isDef(e, 'keyIdentifier') ? e.keyIdentifier : 'n/a');
  89   write('keylocation', isDef(e, 'keyLocation') ? e.keyLocation : 'n/a');
  90   write('keycode', e.keyCode);
  91   write('charcode', e.charCode);
  92   write('which', e.which);
  93   if (isDef(e, 'isTrusted')) {
  94     write('istrusted', e.isTrusted, e.isTrusted ? '#afa' : '#faa');
  95   } else {
  96     write('istrusted', 'n/a');
  97   }
  98   write('alt', e.altKey);
  99   write('ctrl', e.ctrlKey);
 100   write('shift', e.shiftKey);
 101   write('meta', e.metaKey);
 102
 103   var s = "";
 104   for (var i in e) {
 105     s += i + ": " + e[i] + "   ";
 106   }
 107   //alert(s);
 108 }
 109 </script>
 110 </head>
 111 <body>
 112 <div>
 113   <div id="butter" style="background-color: #ffa;">
 114   </div>
 115   <table width="100%">
 116       <tr valign="top">
 117         <td width="50%">
 118           <div>IFRAME</div>
 119           <iframe id="editFrame" name="editFrame" src="" height="200px" width="300px" frameborder="0" style="border: 1px solid black;">
 120           </iframe>
 121           <div id="editFrameInfo">
 122           <pre>frame.contentWindow.document.designMode: on<br>frame.contentWindow.document.body.contentEditable: false<br></pre></div>
 123         </td>
 124         <td>
 125           <div>DIV</div>
 126           <div id="editDiv" style="border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: black; border-right-color: black; border-bottom-color: black; border-left-color: black; height: 200px; width: 300px; overflow-x: auto; overflow-y: auto; margin-top: 1px; margin-right: 1px; margin-bottom: 1px; margin-left: 1px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; " contenteditable="true">
 127           </div>
 128           <div id="editDivInfo">
 129           <pre>div.ownerDocument.designMode: off<br>div.ownerDocument.body.contentEditable: false<br>div.contentEditable: true<br></pre></div>
 130         </td>
 131       </tr>
 132   </table>
 133 </div>
 134
 135 <HR>
 136 <DIV style="margin: 0px;padding:0px;padding-left:10px;font-family:Courier;">
 137   <TABLE cellpadding="0" cellspacing="0" width="200px" style="font-size:9pt;">
 138     <TBODY>
 139       <TR><TD width="110px">type:</TD><TD id="type" width="90px">[]</TD></TR>
 140       <TR><TD>tagName:</TD><TD id="tagName">[]</TD></TR>
 141       <TR><TD>id:</TD><TD id="tagId">[]</TD></TR>
 142       <TR><TD>keyIdentifier:</TD><TD id="keyidentifier">[]</TD></TR>
 143       <TR><TD>keyLocation:</TD><TD id="keylocation">[]</TD></TR>
 144       <TR><TD>keyCode:</TD><TD id="keycode">[]</TD></TR>
 145       <TR><TD>charCode:</TD><TD id="charcode">[]</TD></TR>
 146       <TR><TD>which:</TD><TD id="which">[]</TD></TR>
 147       <TR><TD>isTrusted:</TD><TD id="istrusted">[]</TD></TR>
 148       <TR><TD colspan="2">---------------------</TD></TR>
 149       <TR><TD colspan="2">Modifiers</TD></TR>
 150       <TR><TD>alt:</TD><TD id="alt">[]</TD></TR>
 151       <TR><TD>ctrl:</TD><TD id="ctrl">[]</TD></TR>
 152       <TR><TD>shift:</TD><TD id="shift">[]</TD></TR>
 153       <TR><TD>meta:</TD><TD id="meta">[]</TD></TR>
 154     </TBODY>
 155   </TABLE>
 156 </DIV>
 157
 158
 159
 160 </BODY></HTML>