Merge pull request #1873 from 11ty/zl/278

Adds `slugify` filter as a soft-replacement for `slug`

package.json

@@ -95,6 +95,7 @@
   "dependencies": {
     "@11ty/dependency-tree": "^2.0.0",
     "@iarna/toml": "^2.2.5",
+    "@sindresorhus/slugify": "^1.1.2",
     "browser-sync": "^2.26.14",
     "chalk": "^4.1.0",
     "chokidar": "^3.5.1",

src/Filters/Slug.js

@@ -1,8 +1,8 @@
 const slugify = require("slugify");
 
-module.exports = function(str) {
-  return slugify(str, {
+module.exports = function(str, options = {}) {
+  return slugify(str, Object.assign({
     replacement: "-",
     lower: true
-  });
+  }, options));
 };

src/Filters/Slugify.js

@@ -0,0 +1,7 @@
+const slugify = require("@sindresorhus/slugify");
+
+module.exports = function(str, options = {}) {
+  return slugify(str, Object.assign({
+    decamelize: false
+  }, options));
+};

src/defaultConfig.js

@@ -1,11 +1,15 @@
 const urlFilter = require("./Filters/Url");
 const serverlessUrlFilter = require("./Filters/ServerlessUrl");
 const slugFilter = require("./Filters/Slug");
+const slugifyFilter = require("./Filters/Slugify");
 const getCollectionItem = require("./Filters/GetCollectionItem");
 
 module.exports = function (config) {
   let eleventyConfig = this;
+
   config.addFilter("slug", slugFilter);
+  config.addFilter("slugify", slugifyFilter);
+
   config.addFilter("url", function (url, pathPrefixOverride) {
     let pathPrefix =
       pathPrefixOverride || eleventyConfig.getConfig().pathPrefix;

test/TemplateTest.js

@@ -593,70 +593,6 @@ test("Clone the template", async (t) => {
   t.is(cloned.extensionMap, tmpl.extensionMap);
 });
 
-test("Permalink with variables!", async (t) => {
-  let tmpl = getNewTemplate(
-    "./test/stubs/permalinkdata.njk",
-    "./test/stubs/",
-    "./dist"
-  );
-
-  t.is(await tmpl.getOutputPath(), "./dist/subdir/slug-candidate/index.html");
-});
-
-test("Permalink with variables and JS front matter!", async (t) => {
-  let tmpl = getNewTemplate(
-    "./test/stubs/permalinkdata-jsfn.njk",
-    "./test/stubs/",
-    "./dist"
-  );
-
-  t.is(await tmpl.getOutputPath(), "./dist/subdir/slug/index.html");
-});
-
-// This is broken right now, permalink must use the same template language as the template
-test.skip("Use a JavaScript function for permalink in any template language", async (t) => {
-  let tmpl = getNewTemplate(
-    "./test/stubs/permalinkdata-jspermalinkfn.njk",
-    "./test/stubs/",
-    "./dist"
-  );
-
-  t.is(await tmpl.getOutputPath(), "./dist/subdir/slug/index.html");
-});
-
-test("Permalink with dates!", async (t) => {
-  let tmpl = getNewTemplate(
-    "./test/stubs/permalinkdate.liquid",
-    "./test/stubs/",
-    "./dist"
-  );
-
-  t.is(await tmpl.getOutputPath(), "./dist/2016/01/01/index.html");
-});
-
-test("Permalink with dates on file name regex!", async (t) => {
-  let tmpl = getNewTemplate(
-    "./test/stubs/2016-02-01-permalinkdate.liquid",
-    "./test/stubs/",
-    "./dist"
-  );
-
-  t.is(await tmpl.getOutputPath(), "./dist/2016/02/01/index.html");
-});
-
-test("Reuse permalink in directory specific data file", async (t) => {
-  let eleventyConfig = new TemplateConfig();
-  let dataObj = new TemplateData("./test/stubs/", eleventyConfig);
-  let tmpl = getNewTemplate(
-    "./test/stubs/reuse-permalink/test1.liquid",
-    "./test/stubs/",
-    "./dist",
-    dataObj
-  );
-
-  t.is(await tmpl.getOutputPath(), "./dist/2016/01/01/index.html");
-});
-
 test("mapDataAsRenderedTemplates", async (t) => {
   let tmpl = getNewTemplate(
     "./test/stubs/default.ejs",

test/TemplateTest_Permalink.js

@@ -1,5 +1,7 @@
 const test = require("ava");
 const fs = require("fs");
+const TemplateConfig = require("../src/TemplateConfig");
+const TemplateData = require("../src/TemplateData");
 
 const getNewTemplate = require("./_getNewTemplateForTests");
 
@@ -122,3 +124,108 @@ test("Disable dynamic permalinks", async (t) => {
   t.is(await tmpl.getOutputLink(), "/{{justastring}}/index.html");
   t.is(await tmpl.getOutputHref(), "/{{justastring}}/");
 });
+
+
+test("Permalink with variables!", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/stubs/permalinkdata.njk",
+    "./test/stubs/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/subdir/slug-candidate/index.html");
+});
+
+test("Permalink with variables and JS front matter!", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/stubs/permalinkdata-jsfn.njk",
+    "./test/stubs/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/subdir/slug/index.html");
+});
+
+// This is broken right now, permalink must use the same template language as the template
+test.skip("Use a JavaScript function for permalink in any template language", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/stubs/permalinkdata-jspermalinkfn.njk",
+    "./test/stubs/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/subdir/slug/index.html");
+});
+
+test("Permalink with dates!", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/stubs/permalinkdate.liquid",
+    "./test/stubs/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/2016/01/01/index.html");
+});
+
+test("Permalink with dates on file name regex!", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/stubs/2016-02-01-permalinkdate.liquid",
+    "./test/stubs/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/2016/02/01/index.html");
+});
+
+test("Reuse permalink in directory specific data file", async (t) => {
+  let eleventyConfig = new TemplateConfig();
+  let dataObj = new TemplateData("./test/stubs/", eleventyConfig);
+  let tmpl = getNewTemplate(
+    "./test/stubs/reuse-permalink/test1.liquid",
+    "./test/stubs/",
+    "./dist",
+    dataObj
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/2016/01/01/index.html");
+});
+
+test("Using slugify filter!", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/slugify-filter/test.njk",
+    "./test/slugify-filter/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/subdir/slug-love-candidate-lyublyu/index.html");
+});
+
+test("Using slugify filter with comma and apostrophe", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/slugify-filter/comma.njk",
+    "./test/slugify-filter/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/subdir/hi-i-m-zach/index.html");
+});
+
+test("Using slug filter with options params", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/slugify-filter/slug-options.njk",
+    "./test/slugify-filter/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/subdir/hi_i_am_zach/index.html");
+});
+
+test("Using slugify filter with options params", async (t) => {
+  let tmpl = getNewTemplate(
+    "./test/slugify-filter/slugify-options.njk",
+    "./test/slugify-filter/",
+    "./dist"
+  );
+
+  t.is(await tmpl.getOutputPath(), "./dist/subdir/hi-i-m-z-ach/index.html");
+});

test/slugify-filter/comma.njk

@@ -0,0 +1,5 @@
+---
+title: "Hi, I'm ZAch"
+permalink: subdir/{{ title | slugify }}/index.html
+---
+Slugged.

test/slugify-filter/slug-options.njk

@@ -0,0 +1,5 @@
+---
+title: "Hi, I am ZAch"
+permalink: "subdir/{{ title | slug({replacement:'_'}) }}/index.html"
+---
+Slugged.

test/slugify-filter/slugify-options.njk

@@ -0,0 +1,5 @@
+---
+title: "Hi, I'm ZAch"
+permalink: "subdir/{{ title | slugify({decamelize: true}) }}/index.html"
+---
+Slugged.

test/slugify-filter/test.njk

@@ -0,0 +1,5 @@
+---
+title: _Slug ♥ CANDIDATE люблю $#%-
+permalink: subdir/{{ title | slugify }}/index.html
+---
+Slugged.