From 519c8d72f55da02026da2d9e5c91dcf617af1e0d Mon Sep 17 00:00:00 2001
From: infodusha <infodusha@ya.ru>
Date: Sun, 28 Jul 2024 21:13:10 +0300
Subject: [PATCH] feat: all scripts are ES modules now

BREAKING CHANGE: no need to write type for component scripts
---
 DOCS.md                          |  2 --
 example/components/app-root.html |  2 +-
 example/components/card.html     |  1 -
 src/css-helpers.ts               |  2 --
 src/error-stack-modifier.ts      | 27 --------------------
 src/execute-script.ts            | 44 +++-----------------------------
 6 files changed, 5 insertions(+), 73 deletions(-)
 delete mode 100644 src/error-stack-modifier.ts

diff --git a/DOCS.md b/DOCS.md
index ac3ff8e..5eb7e4b 100644
--- a/DOCS.md
+++ b/DOCS.md
@@ -172,5 +172,3 @@ Inside script tag you can use `this` at the root level to reference the componen
  console.log(this.querySelector("h1").innerText);
 </script>
 ```
-
-You can set `type="module"` attribute to use ES modules.
diff --git a/example/components/app-root.html b/example/components/app-root.html
index fe23017..1977df6 100644
--- a/example/components/app-root.html
+++ b/example/components/app-root.html
@@ -32,7 +32,7 @@
 	}
 </style>
 
-<script type="module">
+<script>
 	import { log } from "../scripts/utils.js";
 
 	log(this);
diff --git a/example/components/card.html b/example/components/card.html
index d03affd..1792acf 100644
--- a/example/components/card.html
+++ b/example/components/card.html
@@ -25,4 +25,3 @@ <h3 data-attr="header">No header</h3>
 </script>
 
 <script src="../scripts/card.js"></script>
-<script src="../scripts/card.js" type="module"></script>
diff --git a/src/css-helpers.ts b/src/css-helpers.ts
index 37899c4..c6efd1a 100644
--- a/src/css-helpers.ts
+++ b/src/css-helpers.ts
@@ -1,5 +1,3 @@
-import { cloneNode } from "./helpers.js";
-
 const hostRe = /:host(\((.+)\))?/g;
 
 export function getEncapsulatedCss(
diff --git a/src/error-stack-modifier.ts b/src/error-stack-modifier.ts
deleted file mode 100644
index f317114..0000000
--- a/src/error-stack-modifier.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-export class ErrorStackModifier {
-	static current() {
-		return ErrorStackModifier.fromError(new Error());
-	}
-
-	static fromError(e: Error) {
-		return new ErrorStackModifier(e.stack?.split("\n") ?? []);
-	}
-
-	#items: string[];
-
-	get items() {
-		return this.#items.slice();
-	}
-
-	constructor(items: string[]) {
-		this.#items = items.slice();
-	}
-
-	applyToRow(fn: (item: string) => string) {
-		this.#items = this.#items.map(fn);
-	}
-
-	toString() {
-		return this.#items.join("\n");
-	}
-}
diff --git a/src/execute-script.ts b/src/execute-script.ts
index 56162a8..1401e6a 100644
--- a/src/execute-script.ts
+++ b/src/execute-script.ts
@@ -1,4 +1,3 @@
-import { ErrorStackModifier } from "./error-stack-modifier.js";
 import { returnIfDefined } from "./helpers.js";
 
 // From https://github.com/antonkc/MOR/blob/main/matchJsImports.md
@@ -64,11 +63,12 @@ function setContextForModuleScript(
 	)}\n}).call(${component});`;
 }
 
-async function executeModule(
-	code: string,
+export async function executeScript(
+	element: HTMLScriptElement,
 	relativeTo: string,
 	context: Element
-): Promise<CleanupFn> {
+): Promise<CleanupFn | undefined> {
+	const code = await getCode(element, relativeTo);
 	const uuid = crypto.randomUUID();
 	window[scriptContextSymbol].set(uuid, context);
 	const jsCode = setContextForModuleScript(code, uuid, relativeTo);
@@ -80,39 +80,3 @@ async function executeModule(
 	URL.revokeObjectURL(url);
 	return cleanup;
 }
-
-function execute(code: string, context: Element): CleanupFn | undefined {
-	const fn = Function(code);
-	try {
-		const result = fn.call(context);
-		return typeof result === "function" ? result : undefined;
-	} catch (e) {
-		if (e instanceof Error) {
-			const stack = ErrorStackModifier.fromError(e);
-			const currentPlaceStackLength = ErrorStackModifier.current().items.length;
-			const cutSize = currentPlaceStackLength - 2;
-			const newStack = new ErrorStackModifier(stack.items.slice(0, -cutSize));
-			const selector = context?.tagName.toLowerCase();
-			if (selector) {
-				newStack.applyToRow((r) => r.replace("Component.eval", selector));
-			}
-			console.error(newStack.toString());
-		} else {
-			console.error(e);
-		}
-	}
-	return undefined;
-}
-
-export async function executeScript(
-	element: HTMLScriptElement,
-	relativeTo: string,
-	context: Element
-): Promise<CleanupFn | undefined> {
-	const code = await getCode(element, relativeTo);
-	const isModule = element.getAttribute("type") === "module";
-	if (isModule) {
-		return await executeModule(code, relativeTo, context);
-	}
-	return execute(code, context);
-}