Hi, first time developing on Discourse, so sorry for the silly questions. I’m building a theme component to display PGNs (chessboard and matches). The component is not theoretically difficult, there is a js component for this (PGNViewer.js) and I was able to translate the [wrap] tags into the prop…

debounceFunction delay calling the target method until the debounce period has elapsed with no additional debounce calls, it sometimes won’t work may still because [imagen] HappyCactus: the document is not yet populated and the PGNV object is unable to find the block debounce may not be the …

Welcome to Meta, @happycactus :wave: [imagen] HappyCactus: Overall, is this approach correct, or would it be better to implement a plugin instead? Yes, probably. The only reason why you’d need a plugin is if you were trying to change the API (ie back end). [imagen] HappyCactus: I can’t…

Thank you, Robert! I’m in doubt, probably because I’ve zero experience with such platforms. My doubt is: my approach is to “embed” the small snippet of javascript needed to fill the div block with the content, but I see that maybe I could execute it from a function “cookPgn”, like it is done in t…

[imagen] HappyCactus: what’s the difference between the loadScript and a simple import? Have you tried an import? I don’t think you can import an external script. Loadscript is the right approach and ensures that the script is fully loaded before your code proceeds and uses it (this is why …

Your actual problem is trying to use inline JS, which is prohibited by CSP. [imagen] HappyCactus: <script>var x='pgn here'; ...</script> Put this code in a helper function in your theme component code, and do not inject it inside posts. Uploading your current theme to GitHub and we can take…

Have a look at the Discourse Mermaid component, which loads a library and has stuff happen to posts.

[imagen] Falco: Your actual problem is trying to use inline JS, which is prohibited by CSP. Thanks, @Falco , this was one of my doubts. [imagen] Falco: Uploading your current theme to GitHub and we can take a look too. Sure, here it is: GitHub - studiofuga/discourse-pgn-component: A th…

[imagen] Robert: [imagen] happycactus: I can’t on my production server, because it says the asset is too big. Is there a way to fix this? I’ve had a similar issue in the past. My fault, I forgot I limited the attachment size to 512kB, raised to default (4096) and it worked well. Thanks…

Ok I did fix everything and the component does work! But we have a problem, an “unsafe eval” in the library I’m using. I guess I should fix the upstream library, I have no idea how to pack it. For those interested, I pushed all my changes in my repo above, and here are the details of the error. […

Your script is tripping over Content Security Policy in Production. You need to add 'unsafe-eval' as a line item in the site setting: content security policy script src

Thanks, I’m browsing the documentation to see how to do this. :slight_smile: I’m learning a lot, thanks

Problemas al cargar un asset js desde un Theme Component

Desarrollador

pfaffman (Jay Pfaffman) 22 Septiembre, 2023 16:59 6

Echa un vistazo al componente Discourse Mermaid, que carga una biblioteca y hace que sucedan cosas en las publicaciones.

Tema		Respuestas	Vistas
Javascript assets in a theme component Development	15	2225	7 Mayo 2021
Defer loading JavaScript in Themes and Components Development dev-news	4	1995	7 Abril 2022
How to load library in a theme component Development	6	454	25 Agosto 2023
Question about web app loading Support	2	101	25 Abril 2025
Discourse theme components now support Wasm :confetti_ball: Announcements new-feature	11	1507	21 Marzo 2024

Problemas al cargar un asset js desde un Theme Component

Temas relacionados