Cannot pass test for translating titles in American British Translator

[jacklmbrt07]

Tell us what’s happening:
my code passes every test except for translating Titles such as “Mr.” to “Mr” even though it does in practice locally. It also capitalizes it just as the given FCC project does. What is wrong with the test or what am I missing?

my replit source code: https://repl.it/@jacklmbrt07/american-british-english-translator#components/translator.js
my github repository: https://github.com/jacklmbrt07/american-british-english-translator

Your code so far
Snippet of that code that gets executed (American to British):

    var titleRegex = /(mr|mrs|ms|mx|dr|prof)\s/gi;
    var titles = translation.match(titleRegex);
    if (titles) {
      titles.forEach((title) => {
        translation = translation.replace(
          title,
          `<span class="highlight">${(title.charAt(0).toUpperCase() + title.slice(1)).replace(" ", ".")}</span> `
        );
      });
    }

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 11_1_0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.101 Safari/537.36.

Challenge: American British Translator

[ofk8vb]

So here is there reason given by freeCodeCamp tester as to why you are not passing the test:

Error: expected { Object (text, translation) } to deeply equal { Object (text, translation) }

So when I inspect the element inside Google Chrome I figured out why you were failing the test.

Basically you are leaving a blank after removing the ‘.’ from the title. Which leaves a blank space inside the span tag.
You should also remove the blank space after removing the ‘.’ to reach deep equality.

For example:

freeCodeCamp tester is asking for:
'<span class="highlight">Dr</span> Grosh will see you now.'

But you are providing:
'<span class="highlight">Dr </span> Grosh will see you now.'

Do you see the blank after the ‘Dr’ word?

This seems like a simple fix on your part

[jacklmbrt07]

Solved. I was using a RegEx which included a matching space, so it was adding a space in between the span for titles in American to British. Simple fix was to just remove it, I originally put the “/s” to capture all titles only being used in the middle of a sentence and to avoid ones at the end, but I guess that is a rare occasion. Thank you @ofk8vb !

New working code:

    var titleRegex = /(mr|mrs|ms|mx|dr|prof)\./gi;
    var titles = translation.match(titleRegex);
    if (titles) {
      titles.forEach((title) => {
        translation = translation.replace(
          title,
          `<span class="highlight">${(title.charAt(0).toUpperCase() + title.slice(1)).replace(".", "")}</span>`
        );
      });
    }