Prevent render ansi in error overlay (#9547)

withastro · Dec 30, 2023 · 22f42d1 · 22f42d1
1 parent 8049f0c
commit 22f42d1
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/.changeset/quiet-weeks-teach.md b/.changeset/quiet-weeks-teach.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Prevents ANSI codes from rendering in the error overlay
diff --git a/packages/astro/src/core/errors/dev/utils.ts b/packages/astro/src/core/errors/dev/utils.ts
@@ -26,7 +26,7 @@ export function collectErrorMetadata(e: any, rootFolder?: URL | undefined): Erro
 	err.forEach((error) => {
 		if (e.stack) {
 			const stackInfo = collectInfoFromStacktrace(e);
-			error.stack = stackInfo.stack;
+			error.stack = stripAnsi(stackInfo.stack);
 			error.loc = stackInfo.loc;
 			error.plugin = stackInfo.plugin;
 			error.pluginCode = stackInfo.pluginCode;
@@ -57,7 +57,7 @@ export function collectErrorMetadata(e: any, rootFolder?: URL | undefined): Erro
 
 				if (!error.frame) {
 					const frame = codeFrame(fileContents, error.loc);
-					error.frame = frame;
+					error.frame = stripAnsi(frame);
 				}
 
 				if (!error.fullCode) {
@@ -68,6 +68,12 @@ export function collectErrorMetadata(e: any, rootFolder?: URL | undefined): Erro
 
 		// Generic error (probably from Vite, and already formatted)
 		error.hint = generateHint(e);
+
+		// Strip ANSI for `message` property. Note that ESBuild errors may not have the property,
+		// but it will be handled and added below, which is already ANSI-free
+		if (error.message) {
+			error.message = stripAnsi(error.message);
+		}
 	});
 
 	// If we received an array of errors and it's not from us, it's most likely from ESBuild, try to extract info for Vite to display