bdkjones / CodeKit

CodeKit 3 Issue Tracker
https://codekitapp.com
82 stars 5 forks source link

Validation failures in CodeKit's previewer #620

Open JayHoltslander opened 4 years ago

JayHoltslander commented 4 years ago

When I take a valid AMP HTML page and run it through CodeKit's previewer I get a bunch of validation errors with the official Chrome AMP validator extension.

These errors are only present when the page is run through CodeKit's previewer. If I run the same page with an alternate previewer like simple-https-sever.py validation passes 100%

The errors reported by the validator are:

Is there anything that can be done about this? (I'm hoping to do a bunch of AMP HTML stuff in the future and love working within CodeKit.)

I could just ignore it as a false positive but I'd like to see that validator icon in my toolbar turn from green to red only if a legit problem is introduced to the page.

bdkjones commented 4 years ago

Well, CodeKit’s server isn’t making any changes to meta tags, html tags, etc. The server serves the file exactly as it is on disk and simply adds a script tag to enable browser-refreshing. The only other changes that it makes are when you use an External Server for a project: every instance of the external server’s address anywhere on the page is replaced with the preview server’s address. Is the page cobbled together by some sort of script or server-side processing, or is it a complete, valid HTML document on disk?

-Bryan

On Jul 1, 2020, at 14:17, Jay Holtslander notifications@github.com wrote:

 When I take a valid AMP HTML page and run it through CodeKit's previewer I get a bunch of validation errors with the official Chrome AMP validator extension.

These errors are only present when the page is run through CodeKit's previewer. If I run the same page with an alternate previewer like simple-https-sever.py validation passes 100%

The errors reported by the validator are:

The mandatory tag 'html !doctype' is missing or incorrect. Learn more. The mandatory tag 'html' is missing or incorrect. Learn more. The mandatory tag 'head' is missing or incorrect. Learn more. The mandatory tag 'link rel=canonical' is missing or incorrect. Learn more. The mandatory tag 'meta charset=utf-8' is missing or incorrect. Learn more. The mandatory tag 'meta name=viewport' is missing or incorrect. Learn more. The mandatory tag 'body' is missing or incorrect. Learn more. The mandatory tag 'noscript enclosure for boilerplate' is missing or incorrect. Learn more. The mandatory tag 'head > style[amp-boilerplate]' is missing or incorrect. Learn more. The mandatory tag 'noscript > style[amp-boilerplate]' is missing or incorrect. Learn more. The mandatory tag 'amphtml engine v0.js script' is missing or incorrect. Learn more. Is there anything that can be done about this? (I'm hoping to do a bunch of AMP HTML stuff in the future and love working within CodeKit.)

I could just ignore it as a false positive but I'd like to see that validator icon in my toolbar turn from green to red only if a legit problem is introduced to the page.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or unsubscribe.

JayHoltslander commented 4 years ago

It's a Pug templated site.

bdkjones commented 4 years ago

What does the compiled HTML output file look like on disk?

-Bryan

On Jul 1, 2020, at 15:15, Jay Holtslander notifications@github.com wrote:

 It's a Pug templated site. — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

JayHoltslander commented 4 years ago

This is the output. Gist link

bdkjones commented 4 years ago

Ah, yea. So I have a feeling that what’s happening is the script that’s supposed to assemble all that Amp stuff into an actual page is not running.

That leaves the browser to fill in the missing pieces on page load.

Do you see any errors about scripts in the console when you load the page?

-Bryan

On Jul 2, 2020, at 09:09, Jay Holtslander notifications@github.com wrote:

 This is the output. Gist link

— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

JayHoltslander commented 4 years ago

The page in my earlier gist is fully assembled from several .pug files

I'll package the project up and give you a link to examine it.

bdkjones commented 4 years ago

Ok, sounds good.

-Bryan

On Jul 5, 2020, at 22:26, Jay Holtslander notifications@github.com wrote:

 The page in my earlier gist is fully assembled from several .pug files

I'll package the project up and give you a link to examine it.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

JayHoltslander commented 4 years ago

Sorry I forgot. Here's the zipped project.