1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-27 04:57:45 +00:00

LibWeb: Emit "focusin" and "focusout" events

This commit is contained in:
Aliaksandr Kalenik 2024-02-25 06:51:28 +01:00 committed by Andreas Kling
parent cd7b5b18e4
commit 934aa6af6a
7 changed files with 78 additions and 0 deletions

View file

@ -0,0 +1,6 @@
focus target=<INPUT id="a">
focusin target=<INPUT id="a">
blur target=<INPUT id="a">
focusout target=<INPUT id="a">
focus target=<INPUT id="b">
focusin target=<INPUT id="b">

View file

@ -0,0 +1,54 @@
<script src="include.js"></script>
<style>
.input {
width: 100px;
height: 100px;
border: 1px solid black;
}
</style>
<input class="input" id="a" />
<input class="input" id="b" />
<script>
function elementToString(e) {
let element_string = `<${e.nodeName} `;
if (e.id) element_string += `id="${e.id}"`;
element_string += ">";
return element_string;
}
document.addEventListener("focusin", function (e) {
const target = elementToString(e.target);
println(`focusin target=${target}`);
});
document.addEventListener("focusout", function (e) {
const target = elementToString(e.target);
println(`focusout target=${target}`);
});
const a = document.getElementById("a");
const b = document.getElementById("b");
function onFocus(e) {
const target = elementToString(e.target);
println(`focus target=${target}`);
}
function onBlur(e) {
const target = elementToString(e.target);
println(`blur target=${target}`);
}
a.addEventListener("focus", onFocus);
a.addEventListener("blur", onBlur);
b.addEventListener("focus", onFocus);
b.addEventListener("blur", onBlur);
asyncTest(async done => {
a.focus();
await new Promise(resolve => setTimeout(resolve, 0));
b.focus();
await new Promise(resolve => setTimeout(resolve, 0));
done();
});
</script>