implement script element

Author: rmorshea

src/client/packages/idom-client-react/src/components.js

@@ -34,6 +34,8 @@ export function Element({ model }) {
     } else {
       return null;
     }
+  } else if (model.tagName == "script") {
+    return html`<${ScriptElement} script=${model.children[0]} />`;
   } else if (model.importSource) {
     return html`<${ImportedElement} model=${model} />`;
   } else {
@@ -56,6 +58,12 @@ function StandardElement({ model }) {
   );
 }
 
+function ScriptElement({ script }) {
+  const el = React.useRef();
+  React.useEffect(eval(script), [script]);
+  return null;
+}
+
 function ImportedElement({ model }) {
   const layoutContext = React.useContext(LayoutContext);
 

src/idom/html.py

@@ -150,7 +150,7 @@
 - :func:`template`
 """
 
-from .core.vdom import make_vdom_constructor
+from .core.vdom import VdomDict, make_vdom_constructor
 
 
 # Dcument metadata
@@ -253,6 +253,23 @@
 del_ = make_vdom_constructor("del")
 ins = make_vdom_constructor("ins")
 
+# Scripting
+
+
+def script(content: str) -> VdomDict:
+    """Create a new `<{script}> <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script>`__ element.
+
+    Parameters:
+        content:
+            The text of the script should evaluate to a function. This function will be
+            called when the script is initially created or when the content of the
+            script changes. The function may optionally return a teardown function that
+            is called when the script element is removed from the tree, or when the
+            script content changes.
+    """
+    return {"tagName": "script", "children": [content]}
+
+
 # Table content
 caption = make_vdom_constructor("caption")
 col = make_vdom_constructor("col")