1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-28 17:27:46 +00:00

Ladybird+LibWeb: Add basic select element support

This commit is contained in:
Bastiaan van der Plaat 2023-12-07 15:53:49 +01:00 committed by Andreas Kling
parent b439431488
commit 466153e680
28 changed files with 641 additions and 4 deletions

View file

@ -0,0 +1,5 @@
1. "one"
2. 0
3. "two"
4. 3
5. "three"

View file

@ -0,0 +1,67 @@
<script src="include.js"></script>
<script>
test(() => {
let testCounter = 1;
function testPart(part) {
println(`${testCounter++}. ${JSON.stringify(part())}`);
}
// 1. Get select value of unedited
testPart(() => {
const select = document.createElement('select');
// FIXME: Remove selected attribute (currently this is needed because the DIN children are not loaded to select first item in test run)
select.innerHTML = `
<option value="one" selected>One</option>
<option value="two">Two</option>
<option value="three">Three</option>
`;
return select.value;
});
// 2. Get select selectedIndex
testPart(() => {
const select = document.createElement('select');
// FIXME: Remove selected attribute (currently this is needed because the DIN children are not loaded to select first item in test run)
select.innerHTML = `
<option value="one" selected>One</option>
<option value="two">Two</option>
<option value="three">Three</option>
`;
return select.selectedIndex;
});
// 3. Get select value of selectedIndex
testPart(() => {
const select = document.createElement('select');
select.innerHTML = `
<option value="one">One</option>
<option value="two">Two</option>
<option value="three">Three</option>
`;
select.selectedIndex = 1;
return select.value;
});
// 4. Get select length
testPart(() => {
const select = document.createElement('select');
select.innerHTML = `
<option value="one">One</option>
<option value="two">Two</option>
<option value="three">Three</option>
`;
return select.length;
});
// 5. Get select value of init selected
testPart(() => {
const select = document.createElement('select');
select.innerHTML = `
<option value="one">One</option>
<option value="two">Two</option>
<option value="three" selected>Three</option>
`;
return select.value;
});
});
</script>