revert #871; fix unescape logic for Trans component

i18next · Aug 22, 2023 · 16a90ee · 16a90ee
1 parent 5fdd776
commit 16a90ee
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 15 deletions.
diff --git a/src/lexers/jsx-lexer.js b/src/lexers/jsx-lexer.js
@@ -135,18 +135,23 @@ export default class JsxLexer extends JavascriptLexer {
         } else entry[property.name.text] = true
       })
 
-      const nodeAsString = this.nodeToString.call(this, node, sourceText)
       const defaultsProp = getPropValue(tagNode, 'defaults')
-      let defaultValue = defaultsProp || nodeAsString
-      if (entry.shouldUnescape === true) {
+      let defaultValue =
+        defaultsProp || this.nodeToString.call(this, node, sourceText)
+
+      // If `shouldUnescape` is not true, it means the value cannot contain HTML entities,
+      // so we need to unescape these entities now so that they can be properly rendered later
+      if (entry.shouldUnescape !== true) {
         defaultValue = unescape(defaultValue)
       }
 
       if (defaultValue !== '') {
         entry.defaultValue = defaultValue
 
         if (!entry.key) {
-          entry.key = nodeAsString
+          // If there's no key, default to the unescaped default value to match react-i18next's behavior:
+          // https://github.com/i18next/react-i18next/blob/52d514c64ac15dadfe5cb263918c0d5ce06125e4/src/TransWithoutContext.js#L333
+          entry.key = unescape(entry.defaultValue)
         }
       }
 

diff --git a/test/lexers/jsx-lexer.test.js b/test/lexers/jsx-lexer.test.js
@@ -123,15 +123,6 @@ describe('JsxLexer', () => {
       done()
     })
 
-    it('extracts keys from Trans elements without an i18nKey, but with a defaults prop', (done) => {
-      const Lexer = new JsxLexer()
-      const content = '<Trans defaults="Steve">{{ name }}</Trans>'
-      assert.deepEqual(Lexer.extract(content), [
-        { key: '{{name}}', defaultValue: 'Steve' },
-      ])
-      done()
-    })
-
     it('extracts keys from Trans elements and ignores values of expressions and spaces', (done) => {
       const Lexer = new JsxLexer()
       const content = '<Trans count={count}>{{ key: property }}</Trans>'
@@ -452,12 +443,20 @@ describe('JsxLexer', () => {
         done()
       })
 
+      it('unescapes key when i18nKey is not provided', (done) => {
+        const Lexer = new JsxLexer()
+        const content = '<Trans>I&apos;m Cielquan</Trans>'
+        assert.equal(Lexer.extract(content)[0].key, "I'm Cielquan")
+        done()
+      })
+
       it('supports the shouldUnescape options', (done) => {
         const Lexer = new JsxLexer()
-        const content = '<Trans shouldUnescape>I&apros;m Cielquan</Trans>'
+        const content = '<Trans shouldUnescape>I&apos;m Cielquan</Trans>'
+        assert.equal(Lexer.extract(content)[0].key, "I'm Cielquan")
         assert.equal(
           Lexer.extract(content)[0].defaultValue,
-          'I&apros;m Cielquan'
+          'I&apos;m Cielquan'
         )
         done()
       })