parcel-bundler/website

Error in Images documentation.

metadiv opened this issue · 1 comments

metadiv commented

On the parcel Image documentation page you have incorrectly used src="" instead of srcset="" in your example.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>HTML Example</title>
  </head>
  <body>
    <picture>
      <source src="image.jpeg?as=avif&width=800" type="image/avif" />
      <source src="image.jpeg?as=webp&width=800" type="image/webp" />
      <source src="image.jpeg?width=800" type="image/jpeg" />
      <img src="image.jpeg?width=200" alt="test image" />
    </picture>
  </body>
</html>

Should be:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>HTML Example</title>
  </head>
  <body>
    <picture>
      <source srcset="image.jpeg?as=avif&width=800" type="image/avif" />
      <source srcset="image.jpeg?as=webp&width=800" type="image/webp" />
      <source srcset="image.jpeg?width=800" type="image/jpeg" />
      <img src="image.jpeg?width=200" alt="test image" />
    </picture>
  </body>
</html>

According to HTML spec src="" is ignored when used inside a <picture> element.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source

mischnic commented

Do you want to open a PR to fix this?