I’m new to ember. is the h function that is used in some pages to build HTML part of the ember project? I haven’t been able to find documentation on it. Searching “ember h javascript” doesn’t do the trick The specific problem I am trying to solve is add a data attribute to a script tag I am creating. e.g. h("script", {src: "http://localhost:5000/pass.js", "data-space": "123"}), This creates a script tag wit the correct src but the data-space attribute is missing.

Ah yeah. The only documentation we reference that I can find is virtual-dom/virtual-hyperscript/README.md at master · Matt-Esch/virtual-dom · GitHub and it’s sort of hidden in our codebase as a comment :slightly_smiling_face: Even with that I couldn’t find the answer you are looking for there. In any case, there is a topic here on Meta that does have the solution: [image] Widget Helper stripping attributes? Development https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/widgets/header.js.es6#L93-L104 As per above code, I guess it should be like below decorateWidget('header-icons:before', helper => { return h('li.header-dropdown-toggle', [ h('a.icon.btn-flat', { 'id': 'my id', 'href': 'http://example.com', 'title': 'my title', 'attributes': { 'aria-label': 'my label', … So based on the code you provided, it should work if you change it to the following: h("script", { src: "http://localhost:5000/pass.js", attributes: { "data-space": "123" } }),

There is also this post that explains how the virtual dom / widget part of Discourse works: [image] A tour of how the Widget (Virtual DOM) code in Discourse works Development This is out of date. See Widgets, the Widget API and their roadmap? The latest builds of Discourse are much faster at rendering topics thanks to our re-written post stream. I’ve written up our new plugin API but so far haven’t explained how the code all fits together. The purpose of this topic is to allow Discourse developers to understand how the new code works. What’s a Virtual DOM? A Virtual DOM is a data structure that enables browsers to re-render dynamic content very quickly. The techniq…

How do I add data attributes to a script using the HTML builder

Development

eviltrout (Robin Ward) July 26, 2019, 8:51pm 3

There is also this post that explains how the virtual dom / widget part of Discourse works:

Topic		Replies	Views
Guidance whitelisting arbitrary HTML attributes? Product Support	8	1731	July 20, 2019
Widget Helper stripping attributes? Development	6	1507	May 25, 2023
Javascript HTML - widget Development	1	716	June 29, 2022
Custom complex HTML code in the Discourse Header Product Support	1	3100	April 4, 2019
How to pass a component setting as a value to an attribute? Development	1	617	May 9, 2023

How do I add data attributes to a script using the HTML builder

Related topics