LibWeb: Implement input/textarea selection APIs

For both types of elements, `.selectionStart`, `.selectionEnd`,
`.selectionDirection`, `.setSelectionRange()`, `.select()` and the
`select` event are now implemented.
This commit is contained in:
Jelle Raaijmakers 2024-08-22 15:20:24 +02:00 committed by Tim Flynn
commit 814ca3267e
Notes: github-actions[bot] 2024-08-27 11:13:02 +00:00
12 changed files with 436 additions and 142 deletions

View file

@ -0,0 +1,46 @@
<input type="text" id="text-input">
<input type="date" id="date-input">
<textarea id="textarea">some
text</textarea>
<script src="../include.js"></script>
<script>
test(() => {
let textInput = document.getElementById('text-input');
let dateInput = document.getElementById('date-input');
let textarea = document.getElementById('textarea');
const dumpSelection = (element) => {
println(`${element.id} selectionStart: ${element.selectionStart} selectionEnd: ${element.selectionEnd} selectionDirection: ${element.selectionDirection}`);
};
dumpSelection(textInput);
dumpSelection(dateInput);
dumpSelection(textarea);
textInput.value = 'Well hello friends';
dumpSelection(textInput);
try {
dateInput.selectionStart = 0;
} catch (e) {
println(`date input setting selectionStart error: ${e}`);
}
textInput.addEventListener('select', e => println(`select event fired: ${e.target.selectionStart} ${e.target.selectionEnd}`))
textInput.select();
dumpSelection(textInput);
textInput.setSelectionRange(2, 4, 'forward');
dumpSelection(textInput);
textInput.selectionStart = 1;
dumpSelection(textInput);
textInput.selectionEnd = 5;
dumpSelection(textInput);
textInput.selectionStart = 6;
dumpSelection(textInput);
textInput.selectionDirection = 'backward';
dumpSelection(textInput);
textarea.select();
dumpSelection(textarea);
});
</script>