Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
75 changes: 68 additions & 7 deletions .github/workflows/build.yml
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v4
uses: actions/checkout@v5

- name: Setup Zig
uses: mlugg/setup-zig@v2
Expand Down Expand Up @@ -127,7 +127,7 @@ jobs:
shell: bash
steps:
- name: Checkout code
uses: actions/checkout@v4
uses: actions/checkout@v5

- name: Setup Zig
uses: mlugg/setup-zig@v2
Expand Down Expand Up @@ -175,7 +175,7 @@ jobs:
shell: bash
steps:
- name: Checkout code
uses: actions/checkout@v4
uses: actions/checkout@v5

- name: Setup Zig
uses: mlugg/setup-zig@v2
Expand Down Expand Up @@ -203,7 +203,7 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v4
uses: actions/checkout@v5

- name: Download x86_64-linux artifact
uses: actions/download-artifact@v4
Expand Down Expand Up @@ -238,7 +238,7 @@ jobs:
image: mcr.microsoft.com/playwright:v1.56.0-noble
steps:
- name: Checkout code
uses: actions/checkout@v4
uses: actions/checkout@v5

- name: Download x86_64-linux artifact
uses: actions/download-artifact@v4
Expand Down Expand Up @@ -274,12 +274,48 @@ jobs:
path: npm_packages/playwright-odiff/test-results
retention-days: 7

valgrind:
name: Valgrind Memory Check
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v5

- name: Setup Zig
uses: mlugg/setup-zig@v2
with:
version: 0.15.2

- name: Install nasm and valgrind
run: |
sudo apt-get update
sudo apt-get install -y nasm valgrind

- name: Build with debug symbols
run: |
zig build -Doptimize=Debug

- name: Run valgrind memcheck - normal mode with diff output
run: |
valgrind --leak-check=full --show-leak-kinds=all --error-exitcode=1 --errors-for-leak-kinds=definite,possible \
./zig-out/bin/odiff test/png/orange.png test/png/orange_changed.png /tmp/diff-output.png

- name: Run valgrind memcheck - normal mode without diff output
run: |
valgrind --leak-check=full --show-leak-kinds=all --error-exitcode=1 --errors-for-leak-kinds=definite,possible \
./zig-out/bin/odiff test/png/orange.png test/png/orange_changed.png

- name: Run valgrind memcheck - server mode
run: |
timeout 5 valgrind --leak-check=full --show-leak-kinds=all --error-exitcode=1 --errors-for-leak-kinds=definite,possible \
./zig-out/bin/odiff --server || [ $? -eq 124 ]

spellcheck:
name: Spell check
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v4
uses: actions/checkout@v5

- name: Run typos
uses: crate-ci/typos@master
Expand All @@ -293,7 +329,7 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v1
uses: actions/checkout@v5

- name: Download all built binaries
uses: actions/download-artifact@v4
Expand Down Expand Up @@ -330,6 +366,10 @@ jobs:
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

- name: Build playwright-odiff package
working-directory: npm_packages/playwright-odiff
run: npm run build

- name: Publish playwright-odiff package
working-directory: npm_packages/playwright-odiff
run: npm publish
Expand All @@ -342,3 +382,24 @@ jobs:
files: "binaries/*"
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

commit-sanity-check:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v5

- name: Verify binary was not commit in npm package folder
run: |
if ! file ./npm_packages/odiff-bin/bin/odiff.exe | grep -q "Node.js script executable"; then
echo "Looks like you commited a local binary to ./npm_packages/odiff-bin/bin/odiff.exe. Please revert"
exit 1
fi

- name: Check docs in readme
run: |
npm run update-readme
if ! git diff --quiet; then
echo "Please run `npm run update-readme` and commit changes."
exit 1
fi
Binary file modified images/diff.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 3 additions & 2 deletions npm_packages/playwright-odiff/package.json
Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
{
"name": "playwright-odiff",
"version": "4.3.2",
"version": "4.4.0-beta.1",
"description": "Playwright custom matcher using odiff for screenshot comparison",
"type": "module",
"main": "dist/index.js",
"types": "dist/index.d.ts",
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/index.js",
"types": "./dist/index.d.ts"
"default": "./dist/index.js"
}
},
"scripts": {
Expand Down
4 changes: 2 additions & 2 deletions npm_packages/playwright-odiff/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import type { ODiffScreenshotOptions } from "./types";
import type { ODiffScreenshotOptions } from "./types.js";

export { toHaveScreenshotOdiff } from "./toHaveScreenshotOdiff";
export { toHaveScreenshotOdiff } from "./toHaveScreenshotOdiff.js";
export type { ODiffScreenshotOptions as OdiffScreenshotOptions };

// Type augmentation for Playwright's expect
Expand Down
4 changes: 2 additions & 2 deletions npm_packages/playwright-odiff/src/setup.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { expect } from "@playwright/test";
import { toHaveScreenshotOdiff } from "./toHaveScreenshotOdiff";
import "./types";
import { toHaveScreenshotOdiff } from "./toHaveScreenshotOdiff.js";
import "./types.js";

expect.extend({
toHaveScreenshotOdiff,
Expand Down
16 changes: 14 additions & 2 deletions npm_packages/playwright-odiff/src/snapshotHelper.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
import fs from "fs";
import path from "path";
import type { TestInfo, Locator } from "@playwright/test";
import type { ODiffScreenshotOptions, MatcherResult } from "./types";
import type { ODiffScreenshotOptions, MatcherResult } from "./types.js";
import { ODiffOptions } from "odiff-bin";

type NameOrSegments = string | string[];
Expand Down Expand Up @@ -269,7 +269,19 @@ export class SnapshotHelper {
return this.createMatcherResult(output.join("\n"), false, log);
}

handleMatching(): MatcherResult {
// because we write screenshots directly to the output path we
// have to simply unlink them on success which is a very fast operation
async handleMatching(): Promise<MatcherResult> {
await Promise.all([
fs.promises.unlink(this.actualPath).catch(() => {}),
fs.promises.unlink(this.previousPath).catch(() => {}),
fs.promises.unlink(this.diffPath).catch(() => {}),
]).catch(() => {});

// Try to remove the test-results directory if it's empty
const testResultsDir = path.dirname(this.actualPath);
await fs.promises.rmdir(testResultsDir).catch(() => {});

return this.createMatcherResult("", true);
}

Expand Down
7 changes: 3 additions & 4 deletions npm_packages/playwright-odiff/src/toHaveScreenshotOdiff.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@ import fs from "fs/promises";
import fssync from "fs";
import path from "path";
import type { Page, Locator, TestInfo } from "@playwright/test";
import type { ODiffScreenshotOptions, MatcherResult } from "./types";
import type { ODiffScreenshotOptions, MatcherResult } from "./types.js";
import { test } from "@playwright/test";
import { SnapshotHelper } from "./snapshotHelper";
import { SnapshotHelper } from "./snapshotHelper.js";
import { ODiffServer } from "odiff-bin";

type ODiffServerType = InstanceType<typeof ODiffServer>;
Expand Down Expand Up @@ -422,15 +422,14 @@ export async function toHaveScreenshotOdiff(
true,
);
}
return helper.handleMatching();
return await helper.handleMatching();
}

if (
helper.updateSnapshots === "changed" ||
helper.updateSnapshots === "all"
) {
if (result.hasActual) {
// Copy actual to expected (no read/write, just kernel copy)
await fs.copyFile(helper.actualPath, helper.expectedPath);
console.log(helper.expectedPath + " is re-generated, writing actual.");
return helper.createMatcherResult(
Expand Down
4 changes: 1 addition & 3 deletions npm_packages/playwright-odiff/test/dynamic-content.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,11 @@ test.describe("toHaveScreenshotOdiff - Dynamic Content", () => {
await page.goto(dynamicPagePath);
await page.waitForLoadState("networkidle");

// Take first screenshot with static content
await expect(page).toHaveScreenshotOdiff("dynamic-first.png");

// Click trigger to update the number
await page.click("#trigger");
await page.waitForTimeout(100);

// Screenshots should be different due to changed number
await expect(page).not.toHaveScreenshotOdiff("dynamic-first.png");
});

Expand Down
6 changes: 6 additions & 0 deletions npm_packages/playwright-odiff/test/fixtures/dynamic-page.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Expand Down Expand Up @@ -59,6 +60,7 @@
}
</style>
</head>

<body>
<div class="container">
<div class="label">Performance Now</div>
Expand All @@ -69,10 +71,14 @@
<script>
function updateNumber() {
document.getElementById('number').textContent = performance.now().toFixed(0);
setInterval(() => {
document.getElementById('number').textContent = performance.now().toFixed(0);
}, 10)
}

// Update number once when trigger button is clicked
document.getElementById('trigger').addEventListener('click', updateNumber);
</script>
</body>

</html>
4 changes: 2 additions & 2 deletions npm_packages/playwright-odiff/tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@
// Language and Environment
"target": "ES2022",
"lib": ["ES2022"],
"module": "ES2022",
"module": "nodenext",

// Module Resolution
"moduleResolution": "bundler",
"moduleResolution": "nodenext",
"resolveJsonModule": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
Expand Down
19 changes: 9 additions & 10 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading