Heads up! This blog post hasn't been updated in over 2 years. CodePen is an ever changing place, so if this post references features, you're probably better off checking the docs. Get in touch with support if you have further questions.

It isn’t very useful to execute JavaScript that has some dumb syntax error in it which completely breaks it. If you have a syntax error like that, it’s better just to know about it so you can fix it before that JavaScript executes.

That’s exactly what we’ve done here on CodePen!

If we detect a major syntax error (nothing just stylisticly off, like a missing semi-colon) we’ll highlight the line and show you an error icon. Just like we do with preprocessor syntax errors.

Click the icon for information on exactly what we think is wrong on that line:

This prevents you from having to open the console to look for errors when things aren’t happening as you expect. But you can still use the console of course! We just hope this helps the editing experience and draws attention to errors before the normal hair-pulling confusion sets in.

Enjoy! Let us know if you have any issues with it.