Fix inconsistencies in `slugify` between frontend and core implementation (#18297)

src/common/string/slugify.ts

@@ -1,19 +1,29 @@
 // https://gist.github.com/hagemann/382adfc57adbd5af078dc93feef01fe1
 export const slugify = (value: string, delimiter = "_") => {
   const a =
-    "àáäâãåăæąçćčđďèéěėëêęğǵḧìíïîįłḿǹńňñòóöôœøṕŕřßşśšșťțùúüûǘůűūųẃẍÿýźžż·/_,:;";
+    "àáâäæãåāăąçćčđďèéêëēėęěğǵḧîïíīįìıİłḿñńǹňôöòóœøōõőṕŕřßśšşșťțûüùúūǘůűųẃẍÿýžźż·";
-  const b = `aaaaaaaaacccddeeeeeeegghiiiiilmnnnnooooooprrsssssttuuuuuuuuuwxyyzzz${delimiter}${delimiter}${delimiter}${delimiter}${delimiter}${delimiter}`;
+  const b = `aaaaaaaaaacccddeeeeeeeegghiiiiiiiilmnnnnoooooooooprrsssssttuuuuuuuuuwxyyzzz${delimiter}`;
   const p = new RegExp(a.split("").join("|"), "g");
 
-  return value
+  let slugified;
-    .toString()
+
-    .toLowerCase()
+  if (value === "") {
-    .replace(/\s+/g, delimiter) // Replace spaces with delimiter
+    slugified = "";
-    .replace(p, (c) => b.charAt(a.indexOf(c))) // Replace special characters
+  } else {
-    .replace(/&/g, `${delimiter}and${delimiter}`) // Replace & with 'and'
+    slugified = value
-    .replace(/[^\w-]+/g, "") // Remove all non-word characters
+      .toString()
-    .replace(/-/g, delimiter) // Replace - with delimiter
+      .toLowerCase()
-    .replace(new RegExp(`(${delimiter})\\1+`, "g"), "$1") // Replace multiple delimiters with single delimiter
+      .replace(p, (c) => b.charAt(a.indexOf(c))) // Replace special characters
-    .replace(new RegExp(`^${delimiter}+`), "") // Trim delimiter from start of text
+      .replace(/(?<=\d),(?=\d)/g, "") // Remove Commas between numbers
-    .replace(new RegExp(`${delimiter}+$`), ""); // Trim delimiter from end of text
+      .replace(/[^a-z0-9]+/g, delimiter) // Replace all non-word characters
+      .replace(new RegExp(`(${delimiter})\\1+`, "g"), "$1") // Replace multiple delimiters with single delimiter
+      .replace(new RegExp(`^${delimiter}+`), "") // Trim delimiter from start of text
+      .replace(new RegExp(`${delimiter}+$`), ""); // Trim delimiter from end of text
+
+    if (slugified === "") {
+      slugified = "unknown";
+    }
+  }
+
+  return slugified;
 };

test/common/string/slugify.ts

@@ -6,12 +6,15 @@ describe("slugify", () => {
   assert.strictEqual(slugify("abc"), "abc");
   assert.strictEqual(slugify("ABC"), "abc");
   assert.strictEqual(slugify("abc DEF"), "abc_def");
+  assert.strictEqual(slugify("abc.DEF"), "abc_def");
+  assert.strictEqual(slugify("1`-=~!@#$%^&*()_+[];',./{}:\"<>?\\| aA"), "1_aa");
   assert.strictEqual(slugify("abc-DEF"), "abc_def");
   assert.strictEqual(slugify("abc_DEF"), "abc_def");
+  assert.strictEqual(slugify("1,1"), "11");
   assert.strictEqual(slugify("abc å DEF"), "abc_a_def");
   assert.strictEqual(slugify("abc:DEF"), "abc_def");
-  assert.strictEqual(slugify("abc&DEF"), "abc_and_def");
+  assert.strictEqual(slugify("abc&DEF"), "abc_def");
-  assert.strictEqual(slugify("abc^^DEF"), "abcdef");
+  assert.strictEqual(slugify("abc^^DEF"), "abc_def");
   assert.strictEqual(slugify("abc   DEF"), "abc_def");
   assert.strictEqual(slugify("_abc DEF"), "abc_def");
   assert.strictEqual(slugify("abc DEF_"), "abc_def");
@@ -20,6 +23,8 @@ describe("slugify", () => {
   assert.strictEqual(slugify("abc - DEF - ghi"), "abc_def_ghi");
   assert.strictEqual(slugify("abc---DEF---ghi"), "abc_def_ghi");
   assert.strictEqual(slugify("___abc___DEF___ghi___"), "abc_def_ghi");
+  assert.strictEqual(slugify("___"), "unknown");
+  assert.strictEqual(slugify(""), "");
 
   // With custom delimiter
   assert.strictEqual(slugify("abc def", "-"), "abc-def");