Fix translated glossary links (#17734)

* npm start should be ja

* Add special handling for glossary headings

* Don't sort glossary

* Use English slug to maintain anchor, re-add sort

Author: JasonEtco

lib/get-english-headings.js

@@ -4,11 +4,22 @@ const headingRegex = /^###?#? (.*?)$/gm
 // for any translated page, first get corresponding English markdown
 // then get the headings on both the translated and English pageMap
 // finally, create a map of translation:English for all headings on the page
-module.exports = function getEnglishHeadings (page, pageMap) {
+module.exports = function getEnglishHeadings (page, context) {
+  // Special handling for glossaries, because their headings are
+  // generated programatically.
+  if (page.relativePath.endsWith('/github-glossary.md')) {
+    // Return an object of `{ localized-term: english-slug }`
+    const languageGlossary = context.site.data.glossaries.external
+    return languageGlossary.reduce((prev, curr) => {
+      prev[curr.term] = curr.slug
+      return prev
+    }, {})
+  }
+
   const translatedHeadings = page.markdown.match(headingRegex)
   if (!translatedHeadings) return
 
-  const englishPage = pageMap[`/en/${page.relativePath.replace(/.md$/, '')}`]
+  const englishPage = context.pages[`/en/${page.relativePath.replace(/.md$/, '')}`]
   if (!englishPage) return
 
   // FIX  there may be bugs if English headings are updated before Crowdin syncs up :/

lib/page.js

@@ -138,7 +138,7 @@ class Page {
   async _render (context) {
     // use English IDs/anchors for translated headings, so links don't break (see #8572)
     if (this.languageCode !== 'en') {
-      const englishHeadings = getEnglishHeadings(this, context.pages)
+      const englishHeadings = getEnglishHeadings(this, context)
       context.englishHeadings = englishHeadings
     }
 

lib/site-data.js

@@ -36,13 +36,18 @@ module.exports = function loadSiteData () {
     }
   }
 
-  // Sort glossary by language-specific function
   for (const language of Object.values(languages)) {
-    if (language.code === 'en') continue
-    siteData[language.code].site.data.glossaries.external
-      .sort(
+    // Add the English `slug` to each item, to link a consistent anchor
+    siteData[language.code].site.data.glossaries.external.forEach((item, i) => {
+      item.slug = siteData.en.site.data.glossaries.external[i].term
+    })
+
+    // Sort glossary by language-specific function
+    if (language.code !== 'en') {
+      siteData[language.code].site.data.glossaries.external.sort(
         (a, b) => a.term.localeCompare(b.term, language.code)
       )
+    }
   }
 
   return siteData

package.json

@@ -161,7 +161,7 @@
     "website-scraper": "^4.2.0"
   },
   "scripts": {
-    "start": "cross-env NODE_ENV=development ENABLED_LANGUAGES='en,cn' nodemon server.js",
+    "start": "cross-env NODE_ENV=development ENABLED_LANGUAGES='en,ja' nodemon server.js",
     "dev": "npm start",
     "debug": "cross-env NODE_ENV=development ENABLED_LANGUAGES='en,ja' nodemon --inspect server.js",
     "rest-dev": "script/rest/update-files.js && npm run dev",