yewstack / yewstack/yew

Error message when an HTML attribute has incorrect case is unhelpful

Open
#3,996 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Rust
Stars
32.8k
Forks
1.5k
Avg merge
5h 34m
Merged PRs (30d)
2

Description

Problem
Imagine an HTML attribute is given incorrect case. Although in a web browser the attribute will be case-normalized and matched to the correct string, in yew this can produce not only an error but an unhelpful error which leads away from a solution.

Steps To Reproduce

Check out https://codeberg.org/mcc/rs-bug/src/branch/why-yew-no-compile

Run (cd client && trunk build --release)

This renders a <form> with an onSubmit= attribute with a Callback. This is incorrect (it's "onsubmit", no caps). But I didn't know that¹.

Expected behavior

Either of:

  1. The HTML standard says² "all attribute names on HTML elements in HTML documents get ASCII-lowercased automatically". All HTML attributes (including data- attributes; see link) are name-lowercased by definition and the browser normalizes to lowercase when interpreting documents. Therefore, Yew should do what the browser³ does and normalize attribute names to lowercase. "onSubmit=" in a Yew html! should be treated as "onsubmit=".
  2. Because it's not possible for there to be an attribute which is the same as a defined attribute but with different case, Yew should detect onSubmit case-collides with onsubmit and issue a specific warning "you have misspelled onsubmit=".

Observed behavior

error[E0277]: the trait bound `Callback<Event>: IntoPropValue<...>` is not satisfied
  --> client/src/main.rs:31:29
   |
31 |                   onSubmit={on_submit}
   |                             ^^^^^^^^^ unsatisfied trait bound
   |
   = help: the trait `IntoPropValue<Option<implicit_clone::unsync::string::IString>>` is not implemented for `yew::Callback<Event>`
   = help: the following other types implement trait `IntoPropValue<T>`:
             `&'static [(K, V)]` implements `IntoPropValue<implicit_clone::unsync::map::IMap<K, V>>`
             `&'static [T]` implements `IntoPropValue<implicit_clone::unsync::array::IArray<T>>`
             `&'static str` implements `IntoPropValue<Classes>`
             `&'static str` implements `IntoPropValue<Option<String>>`
             `&'static str` implements `IntoPropValue<Option<implicit_clone::unsync::string::IString>>`
             `&'static str` implements `IntoPropValue<String>`
             `&'static str` implements `IntoPropValue<implicit_clone::unsync::string::IString>`
             `&ChildrenRenderer<VNode>` implements `IntoPropValue<VNode>`
           and 62 others
   = note: the full name for the type has been written to '/home/mcc/work/r/ynot/target/wasm32-unknown-unknown/release/deps/fedichat_client-9c7418ab9ecea3a3.long-type-3825124899325781131.txt'
   = note: consider using `--verbose` to print the full type name to the console

For more information about this error, try `rustc --explain E0277`.
error: could not compile `fedichat-client` (bin "fedichat-client") due to 1 previous error

To a new Yew user, this is very confusing. What it means is:

  • Because "onSubmit" does not match "onsubmit", Yew assumes you want an unknown/custom attribute named "onSubmit".
  • By default, an attribute unknown to Yew has type string, but I passed in a callback.
  • "string" isn't "string" but rather a complicated trait situation, so you don't get a simple error like "string expected"

I wasn't able to figure out this error without help.

Environment:

  • Yew version: 0.22.0
  • Rust version: rustc 1.90.0 (1159e78c4 2025-09-14)
  • Target / Build tool: trunk 0.21.14
  • OS, if relevant: Debian 13

¹ Apparently I have been capitalizing JavaScript event handlers incorrectly for the last ~28 years.
² This is a "note", I haven't found where the underlying rule is documented.
³ Also React/Preact, I've tested this

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the failure with (cd client && trunk build --release) using the linked html! example and inspect Yew's attribute handling. Determine whether the intended fix is lowercase normalization or a targeted case-collision diagnostic, then add coverage showing that onSubmit produces the expected behavior or warning instead of the confusing trait error.

Written by the indexing model from the issue text.

Assessment

Tech stack
rust
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.