Render Maquette without the Projector

Question

I want to use Maquette as a basic hyperscript language. Consequently, I don't want to use the maquette.projector. However, I'm having a hard time getting any of the maquette.dom functions to work.

var h = maquette.h;
var dom = maquette.dom;
var svg = h('div.sweet', [
  h('svg', [
    h('circle', { cx: '2cm', cy: '2cm', r: '4cm', fill: 'red' }),
  ])
]);

document.addEventListener('DOMContentLoaded', function () {
  console.log(svg);
  var root = dom.create(svg).domNode;
});

<script src="//cdnjs.cloudflare.com/ajax/libs/maquette/2.4.1/maquette.min.js"></script>

What am I doing wrong? Why is dom.create not rendering anything?

Answer 1

Nice to see that you have found another usecase without the projector. The dom.create method only creates the DOM nodes, but it does not append them anywhere in the document. You can use document.body.appendChild(root) or use dom.append(document.body, svg).