ApoorvSaxena/lozad.js

Validation W3C

Open

#157 opened on Jan 31, 2019

View on GitHub
 (9 comments) (0 reactions) (1 assignee)JavaScript (476 forks)batch import
Hacktoberfestenhancementgood first issue

Repository metrics

Stars
 (7,370 stars)
PR merge metrics
 (No merged PRs in 30d)

Description

Expected Behavior

Running validator https://validator.w3.org on basic <picture> elements as per setup config should not result in errors.

Current Behavior

Currently when running validator on:

<picture class="lozad" style="display: block; min-height: 1rem" data-iesrc="images/thumbs/04.jpg" data-alt="">
    <source srcset="images/thumbs/04.jpg" media="(min-width: 1280px)">
    <source srcset="images/thumbs/05.jpg" media="(min-width: 980px)">
    <source srcset="images/thumbs/06.jpg" media="(min-width: 320px)">
    <!-- NO img element -->
    <!-- instead of img element, there will be the last source with the minimum dimensions -->
    <!-- for disabled JS you can set <noscript><img src="images/thumbs/04.jpg" alt=""></noscript> -->
</picture>

Validator will give error: Element img is missing required attribute src.

Possible Solution

Setting up <nosript> tag with <img src=(...)> results in Element noscript not allowed as child of element picture in this context.

When adding <img src=(...)> tag without <noscript> surrounding it, html parser will simply output 2 images...

Steps to Reproduce (for bugs)

Run validator on any website with lozad setup

Context

Trying to get a clean sheet from validator.

Contributor guide