mirror of
https://github.com/HKUDS/nanobot.git
synced 2026-08-31 16:21:50 +03:00
* fix(webui): keep iOS PWA controls inside safe area * fix(webui): blend iOS PWA chrome into dark canvas * fix(webui): sync PWA chrome with app theme
51 lines
2.2 KiB
TypeScript
51 lines
2.2 KiB
TypeScript
import { readFileSync } from "node:fs";
|
|
import { resolve } from "node:path";
|
|
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
describe("index.html", () => {
|
|
it("keeps browser zoom available", () => {
|
|
const html = readFileSync(resolve(process.cwd(), "index.html"), "utf8");
|
|
const viewport = html.match(/<meta\s+name="viewport"\s+content="([^"]+)"/i)?.[1];
|
|
|
|
expect(viewport).toContain("width=device-width");
|
|
expect(viewport).not.toContain("user-scalable=no");
|
|
expect(viewport).not.toMatch(/maximum-scale\s*=\s*1(?:\.0)?(?:,|$)/);
|
|
});
|
|
|
|
it("lets iOS keep standalone content inside the safe area", () => {
|
|
const html = readFileSync(resolve(process.cwd(), "index.html"), "utf8");
|
|
const viewport = html.match(/<meta\s+name="viewport"\s+content="([^"]+)"/i)?.[1];
|
|
|
|
expect(viewport).toContain("viewport-fit=auto");
|
|
expect(viewport).not.toContain("viewport-fit=cover");
|
|
});
|
|
|
|
it("provides light and dark PWA chrome colors", () => {
|
|
const html = readFileSync(resolve(process.cwd(), "index.html"), "utf8");
|
|
const manifest = JSON.parse(
|
|
readFileSync(resolve(process.cwd(), "public/manifest.json"), "utf8"),
|
|
) as {
|
|
background_color?: string;
|
|
theme_color?: string;
|
|
color_scheme_dark?: { background_color?: string; theme_color?: string };
|
|
};
|
|
const document = new DOMParser().parseFromString(html, "text/html");
|
|
const themeColor = document.querySelector<HTMLMetaElement>('meta[name="theme-color"]');
|
|
const lightBodyBackground = html.match(/body\s*{[^}]*background:\s*([^;]+);/s)?.[1]?.trim();
|
|
const darkBodyBackground = html.match(
|
|
/html\.dark body\s*{[^}]*background:\s*([^;]+);/s,
|
|
)?.[1]?.trim();
|
|
|
|
expect(themeColor?.content).toBe("#ffffff");
|
|
expect(themeColor?.dataset.themeColorLight).toBe("#ffffff");
|
|
expect(themeColor?.dataset.themeColorDark).toBe("#303030");
|
|
expect(lightBodyBackground).toBe("#ffffff");
|
|
expect(darkBodyBackground).toBe("#303030");
|
|
expect(manifest.background_color).toBe("#ffffff");
|
|
expect(manifest.theme_color).toBe("#ffffff");
|
|
expect(manifest.color_scheme_dark?.background_color).toBe("#303030");
|
|
expect(manifest.color_scheme_dark?.theme_color).toBe("#303030");
|
|
});
|
|
});
|