helloWorld.Saxon-JS

By Norm Tovey-Walsh on October 27, 2020 at 12:30p.m.

What happened was, last Friday I decided to make my first foray into using Saxon-JS. I have in mind a personal project that would use it for rendering and I wanted to get my feet wet.

I was able to follow the documentation and pretty quickly I had it up and running. But along the way, I stumbled a couple of times. I didn’t read the documentation carefully enough in one case and in another, I introduced a typo into a URI.

What I would have liked was a simple project that pulled all the pieces together, one where I could build it and see it working, and then begin to hack on it.

Since I didn’t find one of those, I built one: https://github.com/Saxonica/helloWorldJS.

On the plus side, this project demonstrates both replacing and appending to web page content with an XSLT transformation, responding to user events, and calling external JavaScript libraries.

On possibly the less plus side, I’ve used Gradle to pull all the pieces together. You might argue that obfuscates things a little bit, if you aren’t familiar with Gradle, but I wanted to put things in the context of an actual project build and that’s what I use for builds these days. PRs for branches that demonstrate Make or Ant or your build tool of choice are welcome. That’s not meant to be the interesting part.

There are three branches.

main
This branch is the simplest. The HTML page fires off a Saxon JS stylesheet that transforms an XML document and updates the page with the result.
use-script
This branch does basically the same thing, but instead of loading the XML document by making another request to the server, the document is embedded in the initial HTML document in a script element. It was an experiment I wanted to try. It avoids a round trip to the server to get the XML document at the cost of having to extract and parse the document from the HTML.
render-commonmark
The personal project I’m thinking of converting to use Saxon-JS stores some content in CommonMark. I thought it would be interesting to see if I could call an external JavaScript library to convert that into HTML and then transform it. Yes, I can. The JavaScript in src/main/js/start.js is a bit cleaner in this branch, too.

All three branches include a button that responds (by running an XSLT template in the stylesheet) when you click it.

I’ve published the simplest version online, if you just want to see it in all it’s dull glory.