fix(challenge-parser): display hanzi-pinyin pairs properly in quiz audio transcript (#66222)

tools/challenge-parser/parser/__fixtures__/with-chinese-quizzes.md

@@ -8,6 +8,24 @@
 
 Quiz 1, question 1 with `中文 (zhōng wén)`
 
+#### --audio--
+
+```json
+{
+  "audio": {
+    "filename": "7.3-1.mp3",
+    "startTimestamp": 24.7,
+    "finishTimestamp": 26.2
+  },
+  "transcript": [
+    {
+      "character": "Wang Hua",
+      "text": "你好 (nǐ hǎo)。"
+    }
+  ]
+}
+```
+
 #### --distractors--
 
 Quiz 1, question 1, distractor 1 with `中文 (zhōng wén)`

tools/challenge-parser/parser/plugins/add-quizzes.js

@@ -1,6 +1,9 @@
 const { root } = require('mdast-builder');
 const { getSection, getAllSections } = require('./utils/get-section');
-const { createMdastToHtml } = require('./utils/i18n-stringify');
+const {
+  createMdastToHtml,
+  parseHanziPinyinPairs
+} = require('./utils/i18n-stringify');
 
 const { splitOnThematicBreak } = require('./utils/split-on-thematic-break');
 
@@ -67,6 +70,22 @@ function plugin() {
             }
           });
 
+          // Convert hanzi-pinyin pairs in transcript text to HTML ruby elements
+          audioData.transcript = audioData.transcript.map(line => {
+            if (parseHanziPinyinPairs(line.text).length > 0) {
+              const nodes = [
+                {
+                  type: 'paragraph',
+                  children: [{ type: 'inlineCode', value: line.text }]
+                }
+              ];
+              const html = toHtml(nodes);
+              const innerHtml = html.replace(/^<p>|<\/p>$/g, '');
+              return { ...line, text: innerHtml };
+            }
+            return line;
+          });
+
           questionData.audioData = audioData;
         } catch (error) {
           if (error instanceof SyntaxError) {

tools/challenge-parser/parser/plugins/add-quizzes.test.js

@@ -124,6 +124,12 @@ describe('add-quizzes plugin', () => {
     expect(firstQuestion.answer).toBe(
       '<p>Quiz 1, question 1, answer with <ruby>中文<rp>(</rp><rt>zhōng wén</rt><rp>)</rp></ruby></p>'
     );
+    expect(firstQuestion.audioData.transcript).toEqual([
+      {
+        character: 'Wang Hua',
+        text: '<ruby>你好<rp>(</rp><rt>nǐ hǎo</rt><rp>)</rp></ruby>。'
+      }
+    ]);
   });
 
   it('should render Chinese in quizzes when lang is zh-CN and the text does not contain hanzi (pinyin) format', () => {