search

yewstack / yew

Rust / Wasm framework for creating reliable and efficient web applications
https://yew.rs
Apache License 2.0
30.53k stars 1.42k forks source link

Dynamic tag <@{"input"} /> renders as <textarea> #3239

Closed SirAlador closed 1 year ago

SirAlador commented 1 year ago

Problem The dynamic tag <@{"input"} /> renders as <textarea> in the actual DOM.

Code for dynamic tag <@{"input"} />

Code for literal tag <input />

Steps To Reproduce Steps to reproduce the behavior:

  1. Create a new project with cargo new yew_input_test

  2. Setup the project with the following files:

    • Cargo.toml: 
      
name = "yew_input_test"
version = "0.1.0"
edition = "2021"

    [dependencies] yew = { version = "0.20.0", features = ["csr"] }

    - index.html:
```html
<!DOCTYPE html>
<html>
  <head>
    <style>
      input { background-color: green; }
      textarea { background-color: red; }
    </style>
  </head>
  <body>
  </body>
</html>
    • src/main.rs 
      
use yew::prelude::*;

    fn main() { yew::Renderer::::new().render(); }

    [function_component(Root)]

    fn root() -> Html { html! {

    {"Input: "}
    {"Also input (but not): "} <@{"input"} />

    } }

  3. Serve the project with trunk serve
  4. Open the project in a web browser, and observe with Inspect Element that the second input is actually a textarea.

Expected behavior Both input elements are rendered as input elements.

Environment:

Questionnaire

futursolo commented 1 year ago

Since you have figured out where the issue is, would you mind filing a PR to fix it?

SirAlador commented 1 year ago

Sure! I'll get that taken care of this weekend.

XuShaohua commented 1 year ago

Hi, I've run into the same problem. Please help review the PR.