Tribute exercise "chokes" Parser

My page displays correctly in freeCodeCamp and as a non-secure web site (that’s why I ended up using codepen.io) in both Safari and Chrome.

codepen.io is rendering my just like my local browsers. It found a couple of typos in my CSS. :+1: Images are displaying properly (uploaded to postimage). Entered the codepen URL but the freeCodeCamp parser’s progress bar stops at 20%. Last attempt was 24 minutes ago (and counting). :upside_down_face: Tried Safari and Google Chrome. Same results.

As best as I can understand codepen, [red error icon: “Just HTML that goes in the goes here. Learn more”] I removed the CSS that had been in the html file to the CSS portion of the codepin display. Is that correct?

Additionally, in the page that open when the link displays, I have removed all the normal code that resides in the as well as the code that codepen “ultimately” includes (see: https://blog.codepen.io/documentation/preview-template/>

Your project link(s)
solution: https://codepen.io/arkieflier/pen/OJzoaNe

Temporarily live:
http://mid-southweather.com/Tribute/Tribute%20Exercize.html

Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.4 Safari/605.1.15

Challenge: Build a Tribute Page

Link to the challenge:

that’s the progress in the section, like you had the progress bar in the section before

as long as your pen passes all the tests in the test suite you are fine, but I don’t see it in your pen so please include it

You are missing the title id on an element. The h1 would be a good place to add it.

The tribute-link id should be on a link element (<a>).

The CSS for the image is missing a property. If you read the full error message it tells you the property.

Thanks, I’ll double-check those items. Furst mizsteak uv thee yeer? :upside_down_face:

However, since the fCC parser never finished, I never saw any error message.

What do you think is the ‘fCC parser’. How are you finding this ‘parser’? Do you mean the fCC tests? I don’t see where you’ve added the required test suite script.

there is no parser, that just tells you you submitted 20% of the projects section, you need to add the test script to your project in codepen - the template given has already it included

1 Like

Paste in the test script at the top of the HTML page on Codepen (before your header element).

<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>

Select the Tribute Page project from the dropdown and click the “Run Tests” button. After that click the red button below it and read the error messages.

[1] I had missed the detail to actually create a “title” ID, I had simply added a in the section and used CSS to style the h1.
[2] Yep, the way I had styled those links would have applied also to the whole unordered list! :rofl:
[3] I have two images <img…> and both have CSS attributes and seem to comply with the exercise requirements:

…responsively resize, relative to the width of its parent element, without exceeding its original size.
…be centered within its parent element.

I’m not sure what is needed in the CSS. However, I will see how wide a window I can create in my browser as I may be able to exceed the 5180 monitor width?

I’m calling the project testing functions a “parser”. A parser is simply an app that looks at text (usually) and tries to verify it is formatted correctly and/or contains everything it should. The coders of the site probably call those parsing functions something else, if anything. I’ll try to remember to use "“fCC test scripts” or something similar from now on.

I wouldn’t really call a test suite a parser, personally. While it might be technically correct, its a bit confusing to call a test suite something other than a test suite. Typically one uses the term ‘parser’ to refer to a part of a compiler or interpreter that converts from text to some abstract syntax representation, and a test suite isn’t really doing that.

OK. “test suite” it is. :+1:

Please update your Codepen with the test script and your changes.


  1. It seems you understand what is missing.

  2. It isn’t about styles. The test is looking for an element with the id. If that element isn’t an <a> element it will fail.

  3. As said, read the error message. It tells you exactly what you need to add. It is worded in a way that makes it sound like a suggestion, but it isn’t, it is a requirement.

Try using the “max-width” style property : expected ‘none’ to not equal ‘none’

1 Like

@lasjorg;
Language is not my bestist subject! I think you are trying to get me to use “max-width” in the CSS for both images. I’ll work on that and edit the images to much narrower dimensions which will help me see what happens when the window gets ‘too wide’. I’ll work on that after getting the max/min width thing right.

Thanks again for your patience!

the requirements for the project include that it should have the test suite included and that all tests should be passing, so make sure to do that :slight_smile:

ilenia,

I fixed all the ererz and re-read (several times!) the reply from lasjorg and finally noticed the addition of the “<script…>” pieces! :blush: I now have a 10 for 10 score!!! :clap:

A big THANKS!!! For all the patient help for this noob!!! I’m off to make a donation!! :walking_man:

Huzzah :confetti_ball: Good work getting it passing!