dioxus_web::launch_cfg cannot be called multiple times on different root elements. #1907
Comments
|
Here is the complete error message with debug flags enabled. |
|
Iframes provide a workaround. index.html <!doctype html>
<html lang="en">
<body>
<iframe src="other.html"></iframe>
<iframe src="other.html"></iframe>
</body>
</html>other.html <!doctype html>
<html lang="en">
<head>
<title>Im in an iframe</title>
<script type="module">
import init, { run, change } from './pkg/jupyter_and_dioxus.js';
window.change = change;
async function main() {
await init();
run();
}
main();
</script>
</head>
<body>
<ce-dioxus>What happens to you?</ce-dioxus>
</body>
</html>result in the browser |
|
This should definitely be possible and might be a side effect of how we do event delegation actually. I'll take a look soon - should be simple to fix. |
|
Revisiting this - it's likely because we use the same interpreter for all virtualdom instances and there's a data race happening. Going to be fixed in #1974 |
|
I got around to testing this and the problem is resolved. Thank you |
0.5.0-alpha.2 is out now with this fixed if you want a released version to work from :) |
Problem
When trying to have multiple dioxus widgets on different pre-existing elements, the browser console will tell about the fact that
null has no property X, where X can belistenersornodeTypewhen callingdioxus_web::launch_cfgfor the second time using either aConfig::rootnameorConfig::rootelementon an element that is not a child of first root element.Steps To Reproduce
cmd/buildpython -m http.server 8080$BROWSER http://localhost:8080My repo works with custom elements, but my exposed
changefunction can also be used to launch dioxus on an element given its id, and you will again notice that this function errors when dioxus was already launched, either because there was already a rendered custom element or because the function was called before on a different id.Expected behavior
When pointing the browser to index.html, you only see a single group of 2 buttons + 1 header. I expect there to be two groups, since there are two custom elements in index.html. Instead, there is the aforementioned error in the console.
Screenshots
Environment:
Willingness to solve this myself
I'm interested in fixing this myself but don't know where to start.
If there is a way to solve this without using dioxus_web, that's also fine by me. I just want multiple dioxus widgets without all those widgets necessarily having to share the same root element, since I'm using dioxus inside a pre-existing html that sometimes adds new elements itself (I want dioxus widgets inside a jupyter notebook's cell output). If my goal is doable with a single dioxus root, then that's also fine (I did not try this yet), but my gut tells me dioxus won't play nice with external sources adding (complex) elements.
Bug or Feature
I've seen no mention or examples of multiple
dioxus_*::launchcalls, maybe I am merely mistaken in thinking this is possible to do, in which case this issue is moreso a combination of a feature request; a call for help; and a mention that the documentation has not been clear to me about the role oflaunchcalls. If Dioxus is not the right tool for my job, then this might deserve mention, for example here #1359.Links
The text was updated successfully, but these errors were encountered: