Adding a bespoke raw template

dev
1

Hey, I’m trying to add my own Raw template … not simply override an existing one.

Reason: trying to get rid of those nasty ember tags you get when using nested components.

… initially I assumed it would be as easy as just adding one to the templates or templates/list directory, so I went ahead and did that, only for it to silently fail (to find my template).

Perhaps I can confirm this is not supported?

Then I found this:

https://github.com/discourse/discourse/commit/612284cef31cb9f068e0d36d01306d355a065ced

and this:

https://github.com/discourse/discourse/blob/83347ac218f708e172944f087c4781acad41efaf/app/assets/javascripts/discourse/tests/acceptance/raw-plugin-outlet-test.js

So I tried this:

import { addRawTemplate } from "discourse-common/lib/raw-templates";
import { compile } from "handlebars";

<---some init stuff -->

addRawTemplate('search-result-entry',  compile(`<span class='result-lala'>hello</span>`));

Only to get this:

image
image1160×304 20.8 KB

TypeError: Handlebars.compile is undefined

image

Thanks!

Apologies if I’m doing anything wrong here …

(this is going to be super useful btw, so thank you for implementing it!)

1 Like
2

You should be able to add a raw template straight to the templates folder. We did so in discourse-docs. They now use the .hbr file extension, so maybe that’s where things tripped up.

https://github.com/discourse/discourse-docs/tree/master/assets/javascripts/discourse/templates

6 Likes
3

You mean the wrapper <div> which is added to ember components by default? You can disable that by setting tagName to an empty string:

https://github.com/discourse/discourse/blob/11c812f042534ed1e23775850f99fd7aba854228/app/assets/javascripts/admin/addon/components/admin-editable-field.js#L2-L3

Working with ember components is way easier than raw templates, so I’d definitely recommend sticking to ember if you can.

3 Likes
4

Gah, I had my hbr templates in templates/components! (which is obviously wrong when you write that down)

Thanks for that example Justin! Fixed it by moving that out to templates folder, doh!

Working now!

@david ah very useful tip, thank you! I’ll leverage that too! That will allow me to retain actions, perfect.

Seems I’d vastly over complicated it, cheers!

4 Likes