There’s this misconception among some web coders that Sparkle is actively working against them, hiding or obfuscating content in order to make it harder to edit the pages. This is 100% not the case.
First, Sparkle is not aimed at web coders, for whom there are many many tools that can help them.
But the code is not obfuscated or made hard to edit, rather it’s optimized and web ready in order to hit specific performance goals in lighthouse, pagespeed insights and other tools. Additionally the sometimes convoluted markup is the result of what is now years of testing of different combinations of elements and getting them to render consistently across different browsers.
Artisanal code crafting often foregoes the extra pixel or not-quite-as-intended layout, because there’s no visual reference. Sparkle’s code is not artisanal, it’s engineered to produce the intended result in a variety of conditions and with a variety of browsers. To say it’s cryptic is just to not understand what it’s trying to do. There’s purpose and days and sometimes even weeks of work behind every aspect of the code.
Sparkle’s pricing reflects its ability to produce extremely well coded websites, in fact better than 90% of what web coders out there are able to do, while being extremely intuitive to use. If this isn’t of value to you, which is an absolutely legitimate stance, it simply means you are in the top 10% of web coders and can do better by hand coding. Kudos to you, but this doesn’t diminish Sparkle.
Yes creating dynamic content is certainly a valid use case for a website, but Sparkle focuses on static sites right now. It’s not necessarily straightforward to do with Sparkle, but it means you’re in a very narrow space of someone who absolutely needs Sparkle, and also absolutely wants to put a finishing touch that can only be done via some code. The pricing of the developer tools reflects this niche.
Using the “run javascript function” feature requires some understanding of what Sparkle does, and that feature is certainly not much documented. We run a fine line between documenting how that works and explaning coding practices. We have erred on the side of documenting this insufficiently, but as @primo has illustrated, you might need to understand the Sparkle basics a bit more, to see where and how things fit together.
In your example it’s unclear whether you have added the “test1” id to the text block, and looking at the DOM what you probably wanted is:
document.querySelector('#test1 p').innerText = "abcdef";