CircleCI - Common Errors and How to Fix them


This topic should serve as a resource to fix that persistent :x: next to your commits.

To see the errors, first navigate to your cohort’s pull requests:


Then, find your pull request, and click the :x: next to your name.

Next to the CircleCi dialog, click details:

Now scroll to the bottom, and look in the section titled --------TEST--------

The errors should tell you two things about each file that threw an error: what CircleCi found, and what it expected. Use your best judgement to fix the errors in the files

If you’re at a loss for how to fix them, ask your classmates if anyone else has experienced the problem. If it seems to be a common issue, please post your solution in this topic!


ESLint Indentation Errors

This will also work for HTML errors.

  21:7  error  Expected indentation of 4 spaces but found 6  indent
  29:7  error  Expected indentation of 4 spaces but found 6  indent

This error can be resolved by re-configuring Atom Beautify.

In Atom, open your Preferences (Command + , / Control + ,) and click on Packages. (If you don’t have Atom Beautify installed, go to the Install pane and add it.) Find Atom Beautify and click on Settings. Now, scroll down to Javascript (or HTML) and click on it to expand the Options pane.

Now change your indentation settings to match these values:

Then, open the file CircleCi indicated in the error message. Right-click anywhere in the code and click Beautify editor contents. Your code will be re-formatted. Finally, save, commit and push your changes.

1 Like

text contains improperly escaped characters:

You’ll notice CircleCI will yell at you if you have &, <, >, and a few others in your HTML. That’s because these are considered “unescaped” characters. Even though it may look fine or Chrome, Safari, Firefox, etc, less-intelligent browsers and crawlers (like Google’s search crawlers) might not be as smart. You need to go into your HTML and escape the characters

& becomes &amp;
< becomes &lt;
> becomes &gt;

See here for more details and other characters

pinned globally #4

only <head> and <body> may be children of <html>

This telling us that ONLY a <head></head> and a <body></body> can go inside the <html></html> tag

<!DOCTYPE html>
    <meta charset="utf-8">
    <!-- Stuff you don't see in here -->
    <!-- Stuff you see in here -->

value must match the format: dash

It wants the classes and ids in your html to be in spinal-case, (aka separated by a dash)

This is in contrast to

camelCase or lowerCamelCase
CapitalCase or UpperCamelCase