fix: regression for astro attributes escaping (#10728)

.changeset/large-knives-confess.md

@@ -0,0 +1,5 @@
+---
+"astro": patch
+---
+
+Fixes a regression where some very **specific** code rendered using `expressive-code` was not escaped properly.

packages/astro/src/runtime/server/render/util.ts

@@ -105,7 +105,7 @@ Make sure to use the static attribute syntax (\`${key}={value}\`) instead of the
 	}
 
 	// Prevents URLs in attributes from being escaped in static builds
-	if (typeof value === 'string' && value.includes('&') && urlCanParse(value)) {
+	if (typeof value === 'string' && value.includes('&') && isHttpUrl(value)) {
 		return markHTMLString(` ${key}="${toAttributeString(value, false)}"`);
 	}
 
@@ -247,10 +247,11 @@ export function promiseWithResolvers<T = any>(): PromiseWithResolvers<T> {
 	};
 }
 
-function urlCanParse(url: string) {
+const VALID_PROTOCOLS = ['http:', 'https:'];
+function isHttpUrl(url: string) {
 	try {
-		new URL(url);
-		return true;
+		const parsedUrl = new URL(url);
+		return VALID_PROTOCOLS.includes(parsedUrl.protocol);
 	} catch {
 		return false;
 	}

packages/astro/test/astro-attrs.test.js

@@ -37,6 +37,12 @@ describe('Attributes', async () => {
 			true
 		);
 
+		// cheerio will unescape the values, so checking that the url rendered unescaped to begin with has to be done manually
+		assert.equal(
+			html.includes('cmd: echo "foo" && echo "bar" > /tmp/hello.txt'),
+			true
+		);
+
 		for (const id of Object.keys(attrs)) {
 			const { attribute, value } = attrs[id];
 			const attr = $(`#${id}`).attr(attribute);

packages/astro/test/fixtures/astro-attrs/src/pages/index.astro

@@ -6,6 +6,7 @@
 <span id="null" attr={null} />
 <span id="undefined" attr={undefined} />
 <span id="url" attr={"https://example.com/api/og?title=hello&description=somedescription"}/>
+<span id="code" attr={"cmd: echo \"foo\" && echo \"bar\" > /tmp/hello.txt"} />
 <!--
     Per HTML spec, some attributes should be treated as booleans
     These should always render <span async /> or <span /> (without a string value)
@@ -19,4 +20,4 @@
 -->
 <span id='html-enum' draggable='true' />
 <span id='html-enum-true' draggable={true} />
-<span id='html-enum-false' draggable={false} />
+<span id='html-enum-false' draggable={false} />