packaton 0.0.13 → 0.0.15

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "packaton",
-	"version": "0.0.13",
+	"version": "0.0.15",
 	"type": "module",
 	"author": "Eric Fortis",
 	"license": "MIT",

package/src/plugins-prod/HtmlCompiler.js

@@ -69,12 +69,20 @@ export class HtmlCompiler {
 			.map(([, body]) => body)
 			.join('\n'))
 
+		this.scriptsModuleJs = await this.#minifyJS(scripts
+			.filter(([type]) => type === 'module')
+			.map(([, body]) => body)
+			.join('\n'))
+
 		this.scriptsNonJs = scripts
-			.filter(([type]) => type !== 'application/javascript')
+			.filter(([type]) => type !== 'application/javascript' && type !== 'module')
 
 		if (this.scriptsJs)
-			this.html = this.html.replace('</body>', `<script>${this.scriptsJs}</script></body>`)
+			this.html = this.html.replace('</body>', `\n<script>${this.scriptsJs}</script></body>`)
 		
+		if (this.scriptsModuleJs)
+			this.html = this.html.replace('</body>', `\n<script type="module">${this.scriptsModuleJs}</script></body>`)
+
 		for (const [type, body] of this.scriptsNonJs)
 			this.html = this.html.replace('</body>', `\n<script type="${type}">${body}</script></body>`)
 	}
@@ -86,6 +94,9 @@ export class HtmlCompiler {
 		const jsScriptHash = this.scriptsJs
 			? `'${this.hash256(this.scriptsJs)}'`
 			: '' // TODO maybe self?
+		const jsModuleHash = this.scriptsModuleJs
+			? `'${this.hash256(this.scriptsModuleJs)}'`
+			: '' // TODO maybe self?
 		const nonJsScriptHashes = this.scriptsNonJs
 			.map(([, body]) => `'${this.hash256(body)}'`).join(' ')
 		const externalScriptHashes = this.externalScripts.map(url => `${new URL(url).origin}`).join(' ')
@@ -93,7 +104,7 @@ export class HtmlCompiler {
 			`default-src 'self'`,
 			`img-src 'self' data:`, // data: is for Safari's video player icons and for CSS bg images
 			`style-src ${cssHash}`,
-			`script-src ${nonJsScriptHashes} ${jsScriptHash} ${externalScriptHashes}`,
+			`script-src-elem ${nonJsScriptHashes} ${jsScriptHash} ${jsModuleHash} ${externalScriptHashes} 'self'`,
 			`frame-ancestors 'none'`
 		].join('; ')
 	}

package/src/router.js

@@ -1,5 +1,6 @@
 import { join } from 'node:path'
 import { readFile } from 'node:fs/promises'
+import { randomUUID } from 'node:crypto'
 
 import { docs } from './app.js'
 import { mimeFor } from './utils/mimes.js'
@@ -7,6 +8,8 @@ import { devClientWatcher } from './plugins-dev/WatcherDevClient.js'
 import { sendError, sendJSON, servePartialContent, serveAsset } from './utils/http-response.js'
 
 
+const devtoolsWorkspaceId = randomUUID()
+
 const WATCHER_DEV = '/plugins-dev/watcherDev.js'
 
 const API = {
@@ -21,7 +24,15 @@ export function router({ srcPath, ignore, mode }) {
 	return async function (req, response) {
 		let url = new URL(req.url, 'http://_').pathname
 		try {
-			if (url === API.watchDev)
+			if (url === '/.well-known/appspecific/com.chrome.devtools.json')
+				sendJSON(response, {
+					workspace: {
+						root: srcPath,
+						uuid: devtoolsWorkspaceId
+					}
+				})
+
+			else if (url === API.watchDev)
 				longPollDevHotReload(req, response)
 
 			else if (url === WATCHER_DEV)