diff --git a/src/lang/std/artifactGraph.test.ts b/src/lang/std/artifactGraph.test.ts index 9386dae1b..14e0a4cd3 100644 --- a/src/lang/std/artifactGraph.test.ts +++ b/src/lang/std/artifactGraph.test.ts @@ -458,9 +458,6 @@ async function GraphTheGraph( await page.waitForSelector('#plotly-graph') const element = await page.$('#plotly-graph') - // wait an extra bit for things to settle - await new Promise((resolve) => setTimeout(resolve, 500)) - // @ts-ignore await element.screenshot({ path: `./e2e/playwright/temp3.png`, @@ -468,30 +465,45 @@ async function GraphTheGraph( await browser.close() - const img1Path = path.resolve(`./src/lang/std/artifactMapGraphs/${imageName}`) - const img2Path = path.resolve('./e2e/playwright/temp3.png') + const originalImgPath = path.resolve( + `./src/lang/std/artifactMapGraphs/${imageName}` + ) + // chop the top 30 pixels off the image + const originalImg = PNG.sync.read(fs.readFileSync(originalImgPath)) + // const img1Data = new Uint8Array(img1.data) + // const img1DataChopped = img1Data.slice(30 * img1.width * 4) + // img1.data = Buffer.from(img1DataChopped) - const img1 = PNG.sync.read(fs.readFileSync(img1Path)) - const img2 = PNG.sync.read(fs.readFileSync(img2Path)) + const newImagePath = path.resolve('./e2e/playwright/temp3.png') + const newImage = PNG.sync.read(fs.readFileSync(newImagePath)) + const newImageData = new Uint8Array(newImage.data) + const newImageDataChopped = newImageData.slice(30 * newImage.width * 4) + newImage.data = Buffer.from(newImageDataChopped) - const { width, height } = img1 + const { width, height } = originalImg const diff = new PNG({ width, height }) - const numDiffPixels = pixelmatch( - img1.data, - img2.data, - diff.data, - width, - height, - { threshold: 0.1 } - ) + const imageSizeDifferent = originalImg.data.length !== newImage.data.length + let numDiffPixels = 0 + if (!imageSizeDifferent) { + numDiffPixels = pixelmatch( + originalImg.data, + newImage.data, + diff.data, + width, + height, + { + threshold: 0.1, + } + ) + } - if (numDiffPixels > 10) { + if (numDiffPixels > 10 || imageSizeDifferent) { console.warn('numDiffPixels', numDiffPixels) // write file out to final place fs.writeFileSync( `src/lang/std/artifactMapGraphs/${imageName}`, - PNG.sync.write(img2) + PNG.sync.write(newImage) ) } } diff --git a/src/lang/std/artifactMapGraphs/exampleCode1.png b/src/lang/std/artifactMapGraphs/exampleCode1.png index 164665f65..d2c848b65 100644 Binary files a/src/lang/std/artifactMapGraphs/exampleCode1.png and b/src/lang/std/artifactMapGraphs/exampleCode1.png differ diff --git a/src/lang/std/artifactMapGraphs/sketchOnFaceOnFaceEtc.png b/src/lang/std/artifactMapGraphs/sketchOnFaceOnFaceEtc.png index 0bb9d4cf7..7e0a01afa 100644 Binary files a/src/lang/std/artifactMapGraphs/sketchOnFaceOnFaceEtc.png and b/src/lang/std/artifactMapGraphs/sketchOnFaceOnFaceEtc.png differ