summaryrefslogtreecommitdiffstats
path: root/dom/base/test/test_user_select.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /dom/base/test/test_user_select.html
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'dom/base/test/test_user_select.html')
-rw-r--r--dom/base/test/test_user_select.html357
1 files changed, 357 insertions, 0 deletions
diff --git a/dom/base/test/test_user_select.html b/dom/base/test/test_user_select.html
new file mode 100644
index 0000000000..343772fbf7
--- /dev/null
+++ b/dom/base/test/test_user_select.html
@@ -0,0 +1,357 @@
+<!DOCTYPE>
+<html>
+<head>
+<title>user-select selection tests</title>
+ <script src="/tests/SimpleTest/SimpleTest.js"></script>
+ <script src="/tests/SimpleTest/EventUtils.js"></script>
+ <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+
+<style type="text/css">
+@font-face {
+ font-family: Ahem;
+ src: url("Ahem.ttf");
+}
+body { font-family: Ahem; font-size: 20px; }
+s, .non-selectable { user-select: none; }
+n { display: none; }
+a { position:absolute; bottom: 0; right:0; }
+.text { user-select: text; }
+</style>
+
+</head>
+<body>
+
+<div id="test1">aaaaaaa<s>bbbbbbbb</s>ccccccc</div>
+<div id="test2"><s>aaaaaaa</s>bbbbbbbbccccccc</div>
+<div id="test3">aaaaaaabbbbbbbb<s>ccccccc</s></div>
+<div id="test4">aaaaaaa<x><s>bbbbbbbb</s></x>ccccccc</div>
+<div id="test5"><x><s>aaaaaaa</s></x>bbbbbbbbccccccc</div>
+<div id="test6">aaaaaaabbbbbbbb<x><s>ccccccc</s></x></div>
+<div id="test7">aaaaaaa<x><s><n>bbbb</n>bbbb</s></x>ccccccc</div>
+<div id="test8"><x><s>aa<n>aaa</n>aa</s></x>bbbbbbbbccccccc</div>
+<div id="test9">aaaaaaabbbbbbbb<x><s>cc<n>ccccc</n></s></x></div>
+<div id="testA">aaaaaaa<n>bbb<s>bbbbb</s></n>ccccccc</div>
+<div id="testB"><n><s>aaaa</s>aaa</n>bbbbbbbbccccccc</div>
+<div id="testC">aaaaaaabbbbbbbb<n>cc<s>c</s>cccc</n></div>
+<div id="testE">aaa<s id="testEc1">aaaa<a class="text">bbbb</a>dd<a>cccc</a>ddddddd</s>eeee</div>
+<div id="testI">aaa<span contenteditable="true" spellcheck="false">bbb</span><s>ccc</s>ddd</div>
+<div id="testF">aaaa
+<div class="non-selectable">x</div>
+<div class="non-selectable">x</div>
+<div class="non-selectable">x</div>
+bbbb</div>
+<div id="testG" style="white-space:pre">aaaa
+<div class="non-selectable">x</div>
+<div class="non-selectable">x</div>
+<div class="non-selectable">x</div>
+bbbb</div>
+<div id="testH" style="white-space:pre">aaaa
+<div class="non-selectable">x</div><input>
+bbbbbbb</div>
+
+<iframe id="testD" srcdoc="<body>aaaa<span style='user-select:none'>bbbb</span>cccc"></iframe>
+
+<pre id="test">
+<script class="testbody" type="text/javascript">
+
+function test()
+{
+ function clear(w)
+ {
+ var sel = (w ? w : window).getSelection();
+ sel.removeAllRanges();
+ }
+ function doneTest(e)
+ {
+ // We hide the elements we're done with so that later tests
+ // are inside the rather narrow iframe mochitest gives us.
+ // It matters for synthesizeMouse event tests.
+ e.style.display = 'none';
+ e.offsetHeight;
+ }
+
+ function dragSelect(e, x1, x2, x3)
+ {
+ dir = x2 > x1 ? 1 : -1;
+ synthesizeMouse(e, x1, 5, { type: "mousedown" });
+ synthesizeMouse(e, x1 + dir, 5, { type: "mousemove" });
+ if (x3)
+ synthesizeMouse(e, x3, 5, { type: "mousemove" });
+ synthesizeMouse(e, x2 - dir, 5, { type: "mousemove" });
+ synthesizeMouse(e, x2, 5, { type: "mouseup" });
+ }
+
+ function shiftClick(e, x)
+ {
+ synthesizeMouse(e, x, 5, { type: "mousedown", shiftKey: true });
+ synthesizeMouse(e, x, 5, { type: "mouseup", shiftKey: true });
+ }
+
+ function init(arr, e)
+ {
+ clear();
+ var sel = window.getSelection();
+ for (i = 0; i < arr.length; ++i) {
+ var data = arr[i];
+ var r = new Range()
+ r.setStart(node(e, data[0]), data[1]);
+ r.setEnd(node(e, data[2]), data[3]);
+ sel.addRange(r);
+ }
+ }
+
+ function NL(s) { return s.replace(/(\r\n|\n\r|\r)/g, '\n'); }
+
+ function checkText(text, e)
+ {
+ var sel = window.getSelection();
+ is(NL(sel.toString()), text, e.id + ": selected text")
+ }
+
+ function checkRangeText(text, index)
+ {
+ var r = window.getSelection().getRangeAt(index);
+ is(NL(r.toString()), text, e.id + ": range["+index+"].toString()")
+ }
+
+ function node(e, arg)
+ {
+ if (typeof arg == "number")
+ return arg == -1 ? e : e.childNodes[arg];
+ return arg;
+ }
+
+ function checkRangeCount(n, e)
+ {
+ var sel = window.getSelection();
+ is(sel.rangeCount, n, e.id + ": Selection range count");
+ }
+
+ function checkRange(i, expected, e) {
+ var sel = window.getSelection();
+ var r = sel.getRangeAt(i);
+ is(r.startContainer, node(e, expected[0]), e.id + ": range["+i+"].startContainer");
+ is(r.startOffset, expected[1], e.id + ": range["+i+"].startOffset");
+ is(r.endContainer, node(e, expected[2]), e.id + ": range["+i+"].endContainer");
+ is(r.endOffset, expected[3], e.id + ": range["+i+"].endOffset");
+ }
+
+ function checkRanges(arr, e)
+ {
+ checkRangeCount(arr.length, e);
+ for (i = 0; i < arr.length; ++i) {
+ var expected = arr[i];
+ checkRange(i, expected, e);
+ }
+ }
+
+ // ======================================================
+ // ================== dragSelect tests ==================
+ // ======================================================
+
+ var e = document.getElementById('test1');
+ dragSelect(e, 20, 340);
+ checkText('aaaaaacc', e);
+ checkRanges([[0,1,-1,1], [2,0,2,2]], e);
+
+ clear();
+ dragSelect(e, 20, 260, 120);
+ checkText('aaaaa', e);
+ checkRanges([[0,1,0,6]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('test2');
+ dragSelect(e, 20, 340);
+ checkText('', e);
+ checkRanges([], e);
+
+ clear();
+ dragSelect(e, 340, 20, 141);
+ checkText('bbbbbbbbcc', e);
+ checkRanges([[1,0,1,10]], e);
+ // #test2 is used again below
+
+ clear();
+ e = document.getElementById('test3');
+ dragSelect(e, 20, 340, 295);
+ checkText('aaaaaabbbbbbbb', e);
+ checkRanges([[0,1,0,15]], e);
+ // #test3 is used again below
+
+ clear();
+ e = document.getElementById('test4');
+ dragSelect(e, 20, 340);
+ checkText('aaaaaacc', e);
+ checkRanges([[0,1,1,0], [2,0,2,2]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('test5');
+ dragSelect(e, 340, 20, 141);
+ checkText('bbbbbbbbcc', e);
+ checkRanges([[1,0,1,10]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('test6');
+ dragSelect(e, 20, 340, 295);
+ checkText('aaaaaabbbbbbbb', e);
+ checkRanges([[0,1,0,15]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('test7');
+ dragSelect(e, 20, 340);
+ checkText('aaaaaacccccc', e);
+ checkRanges([[0,1,1,0], [2,0,2,6]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('test8');
+ dragSelect(e, 340, 20, 140);
+ checkText('bbbbbccccc', e);
+ checkRanges([[1,3,1,13]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('test9');
+ dragSelect(e, 20, 340, 295);
+ checkText('aaaaaabbbbbbbb', e);
+ checkRanges([[0,1,0,15]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('testA');
+ dragSelect(e, 20, 340);
+ checkText('aaaaaaccccccc', e);
+ checkRanges([[0,1,2,7]], e);
+ checkRangeText('aaaaaabbbbbbbbccccccc', 0);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('testB');
+ dragSelect(e, 340, 20, 140);
+ checkText('bbbbbbbccccccc', e);
+ checkRanges([[1,1,1,15]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('testE');
+ dragSelect(e, 20, 360, 295);
+ checkText('aa\nbbbb\nee', e);
+ checkRangeCount(3, e);
+ checkRange(0, [0,1,-1,1], e);
+ checkRange(1, [1,0,-1,2], e.children[0]);
+ checkRange(2, [2,0,2,2], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('testI');
+ dragSelect(e, 200, 80);
+ checkText('bbd', e);
+ checkRangeCount(2, e);
+ doneTest(e);
+
+ // ======================================================
+ // ================== shift+click tests =================
+ // ======================================================
+
+ // test extending a selection that starts in a -moz-user-select:none node
+ clear();
+ e = document.getElementById('test2');
+ init([[0,0,0,1]], e);
+ checkRangeText('aaaaaaa', 0);
+ checkText('', e);
+ shiftClick(e, 340);
+ checkRangeText('bbbbbbbbcc', 0);
+ checkText('bbbbbbbbcc', e);
+ checkRanges([[-1,1,1,10]], e);
+ doneTest(e);
+
+ // test extending a selection that end in a -moz-user-select:none node
+ clear();
+ e = document.getElementById('test3');
+ init([[1,0,1,1]], e);
+ checkRangeText('ccccccc', 0);
+ checkText('', e);
+ shiftClick(e, 20);
+ checkRangeText('aaaaaabbbbbbbb', 0);
+ checkText('aaaaaabbbbbbbb', e);
+ checkRanges([[0,1,-1,1]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('testF');
+ synthesizeMouse(e, 1, 1, {});
+ synthesizeMouse(e, 400, 100, { shiftKey: true });
+ checkText("aaaa bbbb", e);
+ checkRanges([[0,0,-1,1],[6,0,6,5]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('testG');
+ synthesizeMouse(e, 1, 1, {});
+ synthesizeMouse(e, 400, 180, { shiftKey: true });
+ checkText("aaaa\n\n\n\nbbbb", e);
+ checkRanges([[0,0,-1,1],[2,0,-1,3],[4,0,-1,5],[6,0,6,5]], e);
+ doneTest(e);
+
+ clear();
+ e = document.getElementById('testH');
+ synthesizeMouse(e, 1, 1, {});
+ synthesizeMouse(e, 30, 90, { shiftKey: true });
+ synthesizeMouse(e, 50, 90, { shiftKey: true });
+ synthesizeMouse(e, 70, 90, { shiftKey: true });
+ checkText("aaaa\n\nbbb", e);
+ checkRanges([[0,0,-1,1],[-1,2,3,4]], e);
+
+ doneTest(e);
+ // ======================================================
+ // ==================== Script tests ====================
+ // ======================================================
+
+ clear();
+ e = document.getElementById('testD');
+ clear(e.contentWindow);
+ sel = e.contentWindow.getSelection();
+ sel.selectAllChildren(e.contentDocument.body);
+ is(window.getSelection().rangeCount, 0, "testD: no selection in outer window");
+ is(sel.toString(), 'aaaacccc', "testD: scripted selection");
+ is(sel.rangeCount, 1, "testD: scripted selection isn't filtered");
+ is(sel.getRangeAt(0).toString(), 'aaaabbbbcccc', "testD: scripted selection isn't filtered");
+
+ // ======================================================
+ // ================== Kbd command tests =================
+ // ======================================================
+
+ clear();
+ e = document.getElementById('testD');
+ clear(e.contentWindow);
+ e.contentWindow.focus();
+ synthesizeKey("a", { accelKey:true }, e.contentWindow);
+ sel = e.contentWindow.getSelection();
+ is(window.getSelection().rangeCount, 0, "testD: no selection in outer window");
+ is(sel.toString(), 'aaaacccc', "testD: kbd selection");
+ is(sel.rangeCount, 2, "testD: kbd selection is filtered");
+ is(sel.getRangeAt(0).toString(), 'aaaa', "testD: kbd selection is filtered");
+ is(sel.getRangeAt(1).toString(), 'cccc', "testD: kbd selection is filtered");
+ doneTest(e);
+
+ clear();
+ SimpleTest.finish();
+}
+
+// These tests depends on the Ahem font being loaded and rendered so wait for
+// font to load, then wait a frame for them to be rendered too.
+window.onload = function() {
+ document.fonts.ready.then(function() {
+ requestAnimationFrame(test);
+ });
+};
+
+SimpleTest.waitForExplicitFinish();
+</script>
+</pre>
+</body>
+</html>
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-13 01:02:41 +0000