wc-compiler 0.9.0 → 0.10.0

package/README.md

@@ -50,7 +50,7 @@
 1. Get HTML!
     ```html
     <wcc-footer>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <style>
           .footer {
             color: white;

package/dist/wcc.dist.cjs

@@ -83,7 +83,7 @@ class Document extends Node$1 {
         return new HTMLTemplateElement();
 
       default:
-        return new HTMLElement$1();
+        return new HTMLElement();
 
     }
   }
@@ -95,7 +95,7 @@ class Document extends Node$1 {
 
 // https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement
 // EventTarget <- Node <- Element <- HTMLElement
-class HTMLElement$1 extends Element {
+class HTMLElement extends Element {
   attachShadow(options) {
     this.shadowRoot = new ShadowRoot(options);
 
@@ -126,7 +126,7 @@ class ShadowRoot extends DocumentFragment {
 
 // https://developer.mozilla.org/en-US/docs/Web/API/HTMLTemplateElement
 // EventTarget <- Node <- Element <- HTMLElement <- HTMLTemplateElement
-class HTMLTemplateElement extends HTMLElement$1 {
+class HTMLTemplateElement extends HTMLElement {
   constructor() {
     super();
     this.content = new DocumentFragment();
@@ -136,7 +136,7 @@ class HTMLTemplateElement extends HTMLElement$1 {
   set innerHTML(html) {
     if (this.content) {
       this.content.innerHTML = `
-        <template shadowroot="open">
+        <template shadowrootmode="open">
           ${html}
         </template>
       `;
@@ -168,7 +168,7 @@ class CustomElementsRegistry {
 globalThis.addEventListener = noop;
 globalThis.document = new Document();
 globalThis.customElements = new CustomElementsRegistry();
-globalThis.HTMLElement = HTMLElement$1;
+globalThis.HTMLElement = HTMLElement;
 
 // Reserved word lists for various dialects of the language
 
@@ -28130,9 +28130,6 @@ async function initializeCustomElement(elementURL, tagName, attrs = [], definiti
     await elementInstance.connectedCallback();
   
     return elementInstance;
-  } else {
-    console.debug('No custom element class found for this file');
-    return new HTMLElement();
   }
 }
 
@@ -28141,18 +28138,25 @@ async function renderToString(elementURL, wrappingEntryTag = true, props = {}) {
   const elementTagName = wrappingEntryTag && await getTagName(elementURL);
   const isEntry = !!elementTagName;
   const elementInstance = await initializeCustomElement(elementURL, undefined, undefined, definitions, isEntry, props);
-
-  const elementHtml = elementInstance.shadowRoot
-    ? elementInstance.getInnerHTML({ includeShadowRoots: true })
-    : elementInstance.innerHTML;
-  const elementTree = getParse(elementHtml)(elementHtml);
-  const finalTree = await renderComponentRoots(elementTree, definitions);
-  const html = wrappingEntryTag && elementTagName ? `
-      <${elementTagName}>
-        ${serialize(finalTree)}
-      </${elementTagName}>
-    `
-    : serialize(finalTree);
+  let html;
+
+  // in case the entry point isn't valid
+  if (elementInstance) {
+    const elementHtml = elementInstance.shadowRoot
+      ? elementInstance.getInnerHTML({ includeShadowRoots: true })
+      : elementInstance.innerHTML;
+    const elementTree = getParse(elementHtml)(elementHtml);
+    const finalTree = await renderComponentRoots(elementTree, definitions);
+
+    html = wrappingEntryTag && elementTagName ? `
+        <${elementTagName}>
+          ${serialize(finalTree)}
+        </${elementTagName}>
+      `
+      : serialize(finalTree);
+  } else {
+    console.warn('WARNING: No custom element class found for this entry point.');
+  }
 
   return {
     html,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wc-compiler",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "description": "Experimental native Web Components compiler.",
   "repository": {
     "type": "git",
@@ -11,6 +11,7 @@
   "author": "Owen Buckley <owen@thegreenhouse.io>",
   "keywords": [
     "Web Components",
+    "SSR",
     "JSX",
     "Greenwood"
   ],

package/src/dom-shim.js

@@ -108,7 +108,7 @@ class HTMLTemplateElement extends HTMLElement {
   set innerHTML(html) {
     if (this.content) {
       this.content.innerHTML = `
-        <template shadowroot="open">
+        <template shadowrootmode="open">
           ${html}
         </template>
       `;

package/src/wcc.js

@@ -158,9 +158,6 @@ async function initializeCustomElement(elementURL, tagName, attrs = [], definiti
     await elementInstance.connectedCallback();
   
     return elementInstance;
-  } else {
-    console.debug('No custom element class found for this file');
-    return new HTMLElement();
   }
 }
 
@@ -169,18 +166,25 @@ async function renderToString(elementURL, wrappingEntryTag = true, props = {}) {
   const elementTagName = wrappingEntryTag && await getTagName(elementURL);
   const isEntry = !!elementTagName;
   const elementInstance = await initializeCustomElement(elementURL, undefined, undefined, definitions, isEntry, props);
-
-  const elementHtml = elementInstance.shadowRoot
-    ? elementInstance.getInnerHTML({ includeShadowRoots: true })
-    : elementInstance.innerHTML;
-  const elementTree = getParse(elementHtml)(elementHtml);
-  const finalTree = await renderComponentRoots(elementTree, definitions);
-  const html = wrappingEntryTag && elementTagName ? `
-      <${elementTagName}>
-        ${serialize(finalTree)}
-      </${elementTagName}>
-    `
-    : serialize(finalTree);
+  let html;
+
+  // in case the entry point isn't valid
+  if (elementInstance) {
+    const elementHtml = elementInstance.shadowRoot
+      ? elementInstance.getInnerHTML({ includeShadowRoots: true })
+      : elementInstance.innerHTML;
+    const elementTree = getParse(elementHtml)(elementHtml);
+    const finalTree = await renderComponentRoots(elementTree, definitions);
+
+    html = wrappingEntryTag && elementTagName ? `
+        <${elementTagName}>
+          ${serialize(finalTree)}
+        </${elementTagName}>
+      `
+      : serialize(finalTree);
+  } else {
+    console.warn('WARNING: No custom element class found for this entry point.');
+  }
 
   return {
     html,