From 699059f461b4fbfaca0cbae2b6b005d0c5cabd59 Mon Sep 17 00:00:00 2001
From: Stephen <stephband@cruncher.ch>
Date: Fri, 20 Sep 2024 22:33:46 +0200
Subject: [PATCH] Compile before clone, errors render correctly (!important not
 set on style property)

---
 modules/compile/compile-node.js | 2 ++
 modules/print.js                | 4 ++--
 modules/template.js             | 8 +++++---
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/modules/compile/compile-node.js b/modules/compile/compile-node.js
index e214d18..d55246d 100644
--- a/modules/compile/compile-node.js
+++ b/modules/compile/compile-node.js
@@ -164,6 +164,8 @@ const compileNode = overload((targets, node) => toType(node), {
                 return targets;
             }
             catch(error) {
+console.log('COMPILE ERROR', node, printError(target, error));
+node.textContent = 'HHHEEEEELLLLPPPPP!!';
                 node.replaceWith(printError(target, error));
                 return targets;
             }
diff --git a/modules/print.js b/modules/print.js
index ebe75d6..5f86368 100644
--- a/modules/print.js
+++ b/modules/print.js
@@ -34,11 +34,11 @@ const literalCSS = {
     'justify-self':  'stretch',
     'align-self':    'start',
     'text-align':    'left',
-    'font-size':     '0.75rem !important',
+    'font-size':     '0.75rem',
     'font-family':   '"Fira Mono", Menlo, Monaco, "Andale Mono", monospace',
     'font-weight':   'normal',
     'letter-spacing': '-0.05em',
-    'line-height':   '1.5rem !important',
+    'line-height':   '1.5rem',
     'border-width':  '0',
     /* Bottom left corner underlaps <code> corner, we give it a slightly bigger
        radius to avoid aliasing this background color through the edge. */
diff --git a/modules/template.js b/modules/template.js
index 772aab8..85c3d55 100644
--- a/modules/template.js
+++ b/modules/template.js
@@ -137,10 +137,12 @@ export default class Literal {
 
     static fromTemplate(template, element, consts = {}, data) {
         const id        = identify(template, 'literal-');
+        const options   = { nostrict: template.hasAttribute && template.hasAttribute('nostrict') };
+
+        // Compile before cloning node – if template has compile errors in DEBUG
+        // mode they are inserted into the template directly
+        const renderers = Literal.compile(id, template.content, options);
         const fragment  = getContextFragment(element, template);
-        const renderers = Literal.compile(id, template.content, {
-            nostrict: template.hasAttribute && template.hasAttribute('nostrict')
-        });
 
         return new Literal(fragment, renderers, element, consts, data);
     }