Comments (6)
This is because <input>
can’t have children, no? The position of the label
and the input
are reversed.
from sycamore.
This is quite puzzling. I'll look more into this.
from sycamore.
For reference, that error emanates from Perseus, and there's extensive documentation about it in our FAQs. This sort of HTML will be happily parsed by most browsers, but it's strictly invalid according to the spec. Having Sycamore prevent this is probably not the best idea, because sometimes you want spec-invalid HTML to do particularly wacky things (like links inside links, which do rarely have their uses if accessibility is properly handled).
from sycamore.
I don't mind whether Perseus/sycamore allows nesting labels inside of inputs or throws an error. But the current implementation does neither and instead seems to mangle the HTML. This looks like a buffer overflow or out-of-bounds write.
from sycamore.
This is not a memory related error but is instead the minifier choking on invalid HTML.
Given the following code:
view! { cx,
input {
label {
"Foo"
}
}
}
Sycamore returns the following SSRed string:
<input data-hk="0.0"><label data-hk="0.1">Foo</label></input>
Perseus's minifier assumes that the only html it can receive is semantically valid HTML as described by the spec, allowing it to further shrink the resulting HTML. However, Sycamore allows arbitrary nesting of HTML elements, including invalid ones such as a label
inside an input
, which thereby causes problems such as these.
I'm going to close this issue now since it is not a Sycamore bug and I'm not even sure if it should even be considered as a Perseus bug since there is not much we can do about it besides disabling the minifier altogether.
from sycamore.
I agree with @lukechu10, but I'll also add that the Perseus minifier does mangle the output HTML deliberately, doing things like removing closing tags, because browsers can still interpret this, it just lessens the number of bytes needing to be transferred over the network. It's odd behaviour I agree, but it's intended. I would recommend disabling the minifier by turning off default features if you'd like to use technically invalid HTML like this.
from sycamore.
Related Issues (20)
- Probable bug in signal propagation HOT 4
- Panic updating signal in 0.9.0-beta.2 HOT 1
- Bootstrap scrollspy support HOT 4
- Book (website) routing not properly updating HOT 8
- Shared data update failed when nested routing layout HOT 1
- Is there a tool for converting HTML to sycamore components? HOT 1
- Is there a case of a right-click pop-up menu? HOT 2
- Nested component using string error HOT 1
- Nested component click event error HOT 1
- Nested component click event error HOT 1
- Hydrate example has a javascript error and does not work HOT 2
- Support binding to a radio input value HOT 2
- Console error "closure invoked recursively or after being dropped" when executing `navigate` in a component using `Indexed` HOT 4
- hydration start marker not found after trunk build --release
- Websocket example HOT 1
- Unable to view source in the docs: `Query parser error: "Unexpected `.`"` HOT 1
- `set_fn` is silent
- Keydown event not firing on textarea HOT 2
- rust-analyzer reports a warning arising from proc-macro
- Sycamore-v0.9.0's PointerEvent error in Chrome (Windows) HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from sycamore.