Skip to content

Instantly share code, notes, and snippets.

@notlee

notlee/safari-picture-bug.html

Created July 6, 2016 18:14
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save notlee/73ebe50c3af907f3cde875afd9cd61c1 to your computer and use it in GitHub Desktop.
Save notlee/73ebe50c3af907f3cde875afd9cd61c1 to your computer and use it in GitHub Desktop.
Download ZIP
I think I've found an odd Safari bug. For the picture element in the example below, both the webp and jpeg images download unless you delete the script tag, remove the new line between the opening and closing of the script tag, or delete the link tag href contents. ¯\_(ツ)_/¯ The expected behaviour being to ignore the webp picture source and only…
Raw
safari-picture-bug.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Safari Bug: webp &amp; jpeg download</title>
<link rel="stylesheet" href="anything-here-valid-or-not">
</head>
<body>
<script>
</script>
<p>
For the picture element both the webp and jpeg images download unless you delete the script tag, remove the new line between the opening and closing of the script tag, or delete the link tag href contents. ¯\_(ツ)_/¯ The expected behaviour being to ignore the webp picture source and only download the jpeg fallback.
</p>
<ul>
<li>Safari Version 9.1.1 (11601.6.17)</li>
<li>Safari Preview Version 9.1.2 (11601.7.4, 11602.1.37)</li>
</ul>
<picture>
<source type="image/webp" sizes="100vw" srcset="https://leemoody.co.uk/images/content/pandamath-1invites-w800.webp 800w">
<img src="https://leemoody.co.uk/images/content/pandamath-1invites-w800.jpeg" sizes="100vw" srcset="https://leemoody.co.uk/images/content/pandamath-1invites-w800.jpeg 800w" alt="">
</picture>
</body>
</html>
@notlee
Copy link
Author

notlee commented Jul 6, 2016

screen shot 2016-07-06 at 19 15 16

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment