feat: allow &str and String conversion for Option<Html> by Casheeew · Pull Request #4020 · yewstack/yew

Casheeew · 2026-02-28T08:07:28Z

Description

Add the following cases to impl_into_prop_value_via_display!:

- T → Option<VNode>
- &T → Option<VNode>
- Option<T> → Option<VNode>

Add the following cases to impl_into_prop_value_via_attr_value!:

- T → Option<VNode>
- Option<T> → Option<VNode>

This allows something like this to compile:

#[test]
    fn test_option_html_prop_compiles() {
        use crate::prelude::*;

        #[derive(PartialEq, Properties)]
        pub struct Props {
            pub title: Option<Html>,
        }

        #[component]
        fn Foo(props: &Props) -> Html {
            match &props.title {
                Some(title) => html! { <h1>{ title.clone() }</h1> },
                None => html! {},
            }
        }

        let _ = html! { <Foo title="Title" /> };

        let _ = html! { <Foo title={String::from("Title")} /> };

        let _ = html! { <Foo title={Some("Title")} /> };

        let _ = html! { <Foo title={Option::<Html>::None} /> };
    }

This is different from something like

// #[prop_or_default]
// title: Html
html! { <h1>{ props.title.clone() }</h1> }

because based on my understanding, #[prop_or_default] with no parameters passed still create h1 in the DOM but empty, whereas with Option<Html>

// <h1> is absent from the DOM entirely when title is None
if let Some(title) = &props.title {
    html! { <h1>{ title.clone() }</h1> }
}

Resolves #3449

Checklist

[V] I have reviewed my own code
[V] I have added tests

github-actions · 2026-02-28T08:09:05Z

Visit the preview URL for this PR (updated for commit 1c61b6e):

https://yew-rs-api--pr4020-allow-option-string-sjgkwf5h.web.app

_{(expires Tue, 10 Mar 2026 13:43:50 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

github-actions · 2026-02-28T08:09:36Z

Benchmark - core

Yew Master

vnode           fastest       │ slowest       │ median        │ mean          │ samples │ iters
╰─ vnode_clone  2.403 ns      │ 2.563 ns      │ 2.406 ns      │ 2.41 ns       │ 100     │ 1000000000

Pull Request

vnode           fastest       │ slowest       │ median        │ mean          │ samples │ iters
╰─ vnode_clone  2.404 ns      │ 3.656 ns      │ 2.407 ns      │ 2.434 ns      │ 100     │ 1000000000

github-actions · 2026-02-28T08:13:54Z

Size Comparison

Details

examples	master (KB)	pull request (KB)	diff (%)
async_clock	100.197	100.197	0.000%
boids	168.080	168.080	0.000%
communication_child_to_parent	93.472	93.472	0.000%
communication_grandchild_with_grandparent	105.248	105.248	0.000%
communication_grandparent_to_grandchild	101.609	101.609	0.000%
communication_parent_to_child	90.899	90.899	0.000%
contexts	105.151	105.151	0.000%
counter	86.282	86.282	0.000%
counter_functional	88.276	88.276	0.000%
dyn_create_destroy_apps	90.320	90.320	0.000%
file_upload	99.346	99.346	0.000%
function_delayed_input	94.374	94.374	0.000%
function_memory_game	172.943	172.943	0.000%
function_router	406.410	406.410	0.000%
function_todomvc	164.160	164.160	0.000%
futures	235.159	235.159	0.000%
game_of_life	104.718	104.718	0.000%
immutable	255.879	255.879	0.000%
inner_html	80.803	80.803	0.000%
js_callback	109.379	109.379	0.000%
keyed_list	179.728	179.728	0.000%
mount_point	84.146	84.146	0.000%
nested_list	113.059	113.059	0.000%
node_refs	91.526	91.526	0.000%
password_strength	1729.146	1729.146	0.000%
portals	93.034	93.034	0.000%
router	376.976	376.976	0.000%
suspense	113.464	113.464	0.000%
timer	88.634	88.634	0.000%
timer_functional	98.877	98.877	0.000%
todomvc	142.088	142.088	0.000%
two_apps	86.146	86.146	0.000%
web_worker_fib	136.239	136.239	0.000%
web_worker_prime	187.470	187.470	0.000%
webgl	83.224	83.224	0.000%

✅ None of the examples has changed their size significantly.

github-actions · 2026-02-28T08:26:03Z

Benchmark - SSR

Yew Master

Details

Benchmark	Round	Min (ms)	Max (ms)	Mean (ms)	Standard Deviation
Baseline	10	310.900	313.155	311.301	0.679
Hello World	10	486.922	509.145	493.183	7.241
Function Router	10	31942.208	32590.999	32197.611	217.603
Concurrent Task	10	1006.098	1007.881	1006.941	0.699
Many Providers	10	1092.713	1112.462	1101.355	6.444

Pull Request

Details

Benchmark	Round	Min (ms)	Max (ms)	Mean (ms)	Standard Deviation
Baseline	10	310.821	312.998	311.483	0.798
Hello World	10	468.487	492.773	476.435	7.803
Function Router	10	31465.050	31956.732	31749.681	154.181
Concurrent Task	10	1006.600	1007.853	1007.181	0.445
Many Providers	10	1111.247	1144.830	1121.760	12.503

Madoshakalaka · 2026-02-28T09:56:40Z

thanks!

can you fix the macro output comparison tests?
pass TRYBUILD=overwrite, git diff to make sure the compiler output changes are only cosmetic

Madoshakalaka · 2026-02-28T10:45:23Z

This is a breaking change because bare Nones won't compile any more for Option<Html> properties

#[derive(PartialEq, Properties)]
pub struct Props {
    pub title: Option<Html>,
}

// bare None without type annotation
let _ = html! { <Foo title={None} /> };

On master: html! { <Foo title={None} /> } compiles fine, None is inferred as Option<VNode> via the identity impl.
With the PR: it fails with

E0283: type annotations needed

because None is now ambiguous across dozens of Option<X> types that all implement IntoPropValue<Option<VNode>>
To make it compile, one will have pass Option::<Html>::None instead

For reference, we already have broken Option<String> and Option<AttrValue> props where bare Nones already don't work, see #3747

This PR will make it "uniformly broken" for all three.

html! { <Foo title={Option::<Html>::None} /> } imo is a horrible pattern nobody wants to write. I will pause merging this and think of a fix first. I have some ideas.

@ctron do you have any opinions?

Casheeew · 2026-02-28T10:57:14Z

The easiest way is to use the #[prop_or_default] directive for
pub title: Option.

This way, if you just leave out the prop:

<Foo />, you get None for title and you can do stuff with the value.

Otherwise, since you're not designating #[prop_or_default], there is an argument that you should be passing everything explicitly anyway, so Option::<Html>::None is not that bad, but ymmw

Casheeew · 2026-03-02T20:22:26Z

@Madoshakalaka I dont have the 1.84 Rust can you run the trybuild command for me pwetty pwease

Madoshakalaka · 2026-03-03T13:44:14Z

I don't see any anomaly. will merge when CI passes.

Madoshakalaka

solid

Madoshakalaka added A-yew Area: The main yew crate breaking change labels Feb 28, 2026

Madoshakalaka added the blocked label Feb 28, 2026

Madoshakalaka mentioned this pull request Feb 28, 2026

fix: allow bare None for Option props in html! macro #4021

Merged

2 tasks

Madoshakalaka removed blocked breaking change labels Mar 2, 2026

feat: allow &str and String conversion for Option<Html>

318392c

Casheeew force-pushed the allow-option-string-conversions branch from d247e3b to 318392c Compare March 2, 2026 16:12

chore: update trybuild stderr snapshots

1c61b6e

Madoshakalaka approved these changes Mar 3, 2026

View reviewed changes

Madoshakalaka merged commit 815dff6 into yewstack:master Mar 3, 2026
25 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: allow &str and String conversion for Option<Html>#4020

feat: allow &str and String conversion for Option<Html>#4020
Madoshakalaka merged 2 commits intoyewstack:masterfrom
Casheeew:allow-option-string-conversions

Casheeew commented Feb 28, 2026

Uh oh!

github-actions Bot commented Feb 28, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Feb 28, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Feb 28, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Feb 28, 2026 •

edited

Loading

Uh oh!

Madoshakalaka commented Feb 28, 2026

Uh oh!

Madoshakalaka commented Feb 28, 2026 •

edited

Loading

Uh oh!

Casheeew commented Feb 28, 2026 •

edited

Loading

Uh oh!

Casheeew commented Mar 2, 2026

Uh oh!

Madoshakalaka commented Mar 3, 2026

Uh oh!

Madoshakalaka left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

Casheeew commented Feb 28, 2026

Description

Checklist

Uh oh!

github-actions Bot commented Feb 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Feb 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Benchmark - core

Yew Master

Pull Request

Uh oh!

github-actions Bot commented Feb 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Size Comparison

Uh oh!

github-actions Bot commented Feb 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Benchmark - SSR

Yew Master

Pull Request

Uh oh!

Madoshakalaka commented Feb 28, 2026

Uh oh!

Madoshakalaka commented Feb 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Casheeew commented Feb 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Casheeew commented Mar 2, 2026

Uh oh!

Madoshakalaka commented Mar 3, 2026

Uh oh!

Madoshakalaka left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

github-actions Bot commented Feb 28, 2026 •

edited

Loading

github-actions Bot commented Feb 28, 2026 •

edited

Loading

github-actions Bot commented Feb 28, 2026 •

edited

Loading

github-actions Bot commented Feb 28, 2026 •

edited

Loading

Madoshakalaka commented Feb 28, 2026 •

edited

Loading

Casheeew commented Feb 28, 2026 •

edited

Loading