Some links to not navigate on click (href is valid)
dsgallups opened this issue · 1 comments
Some of the left nav links do not navigate on click using the provided link. However, the anchor links themselves do navigate to existent pages.
Of the following, the following sections fail to navigate:
- All of
Getting Started
links Guide->Your First Component
Other links under Guide
navigate correctly.
Host Properties
- Link: https://dioxuslabs.com/learn/0.5/getting_started/liveview/
- Browsers: Chrome (stable), Firefox (stable)
Possible explanation
I believe that the appended data-dioxus-id
is causing the unclickable link behavior. Elements with this property fail to navigate properly.
Console output
wasm-bindgen: imported JS function that was not marked as `catch` threw an error: id is undefined
Stack:
hydrate@https://dioxuslabs.com/assets/dioxus/snippets/dioxus-interpreter-js-9ac3b5e174d5b843/inline0.js:2:3373
__wbg_get_imports/imports.wbg.__wbg_hydrate_311a1b3f31e7c28f/<@https://dioxuslabs.com/assets/dioxus/docsite.js:1461:21
logError@https://dioxuslabs.com/assets/dioxus/docsite.js:257:18
__wbg_get_imports/imports.wbg.__wbg_hydrate_311a1b3f31e7c28f@https://dioxuslabs.com/assets/dioxus/docsite.js:1458:66
dioxus_docs_site-70101fcb57b56825.wasm.dioxus_web::launch::launch_virtual_dom::{{closure}}::h803ca969f7f485be@https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:wasm-function[296]:0x698fe
dioxus_docs_site-70101fcb57b56825.wasm.wasm_bindgen_futures::queue::Queue::new::{{closure}}::hd8ad9ff3465d5db7@https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:wasm-function[763]:0xfd752
dioxus_docs_site-70101fcb57b56825.wasm.<dyn core::ops::function::FnMut<(A,)>+Output = R as wasm_bindgen::closure::WasmClosure>::describe::invoke::h9b711fe81333915a@https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:wasm-function[3374]:0x14e276
__wbg_adapter_57@https://dioxuslabs.com/assets/dioxus/docsite.js:327:10
real@https://dioxuslabs.com/assets/dioxus/docsite.js:286:20
Uncaught TypeError: id is undefined
hydrate https://dioxuslabs.com/assets/dioxus/snippets/dioxus-interpreter-js-9ac3b5e174d5b843/inline0.js:2
__wbg_hydrate_311a1b3f31e7c28f https://dioxuslabs.com/assets/dioxus/docsite.js:1461
logError https://dioxuslabs.com/assets/dioxus/docsite.js:257
__wbg_hydrate_311a1b3f31e7c28f https://dioxuslabs.com/assets/dioxus/docsite.js:1458
__wbg_adapter_57 https://dioxuslabs.com/assets/dioxus/docsite.js:327
real https://dioxuslabs.com/assets/dioxus/docsite.js:286
__wbg_queueMicrotask_481971b0d87f3dd4 https://dioxuslabs.com/assets/dioxus/docsite.js:1621
logError https://dioxuslabs.com/assets/dioxus/docsite.js:257
__wbg_queueMicrotask_481971b0d87f3dd4 https://dioxuslabs.com/assets/dioxus/docsite.js:1620
__wbg_finalize_init https://dioxuslabs.com/assets/dioxus/docsite.js:1914
__wbg_init https://dioxuslabs.com/assets/dioxus/docsite.js:1948
async* https://dioxuslabs.com/learn/0.5/getting_started/liveview/:113
[inline0.js:2:3373](https://dioxuslabs.com/assets/dioxus/snippets/dioxus-interpreter-js-9ac3b5e174d5b843/inline0.js)
hydrate https://dioxuslabs.com/assets/dioxus/snippets/dioxus-interpreter-js-9ac3b5e174d5b843/inline0.js:2
__wbg_hydrate_311a1b3f31e7c28f https://dioxuslabs.com/assets/dioxus/docsite.js:1461
logError https://dioxuslabs.com/assets/dioxus/docsite.js:257
__wbg_hydrate_311a1b3f31e7c28f https://dioxuslabs.com/assets/dioxus/docsite.js:1458
h803ca969f7f485be https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:432382
hd8ad9ff3465d5db7 https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:1038162
dioxus_docs_site-70101fcb57b56825.wasm.<dyn core::ops::function::FnMut<(A,)>+Output = R as wasm_bindgen::closure::WasmClosure>::describe::invoke::h9b711fe81333915a https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:1368694
__wbg_adapter_57 https://dioxuslabs.com/assets/dioxus/docsite.js:327
real https://dioxuslabs.com/assets/dioxus/docsite.js:286
(Async: VoidFunction)
__wbg_queueMicrotask_481971b0d87f3dd4 https://dioxuslabs.com/assets/dioxus/docsite.js:1621
logError https://dioxuslabs.com/assets/dioxus/docsite.js:257
__wbg_queueMicrotask_481971b0d87f3dd4 https://dioxuslabs.com/assets/dioxus/docsite.js:1620
h506dc593fe871e12 https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:1170279
hd6ede8a582e93b25 https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:1234416
h3943cf22103cdb50 https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:794683
h97ac7ac3ddfc6161 https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:925633
h880b6a858405990b https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:1390913
main https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:946780
wasm https://dioxuslabs.com/assets/dioxus/docsite_bg.wasm:1388482
__wbg_finalize_init https://dioxuslabs.com/assets/dioxus/docsite.js:1914
__wbg_init https://dioxuslabs.com/assets/dioxus/docsite.js:1948
InterpretGeneratorResume self-hosted:1412
AsyncFunctionNext self-hosted:799
(Async: async)
<anonymous>
Difference in element properties between clickable and non-clickable links:
The following anchor is on the provided page and is not clickable:
<a href="/learn/0.5/getting_started/fullstack" dioxus-prevent-default="onclick" data-node-hydration="79,click:1" data-dioxus-id="79"><li class="mr-1 rounded-md hover:text-sky-500 dark:hover:text-sky-400" data-node-hydration="80"><!--node-id81-->Fullstack<!--#--></li></a>
The following anchor is on the provided page and is clickable:
<a href="/learn/0.5/guide/state" dioxus-prevent-default="onclick" data-node-hydration="98,click:1"><li class="mr-1 rounded-md hover:text-sky-500 dark:hover:text-sky-400" data-node-hydration="99"><!--node-id100-->State<!--#--></li></a>
How to fix
I'd like to take a shot at fixing this linkage problem to learn more about dioxus, but I'm unsure where to start. I'm still going learning via the docs now, but a pointer in the right direction would be super helpful!