fix: escape ids in import.meta.ROLLUP_FILE_URL_referenceId correctly (#5404)

sapphi-red · web-flow · commit ce6cb9309885 · 2024-03-05T05:40:36.000Z
diff --git a/src/ast/nodes/MetaProperty.ts b/src/ast/nodes/MetaProperty.ts
@@ -175,7 +175,7 @@ const getGenericImportMetaMechanism =
 const getFileUrlFromFullPath = (path: string) => `require('u' + 'rl').pathToFileURL(${path}).href`;
 
 const getFileUrlFromRelativePath = (path: string) =>
-	getFileUrlFromFullPath(`__dirname + '/${path}'`);
+	getFileUrlFromFullPath(`__dirname + '/${escapeId(path)}'`);
 
 const getUrlFromDocument = (chunkId: string, umd = false) =>
 	`${
@@ -187,15 +187,15 @@ const getUrlFromDocument = (chunkId: string, umd = false) =>
 const relativeUrlMechanisms: Record<InternalModuleFormat, (relativePath: string) => string> = {
 	amd: relativePath => {
 		if (relativePath[0] !== '.') relativePath = './' + relativePath;
-		return getResolveUrl(`require.toUrl('${relativePath}'), document.baseURI`);
+		return getResolveUrl(`require.toUrl('${escapeId(relativePath)}'), document.baseURI`);
 	},
 	cjs: relativePath =>
 		`(typeof document === 'undefined' ? ${getFileUrlFromRelativePath(
 			relativePath
 		)} : ${getRelativeUrlFromDocument(relativePath)})`,
-	es: relativePath => getResolveUrl(`'${relativePath}', import.meta.url`),
+	es: relativePath => getResolveUrl(`'${escapeId(relativePath)}', import.meta.url`),
 	iife: relativePath => getRelativeUrlFromDocument(relativePath),
-	system: relativePath => getResolveUrl(`'${relativePath}', module.meta.url`),
+	system: relativePath => getResolveUrl(`'${escapeId(relativePath)}', module.meta.url`),
 	umd: relativePath =>
 		`(typeof document === 'undefined' && typeof location === 'undefined' ? ${getFileUrlFromRelativePath(
 			relativePath
diff --git a/test/form/samples/emit-asset-file/_config.js b/test/form/samples/emit-asset-file/_config.js
@@ -24,7 +24,7 @@ module.exports = defineTest({
 				},
 				generateBundle(options, outputBundle) {
 					const keys = Object.keys(outputBundle);
-					assert.strictEqual(keys.length, 2);
+					assert.strictEqual(keys.length, 3);
 					assert.strictEqual(keys[0], 'assets/logo-zDlmrXar.svg');
 					const asset = outputBundle[keys[0]];
 					assert.strictEqual(asset.fileName, 'assets/logo-zDlmrXar.svg');
@@ -37,7 +37,8 @@ module.exports = defineTest({
 						source.equals(readFileSync(path.resolve(__dirname, 'logo.svg'))),
 						'asset has correct source'
 					);
-					assert.ok(keys[1].endsWith('.js'), `${keys[1]} ends with ".js"`);
+					assert.ok(keys[1].endsWith('.svg'), `${keys[1]} ends with ".svg"`);
+					assert.ok(keys[2].endsWith('.js'), `${keys[2]} ends with ".js"`);
 				}
 			}
 		]
diff --git a/test/form/samples/emit-asset-file/_expected/amd.js b/test/form/samples/emit-asset-file/_expected/amd.js
@@ -2,6 +2,8 @@ define(['require'], (function (require) { 'use strict';
 
 	var logo = new URL(require.toUrl('./assets/logo-zDlmrXar.svg'), document.baseURI).href;
 
+	var logoReverse = new URL(require.toUrl('./assets/logo_reverse\'-DbGK2oiS.svg'), document.baseURI).href;
+
 	function showImage(url) {
 		console.log(url);
 		if (typeof document !== 'undefined') {
@@ -12,5 +14,6 @@ define(['require'], (function (require) { 'use strict';
 	}
 
 	showImage(logo);
+	showImage(logoReverse);
 
 }));
diff --git a/test/form/samples/emit-asset-file/_expected/cjs.js b/test/form/samples/emit-asset-file/_expected/cjs.js
@@ -2,6 +2,8 @@
 
 var logo = (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__dirname + '/assets/logo-zDlmrXar.svg').href : new URL('assets/logo-zDlmrXar.svg', document.currentScript && document.currentScript.src || document.baseURI).href);
 
+var logoReverse = (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__dirname + '/assets/logo_reverse\'-DbGK2oiS.svg').href : new URL('assets/logo_reverse\'-DbGK2oiS.svg', document.currentScript && document.currentScript.src || document.baseURI).href);
+
 function showImage(url) {
 	console.log(url);
 	if (typeof document !== 'undefined') {
@@ -12,3 +14,4 @@ function showImage(url) {
 }
 
 showImage(logo);
+showImage(logoReverse);
diff --git a/test/form/samples/emit-asset-file/_expected/es.js b/test/form/samples/emit-asset-file/_expected/es.js
@@ -1,5 +1,7 @@
 var logo = new URL('assets/logo-zDlmrXar.svg', import.meta.url).href;
 
+var logoReverse = new URL('assets/logo_reverse\'-DbGK2oiS.svg', import.meta.url).href;
+
 function showImage(url) {
 	console.log(url);
 	if (typeof document !== 'undefined') {
@@ -10,3 +12,4 @@ function showImage(url) {
 }
 
 showImage(logo);
+showImage(logoReverse);
diff --git a/test/form/samples/emit-asset-file/_expected/iife.js b/test/form/samples/emit-asset-file/_expected/iife.js
@@ -3,6 +3,8 @@
 
 	var logo = new URL('assets/logo-zDlmrXar.svg', document.currentScript && document.currentScript.src || document.baseURI).href;
 
+	var logoReverse = new URL('assets/logo_reverse\'-DbGK2oiS.svg', document.currentScript && document.currentScript.src || document.baseURI).href;
+
 	function showImage(url) {
 		console.log(url);
 		if (typeof document !== 'undefined') {
@@ -13,5 +15,6 @@
 	}
 
 	showImage(logo);
+	showImage(logoReverse);
 
 })();
diff --git a/test/form/samples/emit-asset-file/_expected/system.js b/test/form/samples/emit-asset-file/_expected/system.js
@@ -5,6 +5,8 @@ System.register([], (function (exports, module) {
 
 			var logo = new URL('assets/logo-zDlmrXar.svg', module.meta.url).href;
 
+			var logoReverse = new URL('assets/logo_reverse\'-DbGK2oiS.svg', module.meta.url).href;
+
 			function showImage(url) {
 				console.log(url);
 				if (typeof document !== 'undefined') {
@@ -15,6 +17,7 @@ System.register([], (function (exports, module) {
 			}
 
 			showImage(logo);
+			showImage(logoReverse);
 
 		})
 	};
diff --git a/test/form/samples/emit-asset-file/_expected/umd.js b/test/form/samples/emit-asset-file/_expected/umd.js
@@ -5,6 +5,8 @@
 
 	var logo = (typeof document === 'undefined' && typeof location === 'undefined' ? require('u' + 'rl').pathToFileURL(__dirname + '/assets/logo-zDlmrXar.svg').href : new URL('assets/logo-zDlmrXar.svg', typeof document === 'undefined' ? location.href : document.currentScript && document.currentScript.src || document.baseURI).href);
 
+	var logoReverse = (typeof document === 'undefined' && typeof location === 'undefined' ? require('u' + 'rl').pathToFileURL(__dirname + '/assets/logo_reverse\'-DbGK2oiS.svg').href : new URL('assets/logo_reverse\'-DbGK2oiS.svg', typeof document === 'undefined' ? location.href : document.currentScript && document.currentScript.src || document.baseURI).href);
+
 	function showImage(url) {
 		console.log(url);
 		if (typeof document !== 'undefined') {
@@ -15,5 +17,6 @@
 	}
 
 	showImage(logo);
+	showImage(logoReverse);
 
 }));
diff --git a/test/form/samples/emit-asset-file/logo_reverse'.svg b/test/form/samples/emit-asset-file/logo_reverse'.svg
@@ -0,0 +1,60 @@
+<svg width="800" height="800" viewBox="0 0 800 800" fill="none" xmlns="http://www.w3.org/2000/svg">
+	<path
+		d="M179 490C179 523.6 187.8 555.1 203.3 582.4C244.4 624.7 333.8 634.5 356 582.6C378.8 529.4 317.7 470.2 291 474.9C257 480.9 297 558.9 297 558.9C245 460.9 257 490.9 351 400.9C445 310.9 541 121 555 113C555.6 112.6 556.2 112.3 556.9 112L188.2 112C181.7 112 177.5 118.9 180.4 124.7L276.8 315.5C278.9 319.6 277.4 324.7 273.4 327C217 359.4 179 420.2 179 490Z"
+		fill="url(#paint0_linear_1957_14)" />
+	<path
+		d="M179 490C179 523.6 187.8 555.1 203.3 582.4C244.4 624.7 333.8 634.5 356 582.6C378.8 529.4 317.7 470.2 291 474.9C257 480.9 297 558.9 297 558.9C245 460.9 257 490.9 351 400.9C445 310.9 541 121 555 113C555.6 112.6 556.2 112.3 556.9 112L188.2 112C181.7 112 177.5 118.9 180.4 124.7L276.8 315.5C278.9 319.6 277.4 324.7 273.4 327C217 359.4 179 420.2 179 490Z"
+		fill="url(#paint1_linear_1957_14)" />
+	<path d="M555 113C541 121 445 311 351 401C257 491 245 461 297 559C297 559 496 280 568 142"
+		fill="url(#paint2_linear_1957_14)" />
+	<path
+		d="M527 363C392.6 610.1 375 635 305 635C268.2 635 231.1 618.4 207.1 588.9C239.8 641.6 297.7 676.9 364 677.9L592.3 677.9C597.1 677.9 601 674 601 669.2L601 209C587.4 244.1 564.3 294.3 527 363Z"
+		fill="url(#paint3_linear_1957_14)" />
+	<path
+		d="M351 401C445 311 541 121 555 113C569 105 592.5 104 605 118C618.3 132.9 639 157 527 363C392.6 610.1 375 635 305 635C268.2 635 231.1 618.4 207.1 588.9C205.8 586.8 204.5 584.6 203.2 582.4C244.3 624.7 333.7 634.5 355.9 582.6C378.7 529.4 317.6 470.2 290.9 474.9C256.9 480.9 296.9 558.9 296.9 558.9C245 461 257 491 351 401Z"
+		fill="url(#paint4_linear_1957_14)" />
+	<path opacity="0.3"
+		d="M516 352C381.6 599.1 364 624 294 624C263.7 624 233.2 612.7 210 592.3C234 619.7 269.6 635 305 635C375 635 392.6 610.1 527 363C639 157 618.3 132.9 605 118C603.1 115.9 600.9 114.1 598.6 112.6C610.3 129.6 615.5 169.1 516 352Z"
+		fill="url(#paint5_linear_1957_14)" />
+	<defs>
+		<linearGradient id="paint0_linear_1957_14" x1="455.531" y1="373.949" x2="301.531" y2="337.949"
+			gradientUnits="userSpaceOnUse">
+			<stop stop-color="#FF6533" />
+			<stop offset="0.157" stop-color="#FF5633" />
+			<stop offset="0.434" stop-color="#FF4333" />
+			<stop offset="0.714" stop-color="#FF3733" />
+			<stop offset="1" stop-color="#FF3333" />
+		</linearGradient>
+		<linearGradient id="paint1_linear_1957_14" x1="479.618" y1="424.998" x2="203.617" y2="210.998"
+			gradientUnits="userSpaceOnUse">
+			<stop stop-color="#BF3338" />
+			<stop offset="1" stop-color="#FF3333" />
+		</linearGradient>
+		<linearGradient id="paint2_linear_1957_14" x1="470.614" y1="382.844" x2="430.614" y2="340.844"
+			gradientUnits="userSpaceOnUse">
+			<stop stop-color="#FF6533" />
+			<stop offset="0.157" stop-color="#FF5633" />
+			<stop offset="0.434" stop-color="#FF4333" />
+			<stop offset="0.714" stop-color="#FF3733" />
+			<stop offset="1" stop-color="#FF3333" />
+		</linearGradient>
+		<linearGradient id="paint3_linear_1957_14" x1="397.889" y1="310.543" x2="409.889" y2="482.543"
+			gradientUnits="userSpaceOnUse">
+			<stop stop-color="#FF6533" />
+			<stop offset="0.157" stop-color="#FF5633" />
+			<stop offset="0.434" stop-color="#FF4333" />
+			<stop offset="0.714" stop-color="#FF3733" />
+			<stop offset="1" stop-color="#FF3333" />
+		</linearGradient>
+		<linearGradient id="paint4_linear_1957_14" x1="449.875" y1="385.791" x2="393.057" y2="347.154"
+			gradientUnits="userSpaceOnUse">
+			<stop stop-color="#FBB040" />
+			<stop offset="1" stop-color="#FB8840" />
+		</linearGradient>
+		<linearGradient id="paint5_linear_1957_14" x1="391.667" y1="604.242" x2="449.667" y2="-33.758"
+			gradientUnits="userSpaceOnUse">
+			<stop stop-color="white" />
+			<stop offset="1" stop-color="white" stop-opacity="0" />
+		</linearGradient>
+	</defs>
+</svg>
diff --git a/test/form/samples/emit-asset-file/main.js b/test/form/samples/emit-asset-file/main.js
@@ -1,4 +1,5 @@
 import logo from './logo.svg';
+import logoReverse from "./logo_reverse'.svg"
 
 function showImage(url) {
 	console.log(url);
@@ -10,3 +11,4 @@ function showImage(url) {
 }
 
 showImage(logo);
+showImage(logoReverse);

Original file line number	Diff line number	Diff line change
`@@ -24,7 +24,7 @@ module.exports = defineTest({`
`24`	`24`	`},`
`25`	`25`	`generateBundle(options, outputBundle) {`
`26`	`26`	`const keys = Object.keys(outputBundle);`
`27`		`- assert.strictEqual(keys.length, 2);`
	`27`	`+ assert.strictEqual(keys.length, 3);`
`28`	`28`	`assert.strictEqual(keys[0], 'assets/logo-zDlmrXar.svg');`
`29`	`29`	`const asset = outputBundle[keys[0]];`
`30`	`30`	`assert.strictEqual(asset.fileName, 'assets/logo-zDlmrXar.svg');`
`@@ -37,7 +37,8 @@ module.exports = defineTest({`
`37`	`37`	`source.equals(readFileSync(path.resolve(__dirname, 'logo.svg'))),`
`38`	`38`	`'asset has correct source'`
`39`	`39`	`);`
`40`		- assert.ok(keys[1].endsWith('.js'), `${keys[1]} ends with ".js"`);
	`40`	+ assert.ok(keys[1].endsWith('.svg'), `${keys[1]} ends with ".svg"`);
	`41`	+ assert.ok(keys[2].endsWith('.js'), `${keys[2]} ends with ".js"`);
`41`	`42`	`}`
`42`	`43`	`}`
`43`	`44`	`]`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`import logo from './logo.svg';`
	`2`	`+import logoReverse from "./logo_reverse'.svg"`
`2`	`3`
`3`	`4`	`function showImage(url) {`
`4`	`5`	`console.log(url);`
`@@ -10,3 +11,4 @@ function showImage(url) {`
`10`	`11`	`}`
`11`	`12`
`12`	`13`	`showImage(logo);`
	`14`	`+showImage(logoReverse);`