percy-dom 0.10.1

A standalone Virtual DOM creation, diffing and patching implementation
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108

//! Verify that when we set the value attribute for an input or textarea element we also call
//! .set_value(value) on the element. Without this the `.value()` method on the element won't
//! return the new value.
//!
//! To run all tests in this file:
//! wasm-pack test --chrome --headless crates/percy-dom --test boolean_property

use wasm_bindgen_test::*;

use wasm_bindgen::JsCast;
use web_sys::*;

use percy_dom::event::VirtualEvents;
use percy_dom::{Patch, VirtualNode};
use std::collections::HashMap;
use virtual_node::{AttributeValue, VElement};

wasm_bindgen_test_configure!(run_in_browser);

/// Verify that we create a node with the attribute if the boolean property is true.
///
/// wasm-pack test --chrome --headless crates/percy-dom --test boolean_property -- create_elem_boolean_property_true
#[wasm_bindgen_test]
fn create_elem_boolean_property_true() {
    let mut elem = VElement::new("button");
    elem.attrs
        .insert("disabled".to_string(), AttributeValue::Bool(true));

    let node: VirtualNode = elem.into();
    let node = node.create_dom_node(&mut VirtualEvents::new()).0;
    assert!(node_as_button(&node).disabled());
}

/// Verify that we do not create a node with an attribute if the boolean property is false.
///
/// wasm-pack test --chrome --headless crates/percy-dom --test boolean_property -- create_elem_boolean_property_false
#[wasm_bindgen_test]
fn create_elem_boolean_property_false() {
    let mut elem = VElement::new("button");
    elem.attrs
        .insert("disabled".to_string(), AttributeValue::Bool(false));

    let node: VirtualNode = elem.into();
    let node = node.create_dom_node(&mut VirtualEvents::new()).0;
    assert!(!node_as_button(&node).disabled());
}

/// Verify that if we patch a node's boolean attribute to true it gets added.
///
/// wasm-pack test --chrome --headless crates/percy-dom --test boolean_property -- patch_elem_boolean_property_true
#[wasm_bindgen_test]
fn patch_elem_boolean_property_true() {
    let elem: VirtualNode = VElement::new("button").into();

    let mut events = VirtualEvents::new();
    let (node, events_node) = elem.create_dom_node(&mut events);
    events.set_root(events_node);

    let mut attributes = HashMap::new();
    let true_attribute = AttributeValue::Bool(true);
    attributes.insert("disabled", &true_attribute);
    let patch = Patch::AddAttributes(0, attributes);

    percy_dom::patch(
        node.clone(),
        &VirtualNode::element("..."),
        &mut events,
        &vec![patch],
    )
    .unwrap();

    assert!(node_as_button(&node).disabled());
}

/// Verify that if we patch a node's boolean attribute to false it gets removed.
///
/// wasm-pack test --chrome --headless crates/percy-dom --test boolean_property -- patch_elem_boolean_property_false
#[wasm_bindgen_test]
fn patch_elem_boolean_property_false() {
    let elem: VirtualNode = VElement::new("button").into();

    let mut events = VirtualEvents::new();
    let (node, events_node) = elem.create_dom_node(&mut events);
    events.set_root(events_node);

    node.dyn_ref::<HtmlButtonElement>()
        .unwrap()
        .set_disabled(true);
    assert!(node_as_button(&node).disabled());

    let mut attributes = HashMap::new();
    let false_attribute = AttributeValue::Bool(false);
    attributes.insert("disabled", &false_attribute);
    let patch = Patch::AddAttributes(0, attributes);
    percy_dom::patch(
        node.clone(),
        &VirtualNode::element(".."),
        &mut events,
        &vec![patch],
    )
    .unwrap();

    assert!(!node_as_button(&node).disabled());
}

fn node_as_button(elem: &Node) -> &HtmlButtonElement {
    elem.dyn_ref::<HtmlButtonElement>().unwrap()
}