DioxusLabs / DioxusLabs/dioxus

RSX `style` element causes runtime error while style attribute works correctly

Open
#4,068 5 comments 0 reactions 0 assignees View on GitHub
bug needs reproduction
Dominant language
Rust
Stars
39.1k
Forks
1.9k
Avg merge
4d 10h
Merged PRs (30d)
4

Description

## Description:

When using the `style` element inside the `rsx!` macro, I encounter a JavaScript Runtime error. However, using the `style` attribute as a property works correctly.

### Error Message:

```bash
wasm-bindgen: imported JS function that was not marked as `catch` threw an error: this.nodes[this.u32buf[(tonumeric this.u32bufp)]] is undefined
31794e2e3877eb2e
3
```

### Stack trace:

```bash
run/assets/demo-c.js:1:12254
wbg_get_imports/imports.wbg.wbg_run_b869ac02fd3748d0/::flush_edits::h8ec79c47a98ec56e/assets/demo_bg-3.wasm:wasm-function[20148]:0x5cd61e
demo-hash.wasm.dioxus_web::launch::launch_virtual_dom::{{closure}}::h2fa00bebb753cda7/assets/demo_bg-3.wasm:wasm-function[942]:0x23253b
demo-hash.wasm.wasm_bindgen_futures::queue::Queue::new::{{closure}}::h93d11af5dd32ab5a/assets/demo_bg-3.wasm:wasm-function[3995]:0x4098b1
demo-hash.wasm.+Output = R as wasm_bindgen::closure::WasmClosure>::describe::invoke::h97ba987db8c8ad16/assets/demo_bg-3.wasm:wasm-function[15705]:0x5b4cb4
demo-hash.wasm.closure5492 externref shim/assets/demo_bg-3.wasm:wasm-function[17584]:0x5c12a5
wbg_adapter_72/assets/demo-c.js:5:1535
real/assets/demo-c.js:4:2418
demo-c.js:1:19718
Uncaught TypeError: this.nodes[this.u32buf[(tonumeric this.u32bufp)]] is undefined
run /assets/demo-c.js:1
wbg_run_b869ac02fd3748d0 /assets/demo-c.js:5
logError /assets/demo-c.js:1
wbg_run_b869ac02fd3748d0 /assets/demo-c.js:5
__wbg_adapter_72 /assets/demo-c.js:5
real /assets/demo-c.js:4
demo-c.js:1:12254
```

### Problematic code:

```rust
rsx! {
div { id: "theme-preview-container",
style { "{css_variables}" }
main { id: "scoped-theme", {content} }
}
}
```

### Working Alternative:

```rust
rsx! {
div { id: "theme-preview-container", style: "{css_variables()}",
main { id: "theme-previewer", {content} }
}
}
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.