Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(gatsby-plugin-image): Correctly handle formats in StaticImage #28618

Merged
merged 9 commits into from
Dec 15, 2020
Merged

fix(gatsby-plugin-image): Correctly handle formats in StaticImage #28618

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
6c10397
Include formats prop
ascorbic Dec 15, 2020
a2d3991
Default to auto, webp
ascorbic Dec 15, 2020
0d07bfa
fix(gatsby-plugin-sharp): Include default transform options for webp
ascorbic Dec 15, 2020
b66a832
Merge branch 'fix/webp-transform-options' into fix/static-image-forma…
ascorbic Dec 15, 2020
918113e
Update snapshots
ascorbic Dec 15, 2020
34a6a9b
Is this why it fails?
ascorbic Dec 15, 2020
7faa8e4
Merge branch 'master' into fix/static-image-formats-2
ascorbic Dec 15, 2020
7f1cd2a
Allow time for other image
ascorbic Dec 15, 2020
72dc3fc
Use jpg-only for lazy-load tests.
ascorbic Dec 15, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions e2e-tests/gatsby-static-image/src/pages/lazy-loading.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ export default function NativeLazyLoadingPage() {
height={59}
alt="Citrus fruits"
loading="lazy"
formats={["jpg"]}
/>

<div style={{ height: `5000px`, background: `#F4F4F4` }} />
Expand All @@ -22,6 +23,7 @@ export default function NativeLazyLoadingPage() {
height={59}
alt="Citrus fruits"
loading="lazy"
formats={["jpg"]}
/>
</div>
)
Expand Down
1 change: 1 addition & 0 deletions packages/gatsby-plugin-image/src/babel-helpers.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import { getAttributeValues } from "babel-jsx-utils"
export const SHARP_ATTRIBUTES = new Set([
`src`,
`layout`,
`formats`,
`maxWidth`,
`maxHeight`,
`quality`,
Expand Down
2 changes: 2 additions & 0 deletions packages/gatsby-plugin-sharp/src/image-data.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,8 @@ export async function generateImageData({
quality,
} = args

args.formats = args.formats || [`auto`, `webp`]

const {
fit = `cover`,
cropFocus = sharp.strategy.attention,
Expand Down