fix: escape MDX characters in changelog (Docusaurus v3) (#1184)

Author: barjin

apify-docs-theme/src/markdown.js

@@ -1,12 +1,13 @@
 function updateChangelog(changelog) {
-    changelog = addHeader(changelog);
+    changelog = addFrontmatter(changelog);
     changelog = pushHeadings(changelog);
-    changelog = linkUsers(changelog);
-    changelog = linkPRs(changelog);
+    changelog = fixUserLinks(changelog);
+    changelog = fixPRLinks(changelog);
+    changelog = escapeMDXCharacters(changelog);
     return changelog;
 }
 
-function addHeader(changelog, header = 'Changelog') {
+function addFrontmatter(changelog, header = 'Changelog') {
     return `---
 title: ${header}
 sidebar_label: ${header}
@@ -19,14 +20,22 @@ function pushHeadings(changelog) {
     return changelog.replaceAll(/\n#[^#]/g, '\n## ');
 }
 
-function linkUsers(changelog) {
+function fixUserLinks(changelog) {
     return changelog.replaceAll(/by @([a-zA-Z0-9-]+)/g, 'by [@$1](https://github.com/$1)');
 }
 
-function linkPRs(changelog) {
+function fixPRLinks(changelog) {
     return changelog.replaceAll(/(((https?:\/\/)?(www.)?)?github.com\/[^\s]*?\/pull\/([0-9]+))/g, '[#$5]($1)');
 }
 
+function escapeMDXCharacters(changelog) {
+    return changelog.replaceAll(/<|>/g, (match) => {
+        return match === '<' ? '&lt;' : '&gt;';
+    }).replaceAll(/\{|\}/g, (match) => {
+        return match === '{' ? '&#123;' : '&#125;';
+    });
+}
+
 module.exports = {
     updateChangelog,
 };

apify-docs-theme/src/theme.js

@@ -25,7 +25,7 @@ function findPathInParentOrThrow(endPath) {
     return filePath;
 }
 
-async function copyChangelogFromReleases(paths, repo) {
+async function generateChangelogFromGitHubReleases(paths, repo) {
     const response = await axios.get(`https://api.github.com/repos/${repo}/releases`);
     const releases = response.data;
 
@@ -81,6 +81,12 @@ function theme(
                     ),
                 ];
 
+                if (options.changelogFromRoot) {
+                    copyChangelogFromRoot(pathsToCopyChangelog);
+                } else {
+                    await generateChangelogFromGitHubReleases(pathsToCopyChangelog, `${context.siteConfig.organizationName}/${context.siteConfig.projectName}`);
+                }
+
                 for (const p of pathsToCopyChangelog) {
                     // the changelog page has to exist for the sidebar to work - async loadContent() is (apparently) not awaited for by sidebar
                     if (fs.existsSync(path.join(p, 'changelog.md'))) continue;
@@ -92,12 +98,6 @@ It seems that the changelog is not available.
 This either means that your Docusaurus setup is misconfigured, or that your GitHub repository contains no releases yet.
 `);
                 }
-
-                if (options.changelogFromRoot) {
-                    copyChangelogFromRoot(pathsToCopyChangelog);
-                } else {
-                    await copyChangelogFromReleases(pathsToCopyChangelog, `${context.siteConfig.organizationName}/${context.siteConfig.projectName}`);
-                }
             } catch (e) {
                 // eslint-disable-next-line no-console
                 console.warn(`Changelog page could not be initialized: ${e.message}`);