How to use web-components in YEW?


It is possible to use tag names in YEW like:

html! {
         <pdd> {"foo"} </pdd>
         <pd_d> {"foo"} </pd_d>

But tag names with - in them will not work. If I try to use them I get:

error: no rules expected the token `vtag`
   --> src/
182 | /         html! {
183 | |                 <pd-d> {"jkjlkj"} </pd-d>
185 | |                 <input
...   |
198 | |             </div>
199 | |         }
    | |_________^
    = note: this error originates in a macro outside of the current crate (in Nightly builds, run with -Z external-macro-backtrace for more info)

I need tag names with dashes (-) in them to use webcomponents. Is there a way to escape them? Or get the dashes in them?


Looking at the definition of the html! macro, it seems to read tag names as if they were Rust identifiers. A hyphen is not a valid character in that context, which would explain why you’re getting an error. I don’t know if this can be worked around without changing the macro itself - maybe submit an issue/PR to Yew?

EDIT: It looks like someone already has, in fact.