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

//! Tests that ensure that we create the right DOM element from a VirtualNode
//!
//! To run all tests in this file:
//!
//! wasm-pack test --chrome --headless crates/percy-dom --test create_dom_node

extern crate wasm_bindgen_test;
extern crate web_sys;
use percy_dom::event::VirtualEvents;
use wasm_bindgen::JsCast;
use wasm_bindgen_test::*;
use web_sys::Element;

use percy_dom::prelude::*;

wasm_bindgen_test_configure!(run_in_browser);

/// wasm-pack test --chrome --headless crates/percy-dom --test create_dom_node -- nested_divs
#[wasm_bindgen_test]
fn nested_divs() {
    let vdiv = html! { <div> <div> <div></div> </div> </div> };
    let div: Element = vdiv
        .create_dom_node(&mut VirtualEvents::new())
        .0
        .unchecked_into();

    assert_eq!(&div.inner_html(), "<div><div></div></div>");
}

// wasm-pack test --chrome --headless crates/percy-dom --test create_dom_node -- svg_element
#[wasm_bindgen_test]
fn svg_element() {
    let vdiv = html! { <div><svg xmlns="http://www.w3.org/2000/svg">
      <circle cx="50" cy="60" r="70"/>
    </svg></div> };
    let div: Element = vdiv
        .create_dom_node(&mut VirtualEvents::new())
        .0
        .unchecked_into();

    assert_eq!(
        &div.inner_html(),
        r#"<svg xmlns="http://www.w3.org/2000/svg"><circle cy="60" r="70" cx="50"></circle></svg>"#
    );
}

/// wasm-pack test --chrome --headless crates/percy-dom --test create_dom_node -- div_with_attributes
#[wasm_bindgen_test]
fn div_with_attributes() {
    let vdiv = html! { <div id="id-here" class="two classes"></div> };
    let div: Element = vdiv
        .create_dom_node(&mut VirtualEvents::new())
        .0
        .unchecked_into();

    assert_eq!(&div.id(), "id-here");

    assert!(div.class_list().contains("two"));
    assert!(div.class_list().contains("classes"));

    assert_eq!(div.class_list().length(), 2);
}