bounce 0.9.0

The uncomplicated state management library for Yew.
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

use std::rc::Rc;
use std::time::Duration;

use wasm_bindgen_test::{wasm_bindgen_test as test, wasm_bindgen_test_configure};

wasm_bindgen_test_configure!(run_in_browser);

use bounce::prelude::*;
use bounce::BounceRoot;
use gloo::timers::future::sleep;
use gloo::utils::document;
use yew::prelude::*;

async fn get_text_content<S: AsRef<str>>(selector: S) -> String {
    sleep(Duration::ZERO).await;

    document()
        .query_selector(selector.as_ref())
        .unwrap()
        .unwrap()
        .text_content()
        .unwrap()
}

#[test]
async fn test_notion_generic() {
    #[derive(Atom, PartialEq, Default)]
    #[bounce(with_notion(State<T>))]
    struct State<T>
    where
        T: PartialEq + Default + 'static,
    {
        inner: T,
    }

    impl<T> WithNotion<State<T>> for State<T>
    where
        T: PartialEq + Default + 'static,
    {
        fn apply(self: Rc<Self>, notion: Rc<State<T>>) -> Rc<Self> {
            notion
        }
    }

    #[function_component(Comp)]
    fn comp() -> Html {
        let a = use_atom::<State<u32>>();
        let b = use_atom::<State<u64>>();

        {
            let a = a.clone();
            let b = b.clone();
            use_effect_with((), move |_| {
                a.set(State { inner: 1 });
                b.set(State { inner: 2 });

                || {}
            });
        }

        html! {
            <div>
                <div id="a">{a.inner}</div>
                <div id="b">{b.inner}</div>
            </div>
        }
    }

    #[function_component(Root)]
    fn root() -> Html {
        html! {
            <BounceRoot>
                <Comp />
            </BounceRoot>
        }
    }

    yew::Renderer::<Root>::with_root(document().query_selector("#output").unwrap().unwrap())
        .render();

    let s = get_text_content("#a").await;
    assert_eq!(s, "1");

    let s = get_text_content("#b").await;
    assert_eq!(s, "2");
}