External/SnapOtter
1
0
Fork 0
mirror of https://github.com/snapotter-hq/SnapOtter.git synced 2026-08-03 07:46:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(beautify): add device frame assets and PNG frame compositing

Browse Source
This commit is contained in:
SnapOtter
2026-05-08 16:12:46 +08:00
parent d8c1fdf5c2
commit 69e107fbab
15 changed files with 233 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/unit/beautify-frames.test.ts
+25 -4
View File
@@ -71,12 +71,33 @@ describe("renderFrame", () => {
expect(meta.height!).toBeGreaterThan(300);
});
it("passes through device frames unchanged (handled later)", async () => {
const img = await makeImage(400, 300);
it("renders iPhone frame with image composited into screen area", async () => {
const img = await makeImage(400, 800);
const result = await renderFrame(img, "iphone");
const meta = await sharp(result).metadata();
expect(meta.width).toBe(400);
expect(meta.height).toBe(300);
expect(meta.width!).toBeGreaterThan(400);
expect(meta.height!).toBeGreaterThan(800);
});
it("renders MacBook frame", async () => {
const img = await makeImage(800, 500);
const result = await renderFrame(img, "macbook");
const meta = await sharp(result).metadata();
expect(meta.width!).toBeGreaterThan(800);
});
it("renders iPad frame", async () => {
const img = await makeImage(400, 600);
const result = await renderFrame(img, "ipad");
const meta = await sharp(result).metadata();
expect(meta.width!).toBeGreaterThan(400);
});
it("renders iPhone dark frame", async () => {
const img = await makeImage(400, 800);
const result = await renderFrame(img, "iphone-dark");
const meta = await sharp(result).metadata();
expect(meta.width!).toBeGreaterThan(400);
});
it("handles wide images", async () => {