test_selection.html (4357B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Test text selection functions</title> 5 <link rel="stylesheet" type="text/css" 6 href="chrome://mochikit/content/tests/SimpleTest/test.css" /> 7 8 <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> 9 <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script> 10 11 <script type="application/javascript" 12 src="../common.js"></script> 13 <script type="application/javascript" 14 src="../text.js"></script> 15 16 <script type="application/javascript"> 17 18 function doTest() { 19 // Test selection count: clean selection / check count. 20 testTextAddSelection("div0", 0, 2, 1); // |Test selection... 21 cleanTextSelections("div0"); 22 testTextSelectionCount("div0", 0); 23 24 // Test addition: adding two equal selections, the second one should 25 // not be added. 26 testTextAddSelection("div1", 7, 9, 1); // Test ad|di|ng two... 27 testTextAddSelection("div1", 7, 9, 1); // Test ad|di|ng two... 28 testTextGetSelection("div1", 7, 9, 0); 29 30 // Test overlapping selections: adding three selections, one adjacent. 31 testTextAddSelection("div2", 0, 3, 1); // |Tes|t adding 3... 32 testTextAddSelection("div2", 7, 9, 2); // |Tes|t ad|di|ng 3... 33 testTextAddSelection("div2", 3, 4, 3); // |Tes||t| ad|di|ng 3... 34 testTextGetSelection("div2", 0, 3, 0); 35 testTextGetSelection("div2", 3, 4, 1); 36 testTextGetSelection("div2", 7, 9, 2); 37 38 // Test selection re-ordering: adding two selections. 39 // NOTE: removeSelections aSelectionIndex is from start of document. 40 testTextAddSelection("div3", 0, 3, 1); // |Tes|t adding 2... 41 testTextAddSelection("div3", 7, 9, 2); // |Tes|t ad|di|ng 2... 42 testTextRemoveSelection("div3", 4, 1); // Test ad|di|ng 2... 43 44 // Test extending existing selection. 45 // NOTE: setSelectionBounds aSelectionIndex is from start of document. 46 testTextAddSelection("div4", 4, 5, 1); // Test| |extending... 47 testTextSetSelection("div4", 4, 9, 6, 1); // Test| exte|nding... 48 49 // Test moving an existing selection. 50 // NOTE: setSelectionBounds aSelectionIndex is from start of document. 51 testTextAddSelection("div5", 1, 3, 1); // T|es|t moving... 52 testTextSetSelection("div5", 5, 9, 6, 1); // Test |movi|ng... 53 54 // Test adding selections to multiple inner elements. 55 testTextAddSelection("div71", 0, 3, 1); // |Tes|t adding... 56 testTextAddSelection("div71", 7, 8, 2); // |Tes|t ad|d|ing... 57 testTextAddSelection("div72", 4, 6, 1); // Test| a|dding... 58 testTextAddSelection("div72", 7, 8, 2); // Test| a|d|d|ing... 59 60 // Test adding selection to parent element. 61 // NOTE: If inner elements are represented as embedded chars 62 // we count their internal selections. 63 testTextAddSelection("div7", 7, 8, 5); // Test ad|d|ing... 64 65 // Test attempt to selected generated content. 66 // range's start is clipped to end of generated content. 67 testTextAddSelection("div8", 1, 8, 1); 68 testTextGetSelection("div8", 6, 8, 0); 69 // range's end is expanded to end of container hypertext. 70 testTextAddSelection("div8", 10, 15, 2); 71 testTextGetSelection("div8", 10, 23, 1); 72 73 testTextAddSelection("li", 0, 8, 1); 74 testTextGetSelection("li", 3, 8, 0); 75 76 SimpleTest.finish(); 77 } 78 79 SimpleTest.waitForExplicitFinish(); 80 addA11yLoadEvent(doTest); 81 82 </script> 83 </head> 84 85 <body> 86 87 <p id="display"></p> 88 <div id="content" style="display: none"></div> 89 <pre id="test"> 90 </pre> 91 92 <div id="div0">Test selection count</div> 93 </br> 94 <div id="div1">Test adding two equal selections </div> 95 <div id="div2">Test adding 3 selections one adjacent </div> 96 <div id="div3">Test adding 2 selections, remove first one </div> 97 <div id="div4">Test extending a selection </div> 98 <div id="div5">Test moving a selection </div> 99 </br> 100 <div id="div7">Test adding selections to parent element 101 <div id="div71">Test adding selections to inner element1 </div> 102 <div id="div72">Test adding selections to inner element2 </div> 103 </div> 104 <style> 105 #div8:before { 106 content: 'hello '; 107 } 108 #div8:after { 109 content: ', i love you'; 110 } 111 </style> 112 <div id="div8">world</div> 113 <ol> 114 <li id="li">Number one</li> 115 </ol> 116 117 </body> 118 119 </html>