Markdown Previewer solution fails test 5 for code block despite functioning as intended

Hi All,

Wondering if someone can point me in the right direction to help me figure out where I’m going awry in my attempts to satisfy the requirements of test 5 for the Markdown Previewer challenge for the Front End Development certification projects.

Specifically, the test that is leading me to fail is

When my markdown previewer first loads, the default text in the #editor field should contain valid markdown that represents at least one of each of the following elements: a header (H1 size), a sub header (H2 size), a link, inline code, a code block, a list item, a blockquote, an image, and bolded text
write some markdown representing a codeblock, i.e.

: expected false to be true
AssertionError: write some markdown representing a codeblock, i.e.
: expected false to be true

My code pen is here: https://codepen.io/KevinCsCode/pen/wvELyQW

What is confusing me is that my initial input for the textarea contains lines as follows:

````
multiLineCodeBlock() {
  console.log('freeCodeCamp needs your support');
}
```

and my function for performing the markdown-preview (assuredly not the most elegant solution, but the best I could come up with) renders the following HTML associated to that block:

<pre><code>multiLineCodeBlock() {
console.log('freeCodeCamp needs your support');
}
</code></pre>

I am using Chrome (Version 111.0.5563.147, latest available version for me) to do this challenge. I have looked at the both the Elements and the Console in the Chrome dev tools and I cannot make sense as to why this output fails to meet the test criteria, since I see the above HTML being rendered within my #preview div.

As far as I can make out from the freeCodeCamp testing-info, the test should be passed once it is verified that the innerHtml of the #preview element includes a section of the form <pre><code>…<\pre><\code> (which condition I believe I have met, but maybe I am misreading/misunderstanding the intent of the test).

In case there was something finicky I was missing in relation to imports of packages, I have looked around the related help-topics on this forum, including

  • markdown-previewer-failed-test-5-6/487204/2
  • markdown-previewer-solution-fails-tests-5-and-6-despite-functioning-as-intended/484737/2

Unfortunately, neither one of the suggested fixes for those issues has caused my project to pass, so I can only assume that the problem is with my code.

I am probably doing something really stupid, but haven’t been able to figure out what that is after attempting this challenge over the course of several days and returning many times with fresh eyes. If anyone can rescue me from my own ignorance, that would be enormously appreciated.

So, played around a bit, and this seems to be the issue:

image

What I have highlighted there isn’t a valid character. It seems to be a spacer that you get after hitting enter for a new line in order to line the HTML up. When I deleted that and put a normal line return, your code seems to pass test 5.

As you say, that did the trick. Thank you so much for getting me unstuck!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.