30 lines
1.7 KiB
TypeScript
30 lines
1.7 KiB
TypeScript
import { expect, test } from "bun:test";
|
|
|
|
const html = await Bun.file(new URL("../index.html", import.meta.url)).text();
|
|
const layerOrder = "@layer theme, base, components, utilities;";
|
|
|
|
test("HTML 在任何外部样式或脚本之前固定 CSS 层顺序", () => {
|
|
const firstStyle = html.match(/<style\b[^>]*>([\s\S]*?)<\/style>/i);
|
|
expect(firstStyle).not.toBeNull();
|
|
const css = firstStyle![1].replace(/\/\*[\s\S]*?\*\//g, "").trim();
|
|
expect(css.startsWith(layerOrder)).toBe(true);
|
|
|
|
const firstLoad = html.search(/<script\b|<link\b[^>]*\brel=["'](?:stylesheet|modulepreload)["']/i);
|
|
expect(firstLoad).toBeGreaterThan(html.indexOf(layerOrder));
|
|
});
|
|
|
|
test("入口层顺序与 Tailwind 一致,不依赖插件和全局 CSS 的加载先后", async () => {
|
|
const tailwind = await Bun.file(new URL("../node_modules/tailwindcss/index.css", import.meta.url)).text();
|
|
const editor = await Bun.file(new URL("../src/lib/plugins/builtin/editor/editor-shell.css", import.meta.url)).text();
|
|
const firstStyle = html.match(/<style\b[^>]*>([\s\S]*?)<\/style>/i)![1];
|
|
expect(tailwind.trimStart().startsWith(layerOrder)).toBe(true);
|
|
expect(editor).toContain("@layer utilities {");
|
|
|
|
// CSS layers retain their first declared order, even when a later chunk repeats them.
|
|
const layersIn = (css: string) => [...new Set([...css.matchAll(/@layer\s+([^;{]+)[;{]/g)].flatMap((match) => match[1].split(",").map((name) => name.trim())))];
|
|
expect(layersIn(editor + tailwind).indexOf("utilities")).toBeLessThan(layersIn(editor + tailwind).indexOf("base"));
|
|
for (const chunks of [editor + tailwind, tailwind + editor]) {
|
|
expect(layersIn(firstStyle + chunks)).toEqual(["theme", "base", "components", "utilities"]);
|
|
}
|
|
});
|