Repository: freeCodeCamp/freeCodeCamp
File: client/src/templates/Challenges/components/pinyin-to-hanzi-input.test.tsx (TypeScript)

Code before:

    expect(
      convertToHanzi('shen2me5', { hanzi: '什么', pinyin: 'shén me' })
    ).toBe('什么');
  });

  test('should convert long phrase properly', () => {
    const longPhrase = {
      hanzi: '请问你叫什么名字',
      pinyin: 'qǐng wèn nǐ jiào shén me míng zi'
    };
    expect(
      convertToHanzi('qing3 wen4 ni3 jiao4 shen2 me5 ming2 zi5', longPhrase)
    ).toBe('请 问 你 叫 什 么 名 字');
  });

  test('should handle uppercase input case-insensitively', () => {
    expect(convertToHanzi('NI3HAO3', { hanzi: '你好', pinyin: 'nǐ hǎo' })).toBe(
      '你好'
    );
    expect(convertToHanzi('Ni3hAO3', { hanzi: '你好', pinyin: 'nǐ hǎo' })).toBe(
      '你好'
    );
  });
  test('should convert "v" to "ü" and support tone marks', () => {
    // Correct tone gets converted to hanzi
    expect(convertToHanzi('nv3', { hanzi: '女', pinyin: 'nǚ' })).toBe('女');

    // Incorrect tones stay as pinyin
    expect(convertToHanzi('nv1', { hanzi: '女', pinyin: 'nǚ' })).toBe('nǖ');
    expect(convertToHanzi('nv2', { hanzi: '女', pinyin: 'nǚ' })).toBe('nǘ');
    expect(convertToHanzi('nv4', { hanzi: '女', pinyin: 'nǚ' })).toBe('nǜ');
    expect(convertToHanzi('nv5', { hanzi: '女', pinyin: 'nǚ' })).toBe('nü');
  });
});

describe('PinyinToHanziInput component', () => {
  test.each([
    [null, false],
    [true, false],
    [false, true]
  ])(
    'should have aria-invalid="%s" when isCorrect is %s',
    (isCorrect, expectedAriaInvalid) => {
      const expectedAnswer = { hanzi: '你好', pinyin: 'nǐ hǎo' };
      const mockOnChange = vi.fn();

      render(
        <PinyinToHanziInput
          index={0}
          expectedAnswer={expectedAnswer}

Review comment (suggestion):
```suggestion

  test('should convert "v" to "ü" and support tone marks', () => {
```

Code after:

    expect(
      convertToHanzi('shen2me5', { hanzi: '什么', pinyin: 'shén me' })
    ).toBe('什么');
  });

  test('should convert long phrase properly', () => {
    const longPhrase = {
      hanzi: '请问你叫什么名字',
      pinyin: 'qǐng wèn nǐ jiào shén me míng zi'
    };
    expect(
      convertToHanzi('qing3 wen4 ni3 jiao4 shen2 me5 ming2 zi5', longPhrase)
    ).toBe('请 问 你 叫 什 么 名 字');
  });

  test('should handle uppercase input case-insensitively', () => {
    expect(convertToHanzi('NI3HAO3', { hanzi: '你好', pinyin: 'nǐ hǎo' })).toBe(
      '你好'
    );
    expect(convertToHanzi('Ni3hAO3', { hanzi: '你好', pinyin: 'nǐ hǎo' })).toBe(
      '你好'
    );
  });

  test('should convert "v" to "ü" and support tone marks', () => {
    // Correct tone gets converted to hanzi
    expect(convertToHanzi('nv3', { hanzi: '女', pinyin: 'nǚ' })).toBe('女');

    // Incorrect tones stay as pinyin
    expect(convertToHanzi('nv1', { hanzi: '女', pinyin: 'nǚ' })).toBe('nǖ');
    expect(convertToHanzi('nv2', { hanzi: '女', pinyin: 'nǚ' })).toBe('nǘ');
    expect(convertToHanzi('nv4', { hanzi: '女', pinyin: 'nǚ' })).toBe('nǜ');
    expect(convertToHanzi('nv5', { hanzi: '女', pinyin: 'nǚ' })).toBe('nü');
  });
});

describe('PinyinToHanziInput component', () => {
  test.each([
    [null, false],
    [true, false],
    [false, true]
  ])(
    'should have aria-invalid="%s" when isCorrect is %s',
    (isCorrect, expectedAriaInvalid) => {
      const expectedAnswer = { hanzi: '你好', pinyin: 'nǐ hǎo' };
      const mockOnChange = vi.fn();

      render(
        <PinyinToHanziInput
          index={0}