Escape ` inside img alt descriptions

src/doc_builder/convert_md_to_mdx.py

@@ -80,6 +80,31 @@ def convert_img_links(text, page_info):
     return text
 
 
+_re_md_img_tag_alt = re.compile(r"!\[([^\]]+)\]", re.I)
+
+
+def escape_img_alt_description(text):
+    """
+    Escapes ` with ' inside <img> alt description since it causes svelte/mdsvex compiler error.
+    """
+
+    def replace_alt_content(match):
+        alt_content = match.group(1)
+        new_alt_content = alt_content.replace("`", "'")
+        return match.group(0).replace(alt_content, new_alt_content)
+
+    if _re_md_img_tag_alt.search(text):
+        text = _re_md_img_tag_alt.sub(replace_alt_content, text)
+
+    return text
+
+
+def fix_img_links(text, page_info):
+    text = convert_img_links(text, page_info)
+    text = escape_img_alt_description(text)
+    return text
+
+
 def clean_doctest_syntax(text):
     """
     Clean the doctest artifacts in a given content.
@@ -156,13 +181,13 @@ def convert_md_docstring_to_mdx(docstring, page_info):
 def process_md(text, page_info):
     """
     Processes markdown by:
-        1. Converting include
-        2. Converting literalinclude
+        1. Convert include
+        2. Convert literalinclude
         3. Clean doctest syntax
-        4. Converting image links
+        4. Fix image links
     """
     text = convert_include(text, page_info)
     text = convert_literalinclude(text, page_info)
     text = clean_doctest_syntax(text)
-    text = convert_img_links(text, page_info)
+    text = fix_img_links(text, page_info)
     return text

tests/test_convert_md_to_mdx.py

@@ -22,6 +22,7 @@
     convert_include,
     convert_literalinclude,
     convert_md_to_mdx,
+    escape_img_alt_description,
     process_md,
 )
 
@@ -75,6 +76,23 @@ def test_convert_img_links(self):
             convert_img_links(img_html, page_info), '<img src="/docs/transformers/v4.10.0/fr/imgs/img.gif"/>'
         )
 
+    def test_escape_img_alt_description(self):
+        multiple_imgs_md = """![Animation exploring `model_args.pipeline_tag`](imgsrc)
+
+### Some heading
+
+![Animation exploring `model_args.pipeline_tag`](imgsrc)
+
+![Animation exploring model_args.pipeline_tag](imgsrc)"""
+        expected_conversion = """![Animation exploring 'model_args.pipeline_tag'](imgsrc)
+
+### Some heading
+
+![Animation exploring 'model_args.pipeline_tag'](imgsrc)
+
+![Animation exploring model_args.pipeline_tag](imgsrc)"""
+        self.assertEqual(escape_img_alt_description(multiple_imgs_md), expected_conversion)
+
     def test_process_md(self):
         page_info = {"package_name": "transformers", "version": "v4.10.0", "language": "fr"}