@jsenv/ast 1.1.1 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/ast",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "Parse and transform HTML,CSS and JS",
   "license": "MIT",
   "repository": {
@@ -9,8 +9,7 @@
     "directory": "packages/ast"
   },
   "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org"
+    "access": "public"
   },
   "author": {
     "name": "dmail",
@@ -34,13 +33,13 @@
     "test": "node --conditions=development ./scripts/test.mjs"
   },
   "dependencies": {
-    "@babel/parser": "7.18.5",
-    "@parcel/css": "1.10.1",
-    "acorn": "8.7.1",
+    "@babel/parser": "7.18.8",
+    "@parcel/css": "1.12.2",
+    "acorn": "8.8.0",
     "acorn-import-assertions": "1.8.0",
     "acorn-walk": "8.2.0",
     "parse5": "7.0.0",
     "postcss": "8.4.14",
     "postcss-value-parser": "4.2.0"
   }
-}
+}

package/src/html/html_analysis.js

@@ -1,17 +1,80 @@
 import { getHtmlNodeAttribute } from "./html_node_attributes.js"
 
 export const analyzeScriptNode = (scriptNode) => {
-  const type = getHtmlNodeAttribute(scriptNode, "type")
-  if (type === undefined || type === "text/javascript") {
-    return "classic"
+  const typeAttribute = getHtmlNodeAttribute(scriptNode, "type")
+  if (typeAttribute === undefined || typeAttribute === "text/javascript") {
+    return {
+      type: "js_classic",
+      contentType: "text/javascript",
+    }
+  }
+  if (typeAttribute === "module") {
+    return {
+      type: "js_module",
+      contentType: "text/javascript",
+    }
+  }
+  if (typeAttribute === "importmap") {
+    return {
+      type: "importmap",
+      contentType: "application/importmap+json",
+    }
+  }
+  // jsx
+  if (typeAttribute === "text/jsx") {
+    return {
+      type: "js_classic",
+      contentType: "text/javascript",
+      extension: ".jsx",
+    }
+  }
+  if (typeAttribute === "module/jsx") {
+    return {
+      type: "js_module",
+      contentType: "text/javascript",
+      extension: ".jsx",
+    }
   }
-  if (type === "module") {
-    return "module"
+  // typescript
+  if (typeAttribute === "text/ts") {
+    return {
+      type: "js_classic",
+      contentType: "text/javascript",
+      extension: ".ts",
+    }
   }
-  if (type === "importmap") {
-    return "importmap"
+  if (typeAttribute === "module/ts") {
+    return {
+      type: "js_module",
+      contentType: "text/javascript",
+      extension: ".ts",
+    }
+  }
+  // typescript and jsx
+  if (typeAttribute === "text/tsx") {
+    return {
+      type: "js_classic",
+      contentType: "text/javascript",
+      extension: ".tsx",
+    }
+  }
+  if (typeAttribute === "module/tsx") {
+    return {
+      type: "js_module",
+      contentType: "text/javascript",
+      extension: ".tsx",
+    }
+  }
+  // from MDN about [type] attribute:
+  // "Any other value: The embedded content is treated as a data block
+  // which won't be processed by the browser. Developers must use a valid MIME type
+  // that is not a JavaScript MIME type to denote data blocks.
+  // The src attribute will be ignored."
+  // https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-type
+  return {
+    type: "text",
+    contentType: "text/plain",
   }
-  return type
 }
 
 export const analyzeLinkNode = (linkNode) => {
@@ -21,7 +84,7 @@ export const analyzeLinkNode = (linkNode) => {
       isStylesheet: true,
     }
   }
-  const isRessourceHint = [
+  const isResourceHint = [
     "preconnect",
     "dns-prefetch",
     "prefetch",
@@ -29,7 +92,7 @@ export const analyzeLinkNode = (linkNode) => {
     "modulepreload",
   ].includes(rel)
   return {
-    isRessourceHint,
+    isResourceHint,
     rel,
   }
 }

package/src/html/html_inlining.js

@@ -7,7 +7,7 @@ import { setHtmlNodeText } from "./html_node_text.js"
 export const inlineScriptNode = (script, textContent) => {
   const src = getHtmlNodeAttribute(script, "src")
   setHtmlNodeAttributes(script, {
-    "generated-from-src": src,
+    "inlined-from-src": src,
     "src": undefined,
     "crossorigin": undefined,
     "integrity": undefined,
@@ -18,7 +18,7 @@ export const inlineScriptNode = (script, textContent) => {
 export const inlineLinkStylesheetNode = (link, textContent) => {
   const href = getHtmlNodeAttribute(link, "href")
   setHtmlNodeAttributes(link, {
-    "generated-from-href": href,
+    "inlined-from-href": href,
     "href": undefined,
     "rel": undefined,
     "type": undefined,
@@ -34,7 +34,7 @@ export const inlineLinkStylesheetNode = (link, textContent) => {
 export const inlineImgNode = (img, contentAsBase64) => {
   const src = getHtmlNodeAttribute(img, "src")
   setHtmlNodeAttributes(img, {
-    "generated-from-src": src,
+    "inlined-from-src": src,
     "src": contentAsBase64,
   })
 }

package/src/html/html_node.js

@@ -1,9 +1,6 @@
 import { parseFragment } from "parse5"
 
-import {
-  getHtmlNodeAttribute,
-  setHtmlNodeAttributes,
-} from "./html_node_attributes.js"
+import { setHtmlNodeAttributes } from "./html_node_attributes.js"
 import { findHtmlNode } from "./html_search.js"
 import { analyzeScriptNode } from "./html_analysis.js"
 
@@ -20,18 +17,20 @@ export const createHtmlNode = ({ tagName, textContent = "", ...rest }) => {
   return fragment.childNodes[0]
 }
 
-export const injectScriptNodeAsEarlyAsPossible = (htmlAst, scriptNode) => {
-  const injectedBy = getHtmlNodeAttribute(scriptNode, "injected-by")
-  if (injectedBy === undefined) {
-    setHtmlNodeAttributes(scriptNode, {
-      "injected-by": "jsenv",
-    })
-  }
-  const isModule = analyzeScriptNode(scriptNode) === "module"
-  if (isModule) {
+export const injectScriptNodeAsEarlyAsPossible = (
+  htmlAst,
+  scriptNode,
+  jsenvPluginName = "jsenv",
+) => {
+  setHtmlNodeAttributes(scriptNode, {
+    "jsenv-plugin-owner": jsenvPluginName,
+    "jsenv-plugin-action": "injected",
+  })
+  const isJsModule = analyzeScriptNode(scriptNode).type === "js_module"
+  if (isJsModule) {
     const firstImportmapScript = findHtmlNode(htmlAst, (node) => {
       if (node.nodeName !== "script") return false
-      return analyzeScriptNode(node) === "importmap"
+      return analyzeScriptNode(node).type === "importmap"
     })
     if (firstImportmapScript) {
       return insertAfter(

package/src/html/html_node_position.js

@@ -97,9 +97,9 @@ export const getHtmlNodeAttributePosition = (node, attributeName) => {
     }
   }
   const originalPositionAttributeName =
-    attributeName === "generated-from-src"
+    attributeName === "inlined-from-src"
       ? "original-src-position"
-      : attributeName === "generated-from-href"
+      : attributeName === "inlined-from-href"
       ? "original-href-position"
       : `original-${attributeName}-position`
   const originalPosition = getHtmlNodeAttribute(

package/src/html/html_parse.js

@@ -66,10 +66,10 @@ export const stringifyHtmlAst = (
             "original-position": undefined,
             "original-src-position": undefined,
             "original-href-position": undefined,
-            "injected-by": undefined,
-            "generated-by": undefined,
-            "generated-from-src": undefined,
-            "generated-from-href": undefined,
+            "inlined-from-src": undefined,
+            "inlined-from-href": undefined,
+            "jsenv-plugin-owner": undefined,
+            "jsenv-plugin-action": undefined,
           })
         },
       })

package/src/js/js_static_analysis/new_url.js

@@ -31,6 +31,13 @@ export const analyzeNewUrlCall = (node, { isJsModule, onUrl }) => {
     const baseUrlType = analyzeUrlNodeType(secondArgNode, { isJsModule })
     if (baseUrlType) {
       // we can understand the second argument
+      if (
+        baseUrlType === "StringLiteral" &&
+        secondArgNode.value === "file:///"
+      ) {
+        // ignore new URL(specifier, "file:///")
+        return
+      }
       const urlType = analyzeUrlNodeType(firstArgNode, { isJsModule })
       if (urlType === "StringLiteral") {
         // we can understand the first argument