layout/generic/test/test_selection_preventDefault.html

   1 <!DOCTYPE>
   2 <html>
   3 <head>
   4 <title>selection preventDefault test</title>
   5 <script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
   6 <script type="text/javascript" src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
   7 <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
   8
   9 <style type="text/css">
  10   #fixedDiv1 {
  11     position: fixed;
  12     right: 0;
  13     overflow: scroll;
  14     width: 200px;
  15     top: 0;
  16   }
  17   input {
  18     font-size: 16px;
  19     height: 16px;
  20     width: 80px;
  21     margin: 0;
  22     padding: 0;
  23   }
  24 </style>
  25
  26 </head>
  27 <body>
  28 <input id="input" type="text" value="iiiiiiiii iiiiiiiii iiiiiiiii">
  29 <div id="fixedDiv1" class="testingDiv">
  30 dddddd dddddd dddddd
  31 </div>
  32 <pre id="test">
  33 <script class="testbody" type="text/javascript">
  34
  35 var fixedDiv1 = document.getElementById("fixedDiv1");
  36 var input = document.getElementById("input");
  37
  38 function test()
  39 {
  40   function getSelectionForEditor(aEditorElement)
  41   {
  42     const nsIDOMNSEditableElement =
  43       Components.interfaces.nsIDOMNSEditableElement;
  44     return aEditorElement.QueryInterface(nsIDOMNSEditableElement).editor.selection;
  45   }
  46
  47   function clear()
  48   {
  49     var sel = window.getSelection();
  50     if (sel.rangeCount > 0)
  51       sel.collapseToEnd();
  52     sel = getSelectionForEditor(input);
  53     if (sel.rangeCount > 0)
  54       sel.collapseToEnd();
  55   }
  56
  57   const kFalse = 0;
  58   const kTrue  = 1;
  59   const kToDo  = 2;
  60
  61   function check(aFixedDiv1ShouldBeSelected,
  62                  aInputShouldBeSelected,
  63                  aTestingDescription)
  64   {
  65     function checkCharacter(aSelectedText,
  66                             aShouldBeIncludedCharacter,
  67                             aSouldBeSelected,
  68                             aElementName)
  69     {
  70       var boolvalue = aSouldBeSelected & kTrue;
  71       var f = aSouldBeSelected & kToDo ? todo : ok;
  72       var str = aSelectedText.replace('\n', '\\n');
  73       if (boolvalue) {
  74         f(aSelectedText.indexOf(aShouldBeIncludedCharacter) >= 0,
  75           "The contents of " + aElementName +
  76           " aren't selected (" + aTestingDescription +
  77           "): Selected String: \"" + str + "\"");
  78       } else {
  79         f(aSelectedText.indexOf(aShouldBeIncludedCharacter) < 0,
  80           "The contents of " + aElementName +
  81           " are selected (" + aTestingDescription +
  82           "): Selected String: \"" + str + "\"");
  83       }
  84     }
  85
  86     var sel = window.getSelection().toString();
  87     checkCharacter(sel, "d", aFixedDiv1ShouldBeSelected, "fixedDiv1");
  88
  89     // input contents must not be included on the parent
  90     // selection.
  91     checkCharacter(sel, "i", false, "input (checking on parent)");
  92
  93     var selInput = getSelectionForEditor(input).toString();
  94     checkCharacter(selInput, "i", aInputShouldBeSelected, "input");
  95   }
  96
  97   function eventHandler(evt) {
  98     evt.preventDefault();
  99   }
 100
 101   // prevent default action on mousedown should prevent selection
 102   fixedDiv1.addEventListener("mousedown", eventHandler);
 103   synthesizeMouse(fixedDiv1, 30, 5, { type: "mousedown" });
 104   synthesizeMouse(fixedDiv1, 40, 5, { type: "mousemove" });
 105   synthesizeMouse(fixedDiv1, 40, 5, { type: "mouseup" });
 106   check(kFalse, kFalse, "fixedDiv1-fixedDiv1-mousedown");
 107   clear();
 108
 109   input.addEventListener("mousedown", eventHandler);
 110   synthesizeMouse(input, 20, 5, { type: "mousedown" });
 111   synthesizeMouse(input, 40, 5, { type: "mousemove" });
 112   synthesizeMouse(input, 40, 5, { type: "mouseup" });
 113   check(kFalse, kFalse, "input-input-mousedown");
 114   clear();
 115
 116   // clean up mousedown listener
 117   [fixedDiv1, input].forEach(function(element) {
 118      element.removeEventListener("mousedown", eventHandler);
 119   });
 120
 121   // prevent default action on mouseup should not affect the selection state
 122   fixedDiv1.addEventListener("mouseup", eventHandler);
 123   synthesizeMouse(fixedDiv1, 30, 5, { type: "mousedown" });
 124   synthesizeMouse(fixedDiv1, 40, 5, { type: "mousemove" });
 125   synthesizeMouse(fixedDiv1, 40, 5, { type: "mouseup" });
 126   check(kTrue, kFalse, "fixedDiv1-fixedDiv1-mouseup");
 127   clear();
 128
 129   input.addEventListener("mouseup", eventHandler);
 130   synthesizeMouse(input, 20, 5, { type: "mousedown" });
 131   synthesizeMouse(input, 40, 5, { type: "mousemove" });
 132   synthesizeMouse(input, 40, 5, { type: "mouseup" });
 133   check(kFalse, kTrue, "input-input-mouseup");
 134   clear();
 135
 136   [fixedDiv1, input].forEach(function(element) {
 137      element.removeEventListener("mouseup", eventHandler);
 138   });
 139
 140   // touchmove event should not affect the selection state
 141   synthesizeTouch(fixedDiv1, 30, 5, { type: "touchstart" });
 142   synthesizeTouch(fixedDiv1, 40, 5, { type: "touchmove" });
 143   check(kFalse, kFalse, "fixedDiv1-fixedDiv1-touchmove");
 144   synthesizeTouch(fixedDiv1, 40, 5, { type: "touchend" });
 145   clear();
 146
 147   synthesizeTouch(input, 20, 5, { type: "touchstart" });
 148   synthesizeTouch(input, 40, 5, { type: "touchmove" });
 149   check(kFalse, kFalse, "input-input-touchmove");
 150   synthesizeTouch(input, 40, 5, { type: "touchend" });
 151   clear();
 152
 153   fixedDiv1.addEventListener("touchmove", eventHandler);
 154   synthesizeTouch(fixedDiv1, 30, 5, { type: "touchstart" });
 155   synthesizeTouch(fixedDiv1, 40, 5, { type: "touchmove" });
 156   check(kFalse, kFalse, "fixedDiv1-fixedDiv1-touchmove-preventDefault");
 157   synthesizeTouch(fixedDiv1, 40, 5, { type: "touchend" });
 158   clear();
 159
 160   input.addEventListener("touchmove", eventHandler);
 161   synthesizeTouch(input, 20, 5, { type: "touchstart" });
 162   synthesizeTouch(input, 40, 5, { type: "touchmove" });
 163   check(kFalse, kFalse, "input-input-touchmove-preventDefault");
 164   synthesizeTouch(input, 40, 5, { type: "touchend" });
 165   clear();
 166
 167   SimpleTest.finish();
 168 }
 169 window.onload = function() { setTimeout(test, 0); };
 170 SimpleTest.waitForExplicitFinish();
 171 </script>
 172 </pre>
 173 </body>
 174 </html>