-
Notifications
You must be signed in to change notification settings - Fork 10.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* init * gri * update shopify snapshot * gatsby-plugin-sharp tests * update gatsby-remark-images/gatsby-node tests * update gatsby-plugin-image tests * update schema print tests * remove traceSVG unit tests as it was removed * legacy gatsby-image fields * update polyfill tests * update cypress assertion * update contentful cypress assertions * drop few more packages from gatsby-plugin-sharp as they are no onger used * correct IMAGE_CDN fallback for TRACE_SVG * update generateImageData * update e2e-prod/assertions * update unit test * update snapshot * update e2e-dev/assertions * drop more unused * sync yarn.lock * a bit more prod warnings * adjust gatsby-remark-images plugin options warning * add link to gatsby-remark-images warning (cherry picked from commit 94c2d73)
- Loading branch information
Showing
36 changed files
with
511 additions
and
949 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file modified
BIN
+161 Bytes
(100%)
e2e-tests/contentful/cypress/snapshots/gatsby-plugin-image.js/english-0.snap.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
246 changes: 125 additions & 121 deletions
246
e2e-tests/production-runtime/cypress/integration/remote-file.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,143 +1,147 @@ | ||
describe( | ||
`remote-file`, | ||
`remote-file`, | ||
{ | ||
retries: { | ||
runMode: 4, | ||
}, | ||
}, | ||
() => { | ||
beforeEach(() => { | ||
cy.visit(`/remote-file/`).waitForRouteChange() | ||
beforeEach(() => { | ||
cy.visit(`/remote-file/`).waitForRouteChange() | ||
|
||
// trigger intersection observer | ||
cy.scrollTo("top") | ||
cy.wait(100) | ||
cy.scrollTo("bottom", { | ||
duration: 500, | ||
}) | ||
cy.wait(500) | ||
}) | ||
|
||
async function testImages(images, expectations) { | ||
for (let i = 0; i < images.length; i++) { | ||
const expectation = expectations[i] | ||
|
||
const res = await fetch(images[i].currentSrc, { | ||
method: "HEAD", | ||
// trigger intersection observer | ||
cy.scrollTo("top") | ||
cy.wait(100) | ||
cy.scrollTo("bottom", { | ||
duration: 500, | ||
}) | ||
expect(res.ok).to.be.true | ||
if (expectation.width) { | ||
expect(Math.ceil(images[i].getBoundingClientRect().width)).to.be.equal( | ||
expectation.width | ||
) | ||
} | ||
if (expectation.height) { | ||
expect(Math.ceil(images[i].getBoundingClientRect().height)).to.be.equal( | ||
expectation.height | ||
) | ||
} | ||
} | ||
} | ||
cy.wait(500) | ||
}) | ||
|
||
it(`should render correct dimensions`, () => { | ||
cy.get('[data-testid="public"]').then(async $urls => { | ||
const urls = Array.from($urls.map((_, $url) => $url.getAttribute("href"))) | ||
async function testImages(images, expectations) { | ||
for (let i = 0; i < images.length; i++) { | ||
const expectation = expectations[i] | ||
|
||
for (const url of urls) { | ||
const res = await fetch(url, { | ||
const res = await fetch(images[i].currentSrc, { | ||
method: "HEAD", | ||
}) | ||
expect(res.ok).to.be.true | ||
if (expectation.width) { | ||
expect( | ||
Math.ceil(images[i].getBoundingClientRect().width) | ||
).to.be.equal(expectation.width) | ||
} | ||
if (expectation.height) { | ||
expect( | ||
Math.ceil(images[i].getBoundingClientRect().height) | ||
).to.be.equal(expectation.height) | ||
} | ||
} | ||
}) | ||
|
||
cy.get(".resize").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
width: 100, | ||
height: 133, | ||
}, | ||
{ | ||
width: 100, | ||
height: 160, | ||
}, | ||
{ | ||
width: 100, | ||
height: 67, | ||
}, | ||
]) | ||
}) | ||
} | ||
|
||
cy.get(".fixed").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
width: 100, | ||
height: 133, | ||
}, | ||
{ | ||
width: 100, | ||
height: 160, | ||
}, | ||
{ | ||
width: 100, | ||
height: 67, | ||
}, | ||
]) | ||
}) | ||
it(`should render correct dimensions`, () => { | ||
cy.get('[data-testid="public"]').then(async $urls => { | ||
const urls = Array.from( | ||
$urls.map((_, $url) => $url.getAttribute("href")) | ||
) | ||
|
||
cy.get(".constrained").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
width: 300, | ||
height: 400, | ||
}, | ||
{ | ||
width: 300, | ||
height: 481, | ||
}, | ||
{ | ||
width: 300, | ||
height: 200, | ||
}, | ||
]) | ||
}) | ||
for (const url of urls) { | ||
const res = await fetch(url, { | ||
method: "HEAD", | ||
}) | ||
expect(res.ok).to.be.true | ||
} | ||
}) | ||
|
||
cy.get(".full").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
height: 1229, | ||
}, | ||
{ | ||
height: 1478, | ||
}, | ||
{ | ||
height: 614, | ||
}, | ||
]) | ||
}) | ||
}) | ||
cy.get(".resize").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
width: 100, | ||
height: 133, | ||
}, | ||
{ | ||
width: 100, | ||
height: 160, | ||
}, | ||
{ | ||
width: 100, | ||
height: 67, | ||
}, | ||
]) | ||
}) | ||
|
||
it(`should render a placeholder`, () => { | ||
cy.get(".fixed [data-placeholder-image]") | ||
.first() | ||
.should("have.css", "background-color", "rgb(232, 184, 8)") | ||
cy.get(".constrained [data-placeholder-image]") | ||
.first() | ||
.should($el => { | ||
expect($el.prop("tagName")).to.be.equal("IMG") | ||
expect($el.prop("src")).to.contain("data:image/jpg;base64") | ||
cy.get(".fixed").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
width: 100, | ||
height: 133, | ||
}, | ||
{ | ||
width: 100, | ||
height: 160, | ||
}, | ||
{ | ||
width: 100, | ||
height: 67, | ||
}, | ||
]) | ||
}) | ||
cy.get(".constrained_traced [data-placeholder-image]") | ||
.first() | ||
.should($el => { | ||
expect($el.prop("tagName")).to.be.equal("IMG") | ||
expect($el.prop("src")).to.contain("data:image/svg+xml,%3csvg") | ||
|
||
cy.get(".constrained").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
width: 300, | ||
height: 400, | ||
}, | ||
{ | ||
width: 300, | ||
height: 481, | ||
}, | ||
{ | ||
width: 300, | ||
height: 200, | ||
}, | ||
]) | ||
}) | ||
cy.get(".full [data-placeholder-image]") | ||
.first() | ||
.should($el => { | ||
expect($el.prop("tagName")).to.be.equal("DIV") | ||
expect($el).to.be.empty | ||
|
||
cy.get(".full").then(async $imgs => { | ||
await testImages(Array.from($imgs), [ | ||
{ | ||
height: 1229, | ||
}, | ||
{ | ||
height: 1478, | ||
}, | ||
{ | ||
height: 614, | ||
}, | ||
]) | ||
}) | ||
}) | ||
}) | ||
}) | ||
|
||
it(`should render a placeholder`, () => { | ||
cy.get(".fixed [data-placeholder-image]") | ||
.first() | ||
.should("have.css", "background-color", "rgb(232, 184, 8)") | ||
cy.get(".constrained [data-placeholder-image]") | ||
.first() | ||
.should($el => { | ||
expect($el.prop("tagName")).to.be.equal("IMG") | ||
expect($el.prop("src")).to.contain("data:image/jpg;base64") | ||
}) | ||
cy.get(".constrained_traced [data-placeholder-image]") | ||
.first() | ||
.should($el => { | ||
// traced falls back to DOMINANT_COLOR | ||
expect($el.prop("tagName")).to.be.equal("DIV") | ||
expect($el).to.be.empty | ||
}) | ||
cy.get(".full [data-placeholder-image]") | ||
.first() | ||
.should($el => { | ||
expect($el.prop("tagName")).to.be.equal("DIV") | ||
expect($el).to.be.empty | ||
}) | ||
}) | ||
} | ||
) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.