fix(client): replace decodeHTMLEntities to entities package

client/package-lock.json

@@ -5189,9 +5189,9 @@
       }
     },
     "entities": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
-      "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
+      "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
     },
     "envify": {
       "version": "4.1.0",

client/package.json

@@ -19,6 +19,7 @@
     "browser-cookies": "^1.2.0",
     "chai": "^4.2.0",
     "date-fns": "^1.29.0",
+    "entities": "^1.1.2",
     "enzyme": "^3.6.0",
     "enzyme-adapter-react-16": "^1.5.0",
     "fetchr": "^0.5.37",

client/src/templates/Challenges/classic/Show.js

@@ -39,8 +39,6 @@ import {
 import './classic.css';
 import '../components/test-frame.css';
 
-import decodeHTMLEntities from '../../../../utils/decodeHTMLEntities';
-
 const mapStateToProps = createStructuredSelector({
   files: challengeFilesSelector,
   tests: challengeTestsSelector,
@@ -237,7 +235,7 @@ class ShowClassic extends Component {
 * Your test output will go here.
 */
 `}
-        output={decodeHTMLEntities(output)}
+        output={output}
       />
     );
   }

client/src/templates/Challenges/components/Output.js

@@ -1,6 +1,7 @@
 import React, { Fragment, Component } from 'react';
 import PropTypes from 'prop-types';
 import MonacoEditor from 'react-monaco-editor';
+import { decodeHTML } from 'entities';
 
 const propTypes = {
   defaultOutput: PropTypes.string,
@@ -51,7 +52,7 @@ class Output extends Component {
           editorDidMount={::this.editorDidMount}
           height={height}
           options={options}
-          value={output ? output : defaultOutput}
+          value={decodeHTML(output ? output : defaultOutput)}
         />
       </Fragment>
     );

client/src/templates/Challenges/redux/execute-challenge-saga.js

@@ -148,7 +148,9 @@ function* executeTests(testRunner) {
         throw err;
       }
     } catch (err) {
-      newTest.message = text.replace(/<code>(.*?)<\/code>/g, '$1');
+      newTest.message = text
+        .replace(/<code>(.*?)<\/code>/g, '$1')
+        .replace(/<wbr>/g, '');
       if (err === 'timeout') {
         newTest.err = 'Test timed out';
         newTest.message = `${newTest.message} (${newTest.err})`;

client/utils/decodeHTMLEntities.js

@@ -1,27 +0,0 @@
-/*
- * Converts HTML entity codes in a string to the characters they represent.
- *
- * Example:
- * `decodeHTMLEntities('Beets & carrots');`
- * will return "Beets & carrots".
- *
- * The regex makes sure we only replace the HTML entities in the string.
- * For example, the regex would match "<" as well as ":".
- * The decoding works by setting the innerHTML of a dummy element and then
- * retrieving the innerText. Per the spec, innerText is a property that
- * represents the "rendered" text content of an element.
- *
- * See:
- * https://developer.mozilla.org/en-US/docs/Web/API/Node/innerText
- * https://developer.mozilla.org/en-US/docs/Glossary/Entity
- *
- */
-const decodeHTMLEntities = str => {
-  const el = document.createElement('div');
-  return str.replace(/&[#0-9a-z]+;/gi, enc => {
-    el.innerHTML = enc;
-    return el.innerText;
-  });
-};
-
-export default decodeHTMLEntities;