Responsive Web Design: Technical Documentation Codepen Template Link Has Problem

Tell us what’s happening:
I think there is a weird issue with the codepen template link for the technical documentation project. I am not sure if it is only me, but I feel like whenever I use the template link, the test case would disappear and there are some weird behaviors like the HTML and CSS are not loaded in the codepen preview. Even I have refreshed the page, the test case still does not appear. So I duplicated the other code pen project and removed the codes and worked from there.

I only have this issue with Technical Documentation Codepen Template link. I do not have any issues with the other projects codepend Template link which is really weird.

So I decided to submit this ticket to inform you regarding this issue.

Your code so far
Nothing related to code. Codepen Template link issue

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.110 Safari/537.36

Challenge: Build a Technical Documentation Page

Link to the challenge:

The template link is the same for all projects, can you give your pen link?

Hi ilenia, Here is the link and you can take a look: https://codepen.io/ngl4/pen/RwLzLKm

Sometimes the test cases on the top left would appear and sometimes it does not.

I have been trying out the same template link again today, it seems to work fine this time: https://codepen.io/ngl4/pen/OJxKmry

However, this still does not explain why the link I mentioned in the first paragraph has a weird issue. It could be a codepen issue and not FreeCodeCamp.

Thank you for your response!

the script is not included here (it’s not there in the JS settings of the pen), and you have mispelled the closing title tag and that’s why your html content is not showing

image

(to have this theme that highlight errors you need to select the Oceanic Dark theme in your codepen account settings, under editor preferences)

in the other one the script is included

1 Like

Hi ilenia, I have followed your guidance. The HTML content is printed on the preview page. This part is working Thank you!

However, the top left test cases (three horizontal green lines) do not seem to be there. This is not a big deal but just double-checking to see if you know what may cause it to disappear.

Thank you!

As I said, you do not have the script included

1 Like

oh, I see! Got it! Thank you so much, ilenia! Sorry I was not sure what you meant by the JS script before. Now I know haha. Thank you! (I have included a screenshot here just in case others may encounter the similar issue)