fix(challenges): change test for template literals challenge

[scissorsneedfoodtoo]

Pre-Submission Checklist

• Your pull request targets the dev branch of curriculum.
• Branch starts with either fix/, feature/, or translate/ (e.g. fix/signin-issue)
• You have only one commit (if not, squash them into one commit).
• All new and existing tests pass the command npm test. Use git commit --amend to amend any fixes.

Type of Change

• Small bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds new functionality)
• Breaking change (fix or feature that would change existing functionality)
• Add new translation (feature adding new translations)

Checklist:

• Tested changes locally.
• Addressed currently open issue (replace XXXXX with an issue no in next line)

Closes freeCodeCamp/freeCodeCamp#16358

Description

The original test was too rigid, and many users were forced to use one solution, usually map, to
complete the challenge. The test is changed here to allow for multiple solutions to the problem,
including the use of either single or double quotes when naming a class.

Here's a link to regexr with the new regex test and different solutions user's can submit: https://regexr.com/3rdvo

BREAKING CHANGE:
None

[beaucarnes]

Looks good, thanks!

[scissorsneedfoodtoo]

@beaucarnes, thanks for the review and merge!

[numoonchld]

Test still doesn't pass for me when using arr[0], arr[1] and arr[2] as the templates within``

[scissorsneedfoodtoo]

@numoonchld, yes, you're right. This fix was just merged yesterday, so it will take a little while for the live site to be updated to include it. We'll get on it soon!

[numoonchld]

thank you

[ghost]

hi there it has been 13 days since update but i am having the same issues or rather omore. i will post the code here if that is ok.

----- start of code -----

// change code below this line
// tried a for loop and it seems like it did not accept it. and tried creating it manually indexing arr[0] [1] and [2] but that also throws errors. after a bit of googling i decided to try map and still getting problems

// attempt 1 - invalid regular expression flags
/*
const resultDisplayArray = [];
for (let i = 0; i < arr.length; i++) {
resultDisplayArray.push(<li class="text-warning">${arr[i]}</li>)
}
*/

// attempt 2 - invalid regular expression flags
/*
const resultDisplayArray = [
<li class="text-warning">${arr[0]}</li>,
<li class="text-warning">${arr[1]}</li>,
<li class="text-warning">${arr[2]}</li>
];
*/

//attempt 3 - invalid regular expression flags
/*
const resultDisplayArray = arr.map((a) => {
return <li class="text-warning">${a}</li>
});
*/
// attempt 4 - invalid regular expression flags
//const resultDisplayArray = arr.map(a => <li class="text-warning">${a}</li>);
// change code above this line

----- end of code -----

[thevenice]

my attempts
//1st
const resultDisplayArray =[];
arr.map((x) =>{return resultDisplayArray.push(<li class="text-warning">${x}</li>);});
//works on console not in fcc, error : " Invalid regular expression flags ".

//2nd
const resultDisplayArray = arr.map(x =><li class="text-warning">${x}</li> );
//same works on console not in fcc, error : " Invalid regular expression flags ".

[johnkennedy9147]

@DecaDoesRust @thevenice see issue #135

[thevenice]

So youre saying that '/' this character mighy be the problem, then what should i use to display ? And pass this test.

[johnkennedy9147]

@thevenice I'm saying the tests are wrong

[thevenice]

What should i do know

[johnkennedy9147]

@thevenice it is not possible to pass the third test at the moment as the test is broken, however, looking at what you posted in your examples it would fail anyway as you are not using template literals. The lesson could do with improvement as it introduces multiple things at once and doesnt spend enough time making clear what a template literal is. I'll make some edits to clarify the lesson.

I think reading this MDN page MDN:Tempate Literals would help you a lot.

Follow #135 to see when the issues are resolved and you can come back to the challenge once it is fixed.

[thevenice]

Dude you really didn't know that back ticks didn't work on comments
Using back ticks: here.
See it will show you marked.

[thevenice]

If you have time just look this pictures both the code are working in chrome console but not in FCC.
https://twitter.com/Thevenicelive/status/1017285470571491328?s=19