Fix TODOs in web-sys tests (#3449)

Author: lukaslihotzki

crates/web-sys/tests/wasm/button_element.rs

@@ -1,6 +1,6 @@
 use wasm_bindgen::prelude::*;
 use wasm_bindgen_test::*;
-use web_sys::{HtmlButtonElement, HtmlFormElement, Node};
+use web_sys::{HtmlButtonElement, HtmlFormElement};
 
 #[wasm_bindgen(module = "/tests/wasm/element.js")]
 extern "C" {
@@ -99,15 +99,9 @@ fn test_button_element_in_form() {
     let form = new_form();
     form.set_name("test-form");
 
-    // TODO: implement `Clone` for types in `web_sys` to make this easier.
-    let button = JsValue::from(button);
-    let as_node = Node::from(button.clone());
-    Node::from(JsValue::from(form))
-        .append_child(&as_node)
-        .unwrap();
+    form.append_child(&button).unwrap();
 
-    let element = HtmlButtonElement::from(button);
-    match element.form() {
+    match button.form() {
         None => assert!(false, "Should have a form"),
         Some(form) => {
             assert!(true, "Should have a form");
@@ -118,5 +112,5 @@ fn test_button_element_in_form() {
             );
         }
     };
-    assert_eq!(element.type_(), "reset", "Should have a type");
+    assert_eq!(button.type_(), "reset", "Should have a type");
 }

crates/web-sys/tests/wasm/element.js

@@ -116,6 +116,7 @@ export function new_select_with_food_opts() {
 
   for(let i = 0; i < opts.length; i++) {
       let opt = document.createElement("option");
+      opt.id = opts[i];
       opt.value = opts[i];
       opt.text = opts[i];
       select.appendChild(opt);

crates/web-sys/tests/wasm/element.rs

@@ -57,14 +57,26 @@ fn element() {
     get_attribute_ns
     */
 
-    /*TODO should we enable toggle_attribute tests? (Firefox Nightly + Chrome canary only)
-        // TODO toggle_attribute should permit a single argument when optional arguments are supported
-        assert!(!element.has_attribute("disabled"), "Should not be disabled");
-        assert!(element.toggle_attribute("disabled", true).unwrap(), "Should return true when attribute is set");
-        assert!(element.has_attribute("disabled"), "Should be disabled");
-        assert!(!element.toggle_attribute("disabled", false).unwrap(), "Should return false when attribute is not set");
-        assert!(!element.has_attribute("disabled"), "Should not be disabled");
-    */
+    assert!(!element.has_attribute("disabled"), "Should not be disabled");
+    assert!(
+        element.toggle_attribute("disabled").unwrap(),
+        "Should return true when attribute is set"
+    );
+    assert!(element.has_attribute("disabled"), "Should be disabled");
+    assert!(
+        element
+            .toggle_attribute_with_force("disabled", true)
+            .unwrap(),
+        "Should return true when attribute is set"
+    );
+    assert!(element.has_attribute("disabled"), "Should be disabled");
+    assert!(
+        !element
+            .toggle_attribute_with_force("disabled", false)
+            .unwrap(),
+        "Should return false when attribute is not set"
+    );
+    assert!(!element.has_attribute("disabled"), "Should not be disabled");
 
     assert!(!element.has_attribute("title"), "Should not have a title");
     assert_eq!(
@@ -73,7 +85,11 @@ fn element() {
         "Should return nothing if set correctly"
     );
     assert!(element.has_attribute("title"), "Should have a title");
-    // TODO check get_attribute here when supported
+    assert_eq!(
+        element.get_attribute("title").unwrap(),
+        "boop",
+        "Title should be 'boop'"
+    );
     assert_eq!(
         element.remove_attribute("title").unwrap(),
         (),
@@ -129,8 +145,6 @@ fn element() {
         "Should return nothing if removed"
     );
 
-    // TODO non standard moz_matches_selector should we even support?
-
     /* Tests needed for:
     insert_adjacent_element
     insert_adjacent_text

crates/web-sys/tests/wasm/html_element.rs

@@ -121,10 +121,10 @@ fn test_html_element() {
     );
     assert!(element.is_content_editable(), "Should be content_editable");
 
-    // TODO: This test is also broken in Chrome (but not Firefox).
-    // assert!(!element.spellcheck(), "Shouldn't be spellchecked");
+    element.set_spellcheck(false);
+    assert!(!element.spellcheck(), "Shouldn't be spellchecked");
     element.set_spellcheck(true);
-    assert!(element.spellcheck(), "Should be dragspellcheckedgable");
+    assert!(element.spellcheck(), "Should be spellchecked");
 
     // TODO verify case where we have an offset_parent
     match element.offset_parent() {

crates/web-sys/tests/wasm/input_element.rs

@@ -40,11 +40,9 @@ fn test_input_element() {
     element.set_default_checked(true);
     assert!(element.default_checked(), "Should have an default_checked");
 
-    /*TODO fix
-        assert!(!element.checked(), "Shouldn't be checked");
-        element.set_checked(true);
-        assert!(element.checked(), "Should be checked");
-    */
+    assert!(element.checked(), "Should be checked");
+    element.set_checked(false);
+    assert!(!element.checked(), "Shouldn't be checked");
 
     assert!(!element.disabled(), "Shouldn't be disabled");
     element.set_disabled(true);
@@ -93,14 +91,18 @@ fn test_input_element() {
 
     assert_eq!(element.height(), 0, "Should have no height");
     element.set_height(12);
-    assert_eq!(element.height(), 0, "Should have no height"); // Doesn't change, TODO check with get_attribute("height")=="12"
+    assert_eq!(element.height(), 0, "Should have no height");
+    assert_eq!(
+        element.get_attribute("height").unwrap(),
+        "12",
+        "The height attribute should be 12"
+    );
 
-    /*TODO fails in chrome
     element.set_type("checkbox");
+    element.set_indeterminate(true);
     assert!(element.indeterminate(), "Should be indeterminate");
-    element.set_checked(true);
+    element.set_indeterminate(false);
     assert!(!element.indeterminate(), "Shouldn't be indeterminate");
-    */
     /*TODO add tests
     pub fn indeterminate(&self) -> bool
     pub fn set_indeterminate(&self, indeterminate: bool)
@@ -144,12 +146,11 @@ fn test_input_element() {
     pub fn size(&self) -> u32
     pub fn set_size(&self, size: u32)
     */
-    /*TODO fails in chrome
-        element.set_type("image");
-        assert_eq!(element.src(), "", "Should have no src");
-        element.set_value("hey.png");
-        assert_eq!(element.src(), "hey.png", "Should have a src");
-    */
+    element.set_type("image");
+    assert_eq!(element.src(), "", "Should have no src");
+    const EMPTY_IMAGE: &str = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'/%3E";
+    element.set_src(EMPTY_IMAGE);
+    assert_eq!(element.src(), EMPTY_IMAGE, "Should have a src");
     /*TODO add tests
     pub fn src(&self) -> String
     pub fn set_src(&self, src: &str)
@@ -160,11 +161,9 @@ fn test_input_element() {
     pub fn default_value(&self) -> String
     pub fn set_default_value(&self, default_value: &str)
     */
-    /*TODO fails in chrome
-        assert_eq!(element.value(), "", "Should have no value");
-        element.set_value("hey!");
-        assert_eq!(element.value(), "hey!", "Should have a value");
-    */
+    assert_eq!(element.value(), "", "Should have no value");
+    element.set_value("hey!");
+    assert_eq!(element.value(), "hey!", "Should have a value");
     element.set_type("number");
     element.set_value("1");
     assert_eq!(element.value_as_number(), 1.0, "Should have value 1");
@@ -173,7 +172,12 @@ fn test_input_element() {
 
     assert_eq!(element.width(), 0, "Should have no width");
     element.set_width(12);
-    assert_eq!(element.width(), 0, "Should have no width"); // Doesn't change, TODO check with get_attribute("width")=="12"
+    assert_eq!(element.width(), 0, "Should have no width");
+    assert_eq!(
+        element.get_attribute("width").unwrap(),
+        "12",
+        "The width attribute should be 12"
+    );
 
     assert_eq!(element.will_validate(), false, "Shouldn't validate");
     assert_eq!(

crates/web-sys/tests/wasm/output_element.rs

@@ -42,8 +42,10 @@ fn test_output_element() {
     output.set_value("49");
     assert_eq!(output.value(), "49", "Output value should be '49'.");
 
-    // TODO: Fails in Chrome, but not in Firefox.
-    //assert!(output.will_validate(), "Output should validate by default (maybe browser dependent?)");
+    assert!(
+        !output.will_validate(),
+        "Output is not a submittable element, so willValidate must be false"
+    );
 
     assert!(
         output.validity().valid(),

crates/web-sys/tests/wasm/select_element.rs

@@ -26,9 +26,12 @@ fn test_select_element() {
         "Select element should have a false autofocus property."
     );
 
-    //    TODO: This test currently fails on Firefox, but not Chrome.  In Firefox, even though we select.set_autocomplete(), select.autocomplete() yields an empty String.
-    //    select.set_autocomplete("tomato");
-    //    assert_eq!(select.autocomplete(), "tomato", "Select element should have a 'tomato' autocomplete property.");
+    select.set_autocomplete("country");
+    assert_eq!(
+        select.autocomplete(),
+        "country",
+        "Select element should have a 'country' autocomplete property."
+    );
 
     select.set_disabled(true);
     assert_eq!(
@@ -173,9 +176,13 @@ fn test_select_element() {
         "There should be no labels associated with our select element."
     );
 
-    // TODO: This test won't work until this bug is fixed: https://www.w3.org/Bugs/Public/show_bug.cgi?id=20720.  Sometime in the future, either remove this test or uncomment after bug is fixed.
-    // assert!(select.named_item("tomato").is_some(), "Should be able to find the 'tomato' option before removing it.");
-    // select.remove(0);
-    // assert!(select.named_item("tomato").is_none(), "Shouldn't be able to find the 'tomato' option after removing it.")
-    // TODO: As a result, we are missing a test for the remove() method.
+    assert!(
+        select.named_item("tomato").is_some(),
+        "Should be able to find the 'tomato' option before removing it."
+    );
+    select.remove_with_index(0);
+    assert!(
+        select.named_item("tomato").is_none(),
+        "Shouldn't be able to find the 'tomato' option after removing it."
+    );
 }

crates/web-sys/tests/wasm/slot_element.rs

@@ -9,8 +9,11 @@ extern "C" {
 
 #[wasm_bindgen_test]
 fn test_slot_element() {
-    let _slot = new_slot();
-    // TODO: Test fails in Firefox, but not in Chrome.  Error in Firefox is 'ReferenceError: HTMLSlotElement is not defined'.  https://w3c-test.org/shadow-dom/HTMLSlotElement-interface.html
-    // slot.set_name("root_separator");
-    // assert_eq!(slot.name(), "root_separator", "Slot name should 'root_separator'.");
+    let slot = new_slot();
+    slot.set_name("root_separator");
+    assert_eq!(
+        slot.name(),
+        "root_separator",
+        "Slot name should 'root_separator'."
+    );
 }