mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-26 01:35:08 +02:00
2a2f8ef90b
When triple clicking on text, we should select the entire paragraph, or entire line in <input>s and <textarea>s. If the mouse button is held down and the user starts dragging, the selection expands with additional paragraphs or lines. This expands on the work of Kai Wildberger (PR #7681) but was adjusted for the work that happened previously to support double click + drag moves and includes triple click support for our Qt UI. Co-authored-by: Kai Wildberger <kiawildberger@gmail.com>
58 lines
2.3 KiB
HTML
58 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<script src="include.js"></script>
|
|
<style>
|
|
div, p {
|
|
font-size: 20px;
|
|
margin: 0;
|
|
}
|
|
#triple-container { margin-top: 100px; width: 300px; }
|
|
</style>
|
|
<div id="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi sapien velit, sagittis vel mauris eget, placerat mattis arcu. Praesent ac pharetra dolor.</div>
|
|
<div id="triple-container">
|
|
<p id="triple1">First paragraph for triple-click test.</p>
|
|
<p id="triple2">Second paragraph with <a href="#">a link</a> inside.</p>
|
|
</div>
|
|
<script>
|
|
test(() => {
|
|
// Select word "Lorem" by dispatching double click event
|
|
internals.click(20, 20, 2);
|
|
|
|
// Should be equal to "Lorem"
|
|
println(window.getSelection());
|
|
|
|
const text = document.getElementById("text");
|
|
|
|
let modifiers = 1 << 2; // Mod_Shift
|
|
internals.sendKey(text, "Right", modifiers);
|
|
internals.sendKey(text, "Right", modifiers);
|
|
internals.sendKey(text, "Right", modifiers);
|
|
// Should be equal to "Lorem ip"
|
|
println(window.getSelection());
|
|
|
|
// After click() with clickCount=2, mouseUp is called, resetting selection mode.
|
|
// Subsequent drag should select character-by-character, not word-by-word.
|
|
internals.click(147, 20, 2);
|
|
println(window.getSelection()); // "dolor"
|
|
internals.mouseDown(147, 20);
|
|
internals.mouseMove(220, 20);
|
|
internals.mouseUp(220, 20);
|
|
println(window.getSelection()); // Should be characters, not whole words
|
|
|
|
// After clickAndHold() with clickCount=2, selection mode is preserved.
|
|
// Subsequent drag should extend by whole words.
|
|
internals.clickAndHold(147, 20, 2);
|
|
internals.mouseMove(220, 20);
|
|
internals.mouseUp(220, 20);
|
|
println(window.getSelection()); // Should be "dolor sit" (whole words)
|
|
|
|
// Triple-click + drag should select entire paragraphs.
|
|
// Drag from first paragraph to second paragraph (which contains <a>).
|
|
const triple1 = document.getElementById("triple1");
|
|
const triple2 = document.getElementById("triple2");
|
|
internals.clickAndHold(20, triple1.offsetTop + 10, 3);
|
|
internals.mouseMove(20, triple2.offsetTop + 10);
|
|
internals.mouseUp(20, triple2.offsetTop + 10);
|
|
println(window.getSelection());
|
|
});
|
|
</script>
|