Repository: 11ty/eleventy
Pull request #3276 (2024-05-03 21:31:37)

Allow inputPathToUrl to handle hashes (#anchor)
This PR should allow the [inputPathToUrl filter](https://www.11ty.dev/docs/filters/inputpath-to-url/) and the [input path to URL plugin](https://www.11ty.dev/docs/plugins/inputpath-to-url/) to handle hashes `#anchors`.  

Example, `my-blog-post.md#anchor` can become `/gh-pages/my-blog-post/#anchor`.  


Patch:
diff --git a/src/Plugins/InputPathToUrl.js b/src/Plugins/InputPathToUrl.js
index a6ba0c17..d3722081 100644
--- a/src/Plugins/InputPathToUrl.js
+++ b/src/Plugins/InputPathToUrl.js
@@ -22,6 +22,16 @@ function normalizeInputPath(inputPath, inputDir, contentMap) {
 	return inputPath;
 }
 
+function splitFilePath(filepath) {
+	let hash = "";
+	let splitUrl = filepath.split("#");
+	if (splitUrl.length > 1) {
+		hash = "#" + splitUrl[1];
+		filepath = splitUrl[0];
+	}
+	return [hash, filepath];
+}
+
 function FilterPlugin(eleventyConfig) {
 	let contentMap;
 	eleventyConfig.on("eleventy.contentMap", function ({ inputPathToUrl }) {
@@ -34,6 +44,8 @@ function FilterPlugin(eleventyConfig) {
 		}
 
 		let inputDir = eleventyConfig.directories.input;
+		let hash = "";
+		[hash, filepath] = splitFilePath(filepath);
 		filepath = normalizeInputPath(filepath, inputDir, contentMap);
 
 		let urls = contentMap[filepath];
@@ -41,7 +53,7 @@ function FilterPlugin(eleventyConfig) {
 			throw new Error("`inputPathToUrl` filter could not find a matching target for " + filepath);
 		}
 
-		return urls[0];
+		return `${urls[0]}${hash}`;
 	});
 }
 
@@ -63,15 +75,18 @@ function TransformPlugin(eleventyConfig, defaultOptions = {}) {
 			throw new Error("Internal error: contentMap not available for the `pathToUrl` Transform.");
 		}
 		let inputDir = eleventyConfig.directories.input;
+
+		let hash = "";
+		[hash, filepathOrUrl] = splitFilePath(filepathOrUrl);
 		filepathOrUrl = normalizeInputPath(filepathOrUrl, inputDir, contentMap);
 
 		let urls = contentMap[filepathOrUrl];
 		if (!urls || urls.length === 0) {
 			// fallback, transforms don’t error on missing paths (though the pathToUrl filter does)
-			return filepathOrUrl;
+			return `${filepathOrUrl}${hash}`;
 		}
 
-		return urls[0];
+		return `${urls[0]}${hash}`;
 	});
 }
 


Test patch:
diff --git a/test/InputPathToUrlPluginTest.js b/test/InputPathToUrlPluginTest.js
index 57c32a14..ddf050f7 100644
--- a/test/InputPathToUrlPluginTest.js
+++ b/test/InputPathToUrlPluginTest.js
@@ -18,6 +18,7 @@ const OUTPUT_HTML_STD = `<!doctype html>
 <body>
 <a href="/">Home</a>
 <a href="/tmpl/">Test</a>
+<a href="/tmpl/#anchor">Anchor</a>
 </body>
 </html>`;
 
@@ -34,6 +35,7 @@ const OUTPUT_HTML_BASE = `<!doctype html>
 <body>
 <a href="/gh-pages/">Home</a>
 <a href="/gh-pages/tmpl/">Test</a>
+<a href="/gh-pages/tmpl/#anchor">Anchor</a>
 </body>
 </html>`;
 
diff --git a/test/stubs-pathtourl/filter.njk b/test/stubs-pathtourl/filter.njk
index 0be9b519..58545a23 100644
--- a/test/stubs-pathtourl/filter.njk
+++ b/test/stubs-pathtourl/filter.njk
@@ -11,5 +11,6 @@
 <body>
 <a href="/">Home</a>
 <a href="{{ 'tmpl.njk' | inputPathToUrl }}">Test</a>
+<a href="{{ 'tmpl.njk#anchor' | inputPathToUrl }}">Anchor</a>
 </body>
 </html>
\ No newline at end of file
diff --git a/test/stubs-pathtourl/transform.njk b/test/stubs-pathtourl/transform.njk
index 8073f9b0..c4175a18 100644
--- a/test/stubs-pathtourl/transform.njk
+++ b/test/stubs-pathtourl/transform.njk
@@ -11,5 +11,6 @@
 <body>
 <a href="/">Home</a>
 <a href="tmpl.njk">Test</a>
+<a href="tmpl.njk#anchor">Anchor</a>
 </body>
 </html>
\ No newline at end of file