example-screenshpts

.build/shortcodes.ts

@@ -270,6 +270,14 @@ async function getFileTree(path: string): Promise<string> {
             commentEnd: "//</gen>",
             highlight: "javascript",
         },
+        {
+            paths: await files(
+                "/javascript-email-screenshot/*.spec.mjs"
+            ),
+            commentStart: "//<gen>",
+            commentEnd: "//</gen>",
+            highlight: "javascript",
+        },
         {
             paths: await files(
                 "/javascript-cypress-js/**/*.js",

.gitignore

@@ -1,3 +1,4 @@
+.DS_Store
 node_modules
 shortcodes
 **/vendor

javascript-email-screenshot/.gitignore

@@ -1 +1,2 @@
-*.png
+*.png
+!email-screenshot.expected.png

javascript-email-screenshot/email-screenshot.spec.mjs

@@ -1,12 +1,16 @@
-import {test} from 'vitest'
+import {test, expect} from 'vitest'
 import {writeFile} from 'fs/promises';
 import {dirname, join} from 'path';
 import {fileURLToPath} from 'url';
+import Jimp from "jimp";
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 test('can take screenshot of an email', async () => {
+    //<gen>email_screenshot_setup
     const MailSlurp = await import('mailslurp-client').then(m => m.default)
     const mailslurp = new MailSlurp({apiKey: process.env.API_KEY})
+    //</gen>
+    //<gen>email_screenshot_create_email
     // create an inbox
     const inbox = await mailslurp.inboxController.createInboxWithOptions({
         createInboxDto: {
@@ -19,21 +23,26 @@ test('can take screenshot of an email', async () => {
         subject: 'Welcome to my newsletter',
         body: 'Hello Jack. This email is a test.'
     })
+    //</gen>
+    //<gen>email_screenshot_wait_screenshot
     // wait for email to arrive
     const email = await mailslurp.waitForLatestEmail(inbox.id, 120_000, true)
-    // take screenshot of the email
+    // get a screenshot of the email
     const screenshot = await mailslurp.emailController.getEmailScreenshotAsBase64({
         emailId: email.id,
         getEmailScreenshotOptions: {
             height: 480,
             width: 320
         }
     })
-    const img = Buffer.from(screenshot.base64EncodedImage, 'base64')
-    const path = join(__dirname, 'email-screenshot.png')
+    //</gen>
+    //<gen>email_screenshot_load_image_buffer
+    const imgBuffer = Buffer.from(screenshot.base64EncodedImage, 'base64')
+    //</gen>
+    //<gen>email_screenshot_diff
     const pathExpected = join(__dirname, 'email-screenshot.expected.png')
-    await writeFile(path, img)
-    await writeFile(pathExpected, img)
-    // var diff = Jimp.diff(image1, image2, threshold); // threshold ranges 0-1 (default: 0.1)
-
+    const threshold = 0.2
+    const diff = Jimp.diff(await Jimp.read(imgBuffer), await Jimp.read(pathExpected), threshold);
+    expect(diff.percent).toBeLessThan(threshold)
+    //</gen>
 }, 120_000)