Create Strings using Template Literals Not recognising template literal

JavaScript
1

Tell us what’s happening:
When I test it tells me everything is fine but that I’m not using template literals but I clearly am, no?

Your code so far


const result = {
  success: ["max-length", "no-amd", "prefer-arrow-functions"],
  failure: ["no-var", "var-on-top", "linebreak"],
  skipped: ["id-blacklist", "no-dup-keys"]
};
function makeList(arr) {
  "use strict";

  // change code below this line
  const resultDisplayArray = arr.map(element => {
    return `<li class="text-warning">${element}</li>`;
  });

  // change code above this line
  return resultDisplayArray;
}
/**
 * makeList(result.failure) should return:
 * [ <li class="text-warning">no-var</li>,
 *   <li class="text-warning">var-on-top</li>, 
 *   <li class="text-warning">linebreak</li> ]
 **/
const resultDisplayArray = makeList(result.failure);

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.62 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals

2

People have been reporting a bug for this test on these forums. Not sure if they found a workaround, but you may want to do a search for it.

3

FWIW I tried your code in the chrome debugger and it looks like everything should pass.

4

I have got the same bug actually and it’s really annoying.
Did you find any solution for that bug ?

I figured out some thoughts , so I just wanted to share them with you:
1- The website add an escape symbol \ before both of the double quotations for the class value; this is for security purposes and preventing XSS injection. I also tried the single quotation, but it didn’t pass the test, knowing that it didn’t have any escape symbols.

2- The expected result commented downside the code, refer to <li class="text-warning">no-var</li> that is not a part of a string, which means that the element is an actual html tag not a string that contains the html tag. So I tried to apply the React & JSX to return the tag, but didn’t know how to configure the environment.

Still I’m looking forward to know the solution for this problem.