feat: add more element queries tests

Author: DanielleHuisman

packages/dom/tests/element_queries.rs

@@ -1,15 +1,20 @@
-#![cfg(target_arch = "wasm32")]
+// TODO: Enable `cfg`, disable `expect`.
+// #![cfg(target_arch = "wasm32")]
+#![expect(dead_code)]
 
 mod helpers;
 
 use std::sync::{Arc, LazyLock, Mutex};
 
 use indoc::indoc;
+use regex::Regex;
 use testing_library_dom::{
     ConfigFnOrPartial, MatcherOptions, PartialConfig, QueryError, SelectorMatcherOptions, configure,
 };
 use wasm_bindgen_test::{wasm_bindgen_test, wasm_bindgen_test_configure};
 
+use crate::helpers::test_utils::document;
+
 use self::helpers::test_utils::{RenderReturn, render};
 
 wasm_bindgen_test_configure!(run_in_browser);
@@ -231,3 +236,290 @@ fn get_throws_a_useful_error_message() -> Result<(), QueryError> {
 
     Ok(())
 }
+
+#[wasm_bindgen_test]
+fn can_get_elements_by_matching_their_text_content() {
+    let RenderReturn {
+        container_queries, ..
+    } = render(
+        indoc! {"
+          <div>
+            <span>Currently showing</span>
+            <span>
+              Step
+              1
+                of 4
+            </span>
+          </div>
+        "},
+        None,
+    );
+
+    assert!(
+        container_queries
+            .query_by_text("Currently showing", SelectorMatcherOptions::default())
+            .ok()
+            .is_some()
+    );
+    assert!(
+        container_queries
+            .query_by_text("Step 1 of 4", SelectorMatcherOptions::default())
+            .ok()
+            .is_some()
+    );
+}
+
+#[wasm_bindgen_test]
+fn can_get_elements_by_matching_their_text_across_adjacent_text_nodes() {
+    let document = document();
+
+    let text_div = document
+        .create_element("div")
+        .expect("Element should be created.");
+    let text_node_content = ["£", "24", ".", "99"];
+
+    for text in text_node_content {
+        let text_node = document.create_text_node(text);
+        text_div
+            .append_child(&text_node)
+            .expect("Child should be appended.");
+    }
+
+    let RenderReturn {
+        container,
+        container_queries,
+        ..
+    } = render("<div />", None);
+
+    container
+        .append_child(&text_div)
+        .expect("Child should be appended.");
+
+    assert!(
+        container_queries
+            .query_by_text("£24.99", SelectorMatcherOptions::default())
+            .ok()
+            .is_some()
+    );
+}
+
+#[wasm_bindgen_test]
+fn can_get_input_elements_with_type_submit_or_button_or_reset() {
+    let RenderReturn {
+        container_queries, ..
+    } = render(
+        indoc! {"
+          <div>
+            <input type=\"submit\" value=\"Send data\"/>
+            <input type=\"reset\" value=\"Clear EVERYTHING\"/>
+            <input type=\"button\" value=\"Push me!\"/>
+            <input type=\"text\" value=\"user data\" />
+          </div>
+        "},
+        None,
+    );
+
+    assert!(
+        container_queries
+            .query_by_text("Send data", SelectorMatcherOptions::default())
+            .expect("Query should succeed.")
+            .is_some()
+    );
+    assert!(
+        container_queries
+            .query_by_text("Clear EVERYTHING", SelectorMatcherOptions::default())
+            .expect("Query should succeed.")
+            .is_some()
+    );
+    assert!(
+        container_queries
+            .query_by_text("Push me!", SelectorMatcherOptions::default())
+            .expect("Query should succeed.")
+            .is_some()
+    );
+    assert!(
+        container_queries
+            .query_by_text("user data", SelectorMatcherOptions::default())
+            .expect("Query should succeed.")
+            .is_none()
+    );
+}
+
+#[wasm_bindgen_test]
+fn matches_case_with_regexp_matcher() {
+    let RenderReturn {
+        container_queries, ..
+    } = render("<span>STEP 1 of 4</span>", None);
+
+    assert!(
+        container_queries
+            .query_by_text(
+                Regex::new("STEP 1 of 4").expect("Regex should be valid."),
+                SelectorMatcherOptions::default()
+            )
+            .expect("Query should succeed.")
+            .is_some()
+    );
+    assert!(
+        container_queries
+            .query_by_text(
+                Regex::new("Step 1 of 4").expect("Regex should be valid."),
+                SelectorMatcherOptions::default()
+            )
+            .expect("Query should succeed.")
+            .is_none()
+    );
+}
+
+#[wasm_bindgen_test]
+fn query_by_text_matches_case_with_non_string_matcher() {
+    let RenderReturn {
+        container_queries, ..
+    } = render("<span>1</span>", None);
+
+    assert!(
+        container_queries
+            .query_by_text(1_f64, SelectorMatcherOptions::default())
+            .expect("Query should succeed.")
+            .is_some()
+    );
+}
+
+#[ignore = "TODO: Fix failing test."]
+#[wasm_bindgen_test]
+fn can_get_form_controls_by_label_text() {
+    let RenderReturn {
+        container_queries, ..
+    } = render(
+        indoc! {"
+        <div>
+          <label>
+            1st<input id=\"first-id\" />
+          </label>
+          <div>
+            <label for=\"second-id\">2nd</label>
+            <input id=\"second-id\" />
+          </div>
+          <div>
+            <label id=\"third-label\">3rd</label>
+            <input aria-labelledby=\"third-label\" id=\"third-id\" />
+          </div>
+          <div>
+            <label for=\"fourth.id\">4th</label>
+            <input id=\"fourth.id\" />
+          </div>
+          <div>
+          <div>
+            <label id=\"fifth-label-one\">5th one</label>
+            <label id=\"fifth-label-two\">5th two</label>
+            <input aria-labelledby=\"fifth-label-one fifth-label-two\" id=\"fifth-id\" />
+          </div>
+          <div>
+            <input id=\"sixth-label-one\" value=\"6th one\"/>
+            <input id=\"sixth-label-two\" value=\"6th two\"/>
+            <label id=\"sixth-label-three\">6th three</label>
+            <input aria-labelledby=\"sixth-label-one sixth-label-two sixth-label-three\" id=\"sixth-id\" />
+          </div>
+          <div>
+            <span id=\"seventh-label-one\">7th one</span>
+            <input aria-labelledby=\"seventh-label-one\" id=\"seventh-id\" />
+          </div>
+          <div>
+            <label id=\"eighth.label\">8th one</label>
+            <input aria-labelledby=\"eighth.label\" id=\"eighth.id\" />
+          </div>
+        </div>
+      "},
+        None,
+    );
+
+    assert_eq!(
+        container_queries
+            .get_by_label_text("1st", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("first-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("2nd", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("second-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("3rd", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("third-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("4th", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("fourth-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("5th one", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("fifth-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("5th two", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("fifth-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("6th one", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("sixth-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("6th two", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("sixth-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("6th one 6th two", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("sixth-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text(
+                "6th one 6th two 6th three",
+                SelectorMatcherOptions::default()
+            )
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("sixth-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("7th one", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("seventh-id".to_owned())
+    );
+    assert_eq!(
+        container_queries
+            .get_by_label_text("8th one", SelectorMatcherOptions::default())
+            .expect("Get should succeed.")
+            .map(|element| element.id()),
+        Some("eighth.id".to_owned())
+    );
+}
+
+// TODO: More tests.