If you edit https://glitch.com/edit/#!/vine-sponge?path=index.html:64:9 you can see there’s a scary red dot in the left margin. Usually this indicates some sort of breakpoint, or maybe error. But I don’t see any indication of what the error or breakpoint is. Hovering my mouse over the dot does not help.
Does anyone understand what Glitch is trying to tell me here? Maybe I’ve found a Glitch bug?
It seems it is unhappy with no closing , just linting I expect?
Hi @domenic! It looks like you are missing a closing </html> tag at the end of your file. If you add that, it should make the red dot go away!
OK, but there are two issues with that:
How was I supposed to know that? Nothing in the UI told me.
Closing </html> tags are optional, according to the spec (“An html element’s end tag can be omitted if the html element is not immediately followed by a comment.”) and the official validator. Why is Glitch giving me scary red dots for perfectly valid HTML? Especially since that style is preferred by my company? (link in followup post since “new users can only put two links per post”)
The red dots on the side are the result of linting, where we check your code to make sure it works. In this case, the HTMLHint linter is looking to make sure that every opening tag has a matching closing tag. To customize the HTML linter, you can create a .htmlhintrc file in your project and add the following:
{
"tag-pair": false
}
If you want to add additional rules, the full list of options can be found here: https://github.com/htmlhint/HTMLHint/wiki/Rules
Also, thanks for pointing out that hovering over the dot doesn’t give any information in this instance! This seems to be a bug in the HTML linter and we’ll take a look at it.
That’s good to know. Can I ask that Glitch fix the HTML linter’s defaults to respect the HTML standard and validator, instead of giving people using Glitch misleading advice?
Hey @domenic, playing with this some more, it seems like the .htmlhintrc solution is not entirely supported in Glitch. The best way to reliably override the HTML linter rules, you will want to include a comment at the beginning of your HTML file:
<!--htmlhint tag-pair:false -->
If you want to override any other linter rules, this would be the best way to do it.
https://google.github.io/styleguide/htmlcssguide.html#Optional_Tags
Just to check though, am I reading this correctly that the recommendation in that Google style guide is to omit both the html opening and closing tags, not include the opening tag only? And btw that open tag is also what’s causing the indentation issues in your other issue filed here: Glitch keeps fighting my indentation - the editor sees the open tag, and therefore is trying to indent everything following it by one level.
That doesn’t change the confusing lack of error message of course and fact that we should consider making closing tags optional, but just wanted to point out the connection.
Right, if you don’t need to specify a language, then you don’t even need the opening tag, that’s true. I chose to specify a language so in my case the opening tag is necessary.
This has made Glitch much better for me:
CodeMirror.registerHelper('lint', 'html', () => {});