This is a niche one but if anyone needs a hyperscript renderer more geared for an HTML-based workflow than JSX, I forked @developit’s excellent vhtml to implement a few things I need for Kitten¹.
https://codeberg.org/small-tech/vhtml
Main differences so far:
- Style tags are no longer escaped
- Boolean HTML attributes are emitted correctly (without ="true")
You probably want Jason’s original but putting this out there in case it helps anyone else.
Okay, I don't know what any of that means, but you do have to tell me how you did superscripts in a Mastodon toot.
@stevensrmiller @developit On Linux, you have something called the compose key that I have mapped to my Caps Lock (CL).
So if I want to do a superscript, I press CL + ^ + 1 (or 2, 3, etc.) and get ¹ ² ³…
Similarly, I can type CL + - + - + . to get an en dash (–), CL + - + - + - to get an em dash (—), or CL + t + m to get ™, etc.
@aral @stevensrmiller @developit And if you still wamt the caps lock functionality there is a way to map that to pressing both shifts to toggle it on and one shift to toggle it off.
@LJNielsenDk Haven’t really missed it (my programming in ALL CAPS in BASIC days are far behind me) :P @stevensrmiller @developit
Hard to believe, sometimes, that I started by punching my all-caps code into paper cards 50 years ago, and that (although we have lower case and interactive editors now) a loop is still a loop, an if is still an if, and indexing an array of size three with a three still gets an "out of bounds" error.
Our machines are thousands of times more powerful, but our code still looks the same.
@aral @stevensrmiller @developit
wait what, how did you map it to Caps Lock? I want that too!
@cr You can do it using GNOME Tweaks:
https://ar.al/2018/07/18/typographical-typing-habits-for-linux/#the-compose-key
@aral @stevensrmiller @developit
And CL + ! + ? to get ‽
@aral @stevensrmiller @developit Maybe not exactly relevant in your context but can you install WinCompose to get the Compose Key in Windows too.
I use a US keyboard but work for a multi-national company and have to type modified characters all the time. Right-Alt + e + " -> ë. Right-Alt + s + s -> ß. Right Alt + C + = -> €.
http://wincompose.info/ (not SSL but legit)
@aral careful with that sanitization bypass:
h('style', {}, '</style><script>alert("hi")</script>')
@aral actually I think we could fix this in VHTML if you wanted - it's currently doing unnecessary entity encoding for text content. It should only be encoding `<`. The boolean prop thing it just something I forgot to add.
@developit I’m happy either way; didn’t want to create more work for you given your focus on the JSX/Preact stuff :)
@developit PS. Was just looking into this and CSS 4 now supports < and > in media queries so it’s not going to be trivial (still doable though, just more conditions to consider, e.g., env() can be used in media queries).
@developit Escaping </ where name === 'style' seems to do the trick.
@developit Unless I’m mistaken browsers don’t run scripts in style tags (I did test that as I was wondering whether browsers were dumb enough to run scripts in style tags) :)
@developit Oh, wait, I see what you did there. OK, right, yes, thanks :)
@developit (Mind you, I’m not sure what markup could result in that piece of hyperscript from htm/xhtm. Or maybe my brain is tired right now; will take a look again tomorrow) :)
@aral it'd really only matter if you were doing something like allowing user-submitted content within your stylesheet. As soon as you jump into a variable in the htm template string, you're relying on vhtml's entity encoding to ensure that variable isn't interpreted as HTML. Works a bit differently than VDOM, where the template is never parsed or assigned as HTML.
@developit G’morning :) Right, I don’t see that happening in regular use but, still, someone somewhere might decide that’s a good idea at some point so better safe than sorry :)