Help with Survey getting error messages to work

Tell us what’s happening:

I am trying to get the different error messages to pop up correctly for not entering the proper formats and information asked for, but can only get the first one to work, how do I get the second to run after the first has been completed?

Your code so far
https://codepen.io/Medearave/pen/LYRXxZp
I think you can view the code, I’m new to code pen and hate it so far. It seems to make this more difficult than helpful. I do like seeing the progress in action.

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.146 Safari/537.36.

Challenge: Build a Survey Form

Link to the challenge:

  • Keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>) (if not forking the pen the instructions have the CDN link to use)
    • The test script should be included, with all tests passing, when you submit your projects.
  • When a test fails click the red button to see which test(s) are failing and text to help you correct the issue. (Be sure and read more than just the first line of the failing message.)
    The first failing error message says;
I can see a title with id="title" in H1 sized text.
There should be an element with id="title" : expected null to not equal null  
AssertionError: There should be an element with id="title" : expected null to not equal null

Do you understand what the message is telling you and how to correct it?
The rest of the failing messages are just as helpful.
When all the tests are passing you’ll notice the JS you have is not needed.

What do you hate? Really the only difference from not coding locally is that in the HTML editor you only need to add the code that goes between the body tags. Codepen has a place for you to add head info.
The CSS editor allows choosing a preprocessor, if needed, just from a dropdown, allow setting a base, if needed, by selecting a radio button.
And you don’t have to use codepen. You can use repl.it, codesandbox, yada, yada

A couple of hints about your form;

  • do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
  • Run your HTML code through the W3C validator.
1 Like

I guess I don’t like that it keeps asking me to upgrade to complete assignments. The formats aren’t easy to work with, I keep getting knocked out of what I am doing, and brought back to the top of what code I’m writing, like CSS, I’ll be writing a line and it stops me and scrolls up to the top.

Also, I have no idea how to run the checks to see if I am passing the tests. I don’t see the option, and contacted their support, who told me who come here because they don’t actually run the FCC part. I finished my Tribute, but didn’t run any tests.

That’s the first bullet point of my response.

  1. Paste what’s in between the parens at the top of the HTML editor. (If you had forked FCC’s pen from the instructions it would have been there)
  2. You’ll see a hamburger menu in the upper left of the preview
  3. Expand it and select the project from the dropdown
  4. Run the tests
  5. If a test(s) fail then click the red button, etc

EDIT: Make sure you go back and do the same thing with your tribute page. There are failing user stories there too.

Odd. I’ve never seen that.
I’ve heard one person say that they had codepen jump while writing. I don’t recall if or what the solution was.

1 Like

I used your code and got the test to work. Thanks so much. I was getting frustrated and gave up for almost a month on this project. It’s working now, but all of the failed tests, the resources given are dead links and don’t explain how to fix the problem. When you click ask for help, it’s also not found. I am not sure what else to do but start over and try again.

From the second bullet point of my original response…

  • When a test fails click the red button to see which test(s) are failing and text to help you correct the issue. ( Be sure and read more than just the first line of the failing message .)
    The first failing error message says;
I can see a title with id="title" in H1 sized text.
There should be an element with id="title" : expected null to not equal null  
AssertionError: There should be an element with id="title" : expected null to not equal null

Do you understand what the message is telling you and how to correct it?