LibWeb: Prevent checkboxes from firing change events when losing focus

This is because toggling the checkbox is committing the value.
LadybirdBrowser · Nov 18, 2024 · 3856dd9 · 3856dd9
1 parent c898ee9
commit 3856dd9
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 0 deletions.
diff --git a/Libraries/LibWeb/HTML/HTMLInputElement.cpp b/Libraries/LibWeb/HTML/HTMLInputElement.cpp
@@ -637,6 +637,7 @@ void HTMLInputElement::commit_pending_changes()
     case TypeAttributeState::Telephone:
     case TypeAttributeState::Text:
     case TypeAttributeState::URL:
+    case TypeAttributeState::Checkbox:
         if (!m_has_uncommitted_changes)
             return;
         break;

diff --git a/Tests/LibWeb/Text/expected/checkbox-focus-lost-no-change-event.txt b/Tests/LibWeb/Text/expected/checkbox-focus-lost-no-change-event.txt
diff --git a/Tests/LibWeb/Text/input/checkbox-focus-lost-no-change-event.html b/Tests/LibWeb/Text/input/checkbox-focus-lost-no-change-event.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<input type="checkbox" id="checkbox">
+<script src="include.js"></script>
+<script>
+    checkbox.addEventListener("change", () => {
+      println("Change event was fired when it shouldn't have been.");
+    });
+    asyncTest(async done => {
+        checkbox.focus();
+        await new Promise(resolve => setTimeout(resolve, 0));
+        checkbox.blur();
+        await new Promise(resolve => setTimeout(resolve, 0));
+
+        done();
+    });
+</script>