Skip to content

Commit

Permalink
fix(gatsby-remark-images): Do not fallback title value to alt value (#…
Browse files Browse the repository at this point in the history 
…37395)
  • Loading branch information
@tyhopp
tyhopp committed Jan 3, 2023
1 parent f82c453 commit f6543bb
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 16 deletions.
30 changes: 15 additions & 15 deletions packages/gatsby-remark-images/src/__tests__/__snapshots__/index.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,7 @@ exports[`it doesn't use tracedSVG placeholder (deprecated and fallback to base64
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"image\\"
title=\\"image\\"
title=\\"\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
srcset=\\"not-a-real-dir/images/my-image.jpeg, not-a-real-dir/images/my-image.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand All @@ -167,7 +167,7 @@ exports[`it handles goofy nesting properly 1`] = `
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"test\\"
title=\\"test\\"
title=\\"\\"
src=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg\\"
srcset=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg, not-a-real-dir/images/this-image-already-has-a-link.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand All @@ -190,7 +190,7 @@ exports[`it leaves images that are already linked alone 1`] = `
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"img\\"
title=\\"img\\"
title=\\"\\"
src=\\"not-a-real-dir/image/my-image.jpg\\"
srcset=\\"not-a-real-dir/image/my-image.jpg, not-a-real-dir/image/my-image.jpg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand All @@ -205,23 +205,23 @@ exports[`it leaves linked HTML img tags alone 1`] = `
"<a href=\\"https://example.org\\">
<span class=\\"gatsby-resp-image-wrapper\\" style=\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 300px; \\">
<span class=\\"gatsby-resp-image-background-image\\" style=\\"padding-bottom: 133.33333333333331%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw'); background-size: cover; display: block;\\"></span>
<img class=\\"gatsby-resp-image-image\\" alt=\\"this image already has a link\\" title=\\"this image already has a link\\" src=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" srcset=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg, not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
<img class=\\"gatsby-resp-image-image\\" alt=\\"this image already has a link\\" title=\\"\\" src=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" srcset=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg, not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
</span>
</a>"
`;
exports[`it leaves single-line linked HTML img tags alone 1`] = `
"<span class=\\"gatsby-resp-image-wrapper\\" style=\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 300px; \\">
<span class=\\"gatsby-resp-image-background-image\\" style=\\"padding-bottom: 133.33333333333331%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw'); background-size: cover; display: block;\\"></span>
<img class=\\"gatsby-resp-image-image\\" alt=\\"this image already has a link\\" title=\\"this image already has a link\\" src=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" srcset=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg, not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
<img class=\\"gatsby-resp-image-image\\" alt=\\"this image already has a link\\" title=\\"\\" src=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" srcset=\\"not-a-real-dir/images/this-image-already-has-a-link.jpeg, not-a-real-dir/images/this-image-already-has-a-link.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
</span>"
`;
exports[`it transforms HTML img tags 1`] = `
"<span class=\\"gatsby-resp-image-wrapper\\" style=\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 300px; \\">
<a class=\\"gatsby-resp-image-link\\" href=\\"not-a-real-dir/image/my-image.jpeg\\" style=\\"display: block\\" target=\\"_blank\\" rel=\\"noopener\\">
<span class=\\"gatsby-resp-image-background-image\\" style=\\"padding-bottom: 133.33333333333331%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw'); background-size: cover; display: block;\\"></span>
<img class=\\"gatsby-resp-image-image\\" alt=\\"my image\\" title=\\"my image\\" src=\\"not-a-real-dir/image/my-image.jpeg\\" srcset=\\"not-a-real-dir/image/my-image.jpeg, not-a-real-dir/image/my-image.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
<img class=\\"gatsby-resp-image-image\\" alt=\\"my image\\" title=\\"\\" src=\\"not-a-real-dir/image/my-image.jpeg\\" srcset=\\"not-a-real-dir/image/my-image.jpeg, not-a-real-dir/image/my-image.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
</a>
</span>"
`;
Expand All @@ -230,7 +230,7 @@ exports[`it transforms HTML img tags with query strings 1`] = `
"<span class=\\"gatsby-resp-image-wrapper\\" style=\\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 300px; \\">
<a class=\\"gatsby-resp-image-link\\" href=\\"not-a-real-dir/image/my-image.jpeg\\" style=\\"display: block\\" target=\\"_blank\\" rel=\\"noopener\\">
<span class=\\"gatsby-resp-image-background-image\\" style=\\"padding-bottom: 133.33333333333331%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw'); background-size: cover; display: block;\\"></span>
<img class=\\"gatsby-resp-image-image\\" alt=\\"my image\\" title=\\"my image\\" src=\\"not-a-real-dir/image/my-image.jpeg\\" srcset=\\"not-a-real-dir/image/my-image.jpeg, not-a-real-dir/image/my-image.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
<img class=\\"gatsby-resp-image-image\\" alt=\\"my image\\" title=\\"\\" src=\\"not-a-real-dir/image/my-image.jpeg\\" srcset=\\"not-a-real-dir/image/my-image.jpeg, not-a-real-dir/image/my-image.jpeg\\" sizes=\\"(max-width: 650px) 100vw, 650px\\" style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\" loading=\\"lazy\\" decoding=\\"async\\">
</a>
</span>"
`;
Expand Down Expand Up @@ -285,7 +285,7 @@ exports[`it transforms images in markdown 1`] = `
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"image\\"
title=\\"image\\"
title=\\"\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
srcset=\\"not-a-real-dir/images/my-image.jpeg, not-a-real-dir/images/my-image.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand Down Expand Up @@ -316,7 +316,7 @@ exports[`it transforms images in markdown and uses getRemarkFileDependency when
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"image\\"
title=\\"image\\"
title=\\"\\"
src=\\"not-a-real-dir/not-a-real-dir/images/my-image.jpeg\\"
srcset=\\"not-a-real-dir/not-a-real-dir/images/my-image.jpeg, not-a-real-dir/not-a-real-dir/images/my-image.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand Down Expand Up @@ -347,7 +347,7 @@ exports[`it transforms images in markdown in nested markdown node 1`] = `
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"image\\"
title=\\"image\\"
title=\\"\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
srcset=\\"not-a-real-dir/images/my-image.jpeg, not-a-real-dir/images/my-image.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand Down Expand Up @@ -378,7 +378,7 @@ exports[`it transforms images in markdown with query strings 1`] = `
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"image\\"
title=\\"image\\"
title=\\"\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
srcset=\\"not-a-real-dir/images/my-image.jpeg, not-a-real-dir/images/my-image.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand Down Expand Up @@ -421,7 +421,7 @@ exports[`it transforms images in markdown with the "withAvif" option 1`] = `
class=\\"gatsby-resp-image-image\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
alt=\\"image\\"
title=\\"image\\"
title=\\"\\"
loading=\\"lazy\\"
decoding=\\"async\\"
style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\"
Expand Down Expand Up @@ -462,7 +462,7 @@ exports[`it transforms images in markdown with the "withWebp" option 1`] = `
class=\\"gatsby-resp-image-image\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
alt=\\"image\\"
title=\\"image\\"
title=\\"\\"
loading=\\"lazy\\"
decoding=\\"async\\"
style=\\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\\"
Expand Down Expand Up @@ -662,7 +662,7 @@ exports[`showCaptions display alt as caption if title was not found and showCapt
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"some alt\\"
title=\\"some alt\\"
title=\\"\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
srcset=\\"not-a-real-dir/images/my-image.jpeg, not-a-real-dir/images/my-image.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand Down Expand Up @@ -798,7 +798,7 @@ exports[`showCaptions fallback to alt as caption if specified second in showCapt
<img
class=\\"gatsby-resp-image-image\\"
alt=\\"some alt\\"
title=\\"some alt\\"
title=\\"\\"
src=\\"not-a-real-dir/images/my-image.jpeg\\"
srcset=\\"not-a-real-dir/images/my-image.jpeg, not-a-real-dir/images/my-image.jpeg\\"
sizes=\\"(max-width: 650px) 100vw, 650px\\"
Expand Down
2 changes: 1 addition & 1 deletion packages/gatsby-remark-images/src/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -226,7 +226,7 @@ module.exports = (
overWrites.alt ? overWrites.alt : node.alt ? node.alt : defaultAlt
)

const title = node.title ? _.escape(node.title) : alt
const title = node.title ? _.escape(node.title) : ``

const loading = options.loading

Expand Down

0 comments on commit f6543bb

Please sign in to comment.