Trans component's shouldUnescape does not unescape forward slash

[amagee]

🐛 Bug Report

If a value containing a forward slash is passed to the Trans component, it is not unescaped, but rather is output as /. Other HTML-escaped characters (eg. & ' " < >) are unescaped correctly.

To Reproduce

Sample code:

import "./styles.css";
import i18n from "i18next";
import { initReactI18next, Trans } from 'react-i18next'

i18n
  .use(initReactI18next)
  .init({
    resources: {
      en: {
        translation: {
          mySentence: "<0>{{ thing1 }}</0>"
        }
      }
    },
    lng: "en",
  });

export default function App() {
  return (
    <div className="App">
      <Trans
        i18nKey="mySentence"
        components={[
          <div>{{ thing1: "& < > ' \" /" }}</div>,
        ]}
        shouldUnescape={true}
      />
    </div>
  );
}

Code Sandbox link: https://codesandbox.io/s/blazing-cherry-q4g4z9?file=/src/App.js

Expected behavior

The output should look like & < > ' " /

Actual behaviour

The output looks like & < > ' " &#x2F;

Your Environment

• runtime version: node v16.1.1 (+ Code Sandbox)
• i18next version: 21.6.16
• os: Linux

Notes

The escaping seems to be done in i18next's utils.js - note that forward slash is included in _entityMap: https://github.com/i18next/i18next/blob/master/src/utils.js#L125

But the unescaping is done by html-escaper - https://github.com/WebReflection/html-escaper/blob/master/index.js which does not appear to know how to unescape &#x2F.

[adrai]

@cuyl can you give some feedback?

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.