Convert HTML Entities - not sure why this fails all test cases

Tell us what’s happening:
When I run each case manually, the output looks identical to the expected result. I m not sure why none of the case pass.

Your code so far


function convertHTML(str) {
  // :)

  let arr = [];

  str.split('').map(
    c=>{
      switch (c) {
        case '&':
          arr.push('&​amp;');
          break;
        case '<':
          arr.push('&​lt;');
          break;
        case '>':
          arr.push('&​gt;');
          break;
        case '"':
          arr.push('&​quot;');
          break;
        case "'":
          arr.push('&​apos;');
          break;
        default:
          arr.push(c);
      }
    }
  );

  return arr.join('');
}

console.log(convertHTML("Dolce & Gabbana")); //Dolce &​amp; Gabbana

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities

I think you have hidden characters from copy/pasting the HTML entities. Try rewriting the HTML entities manually.

Yes, type your html entities instead of pasting them

But that is an horrible way to use map(). If you want to do that, use an other method. Documentations below with a suggestion. (Change the callback function, or change the method… if you keep map and use it correctly you can even chain everything together without declaring a new variable)


I think some of the html codes are not what appear on the screen. For example, I delete and re-type just the & character and it passes some of the cases.

I m not understanding about the comment on ‘horrible way to use the map function’? Which part is horrible? The fact that it pushes to another array? I got that from another freecodecamp solution so I thought it is the way to do it.

Map returns an array of what you return in the function. Your code has an array of undefined ripetuted multiple times
The way your code is structured it needs a forEach() which execute a function for each element. The thing is that using map without exploiting the returned array you are making your code use more memory for no reason

Using map, and actually exploiting its characteristics, one solution is:

function convertHTML(str) {
 return  str.split('').map(
    c=>{
      switch (c) {
        case '&':
          return '&​amp;';
        case '<':
          return '&​lt;';
        case '>':
          return '&​gt;';
        case '"':
          return '&​quot;';
        case "'":
          return '&​apos;';
        default:
          return c;
      }
    }
  ).join('');
}

console.log(convertHTML("Dolce & Gabbana"));