forked from yewstack/yew
-
Notifications
You must be signed in to change notification settings - Fork 0
/
use_prepared_state.rs
115 lines (89 loc) · 3.96 KB
/
use_prepared_state.rs
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
109
110
111
112
113
114
115
#![cfg(target_arch = "wasm32")]
#![cfg(feature = "hydration")]
#![cfg_attr(nightly_yew, feature(async_closure))]
use std::time::Duration;
mod common;
use common::obtain_result_by_id;
use wasm_bindgen_test::*;
use yew::platform::time::sleep;
use yew::prelude::*;
use yew::{Renderer, ServerRenderer};
wasm_bindgen_test::wasm_bindgen_test_configure!(run_in_browser);
#[wasm_bindgen_test]
async fn use_prepared_state_works() {
#[function_component]
fn Comp() -> HtmlResult {
let ctr = use_prepared_state!(|_| -> u32 { 12345 }, ())?.unwrap_or_default();
Ok(html! {
<div>
{*ctr}
</div>
})
}
#[function_component]
fn App() -> Html {
html! {
<Suspense fallback={Html::default()}>
<div>
<Comp />
</div>
</Suspense>
}
}
let s = ServerRenderer::<App>::new().render().await;
assert_eq!(
s,
r#"<!--<[use_prepared_state::use_prepared_state_works::{{closure}}::App]>--><!--<[yew::suspense::component::feat_csr_ssr::Suspense]>--><!--<[yew::suspense::component::feat_csr_ssr::BaseSuspense]>--><!--<?>--><div><!--<[use_prepared_state::use_prepared_state_works::{{closure}}::Comp]>--><div>12345</div><script type="application/x-yew-comp-state">ATkwAAAB</script><!--</[use_prepared_state::use_prepared_state_works::{{closure}}::Comp]>--></div><!--</?>--><!--</[yew::suspense::component::feat_csr_ssr::BaseSuspense]>--><!--</[yew::suspense::component::feat_csr_ssr::Suspense]>--><!--</[use_prepared_state::use_prepared_state_works::{{closure}}::App]>-->"#
);
gloo::utils::document()
.query_selector("#output")
.unwrap()
.unwrap()
.set_inner_html(&s);
sleep(Duration::ZERO).await;
Renderer::<App>::with_root(gloo::utils::document().get_element_by_id("output").unwrap())
.hydrate();
sleep(Duration::from_millis(100)).await;
let result = obtain_result_by_id("output");
// no placeholders, hydration is successful and state 12345 is preserved.
assert_eq!(result, r#"<div><div>12345</div></div>"#);
}
#[wasm_bindgen_test]
async fn use_prepared_state_with_suspension_works() {
#[function_component]
fn Comp() -> HtmlResult {
let ctr = use_prepared_state!(async move |_| -> u32 { 12345 }, ())?.unwrap_or_default();
Ok(html! {
<div>
{*ctr}
</div>
})
}
#[function_component]
fn App() -> Html {
html! {
<Suspense fallback={Html::default()}>
<div>
<Comp />
</div>
</Suspense>
}
}
let s = ServerRenderer::<App>::new().render().await;
assert_eq!(
s,
r#"<!--<[use_prepared_state::use_prepared_state_with_suspension_works::{{closure}}::App]>--><!--<[yew::suspense::component::feat_csr_ssr::Suspense]>--><!--<[yew::suspense::component::feat_csr_ssr::BaseSuspense]>--><!--<?>--><div><!--<[use_prepared_state::use_prepared_state_with_suspension_works::{{closure}}::Comp]>--><div>12345</div><script type="application/x-yew-comp-state">ATkwAAAB</script><!--</[use_prepared_state::use_prepared_state_with_suspension_works::{{closure}}::Comp]>--></div><!--</?>--><!--</[yew::suspense::component::feat_csr_ssr::BaseSuspense]>--><!--</[yew::suspense::component::feat_csr_ssr::Suspense]>--><!--</[use_prepared_state::use_prepared_state_with_suspension_works::{{closure}}::App]>-->"#
);
gloo::utils::document()
.query_selector("#output")
.unwrap()
.unwrap()
.set_inner_html(&s);
sleep(Duration::ZERO).await;
Renderer::<App>::with_root(gloo::utils::document().get_element_by_id("output").unwrap())
.hydrate();
sleep(Duration::from_millis(100)).await;
let result = obtain_result_by_id("output");
// no placeholders, hydration is successful and state 12345 is preserved.
assert_eq!(result, r#"<div><div>12345</div></div>"#);
}