Files
bun.sh/test/bundler/css/wpt/background-computed.test.ts
2025-01-21 06:44:54 -08:00

65 lines
2.6 KiB
TypeScript

import { describe } from "bun:test";
import { itBundled } from "../../expectBundled";
const runTest = (property: string, input: string, expected: string) => {
const testTitle = `${property}: ${input}`;
itBundled(testTitle, {
files: {
"/a.css": /* css */ `
h1 {
${property}: ${input}
}
`,
},
outfile: "out.css",
onAfterBundle(api) {
api.expectFile("/out.css").toEqualIgnoringWhitespace(`
/* a.css */
h1 {
${property}: ${expected};
}
`);
},
});
};
describe("background-computed", () => {
runTest("background-attachment", "local", "local");
runTest("background-attachment", "scroll, fixed", "scroll, fixed");
runTest("background-attachment", "local, fixed, scroll", "local, fixed, scroll");
runTest("background-attachment", "local, fixed, scroll, fixed", "local, fixed, scroll, fixed");
runTest("background-clip", "border-box", "border-box");
runTest("background-clip", "content-box, border-box", "content-box, border-box");
runTest("background-clip", "border-box, padding-box, content-box", "border-box, padding-box, content-box");
runTest(
"background-clip",
"content-box, border-box, padding-box, content-box",
"content-box, border-box, padding-box, content-box",
);
runTest("background-clip", "content-box, border-box, padding-box", "content-box, border-box, padding-box");
runTest("background-clip", "content-box, border-box, border-area", "content-box, border-box, border-area");
runTest("background-color", "rgb(255, 0, 0)", "red");
runTest("background-origin", "border-box", "border-box");
runTest("background-origin", "content-box, border-box", "content-box, border-box");
runTest("background-origin", "border-box, padding-box, content-box", "border-box, padding-box, content-box");
runTest(
"background-origin",
"content-box, border-box, padding-box, content-box",
"content-box, border-box, padding-box, content-box",
);
runTest("background-position", "50% 6px", "50% 6px");
runTest("background-position", "12px 13px, 50% 6px", "12px 13px, 50% 6px");
runTest("background-position", "12px 13px, 50% 6px, 30px -10px", "12px 13px, 50% 6px, 30px -10px");
runTest(
"background-position",
"12px 13px, 50% 6px, 30px -10px, -7px 8px",
"12px 13px, 50% 6px, 30px -10px, -7px 8px",
);
runTest("background-position-x", "0.5em", ".5em");
runTest("background-position-x", "-20%, 10px", "-20%, 10px");
runTest("background-position-x", "center, left, right", "center, left, right");
runTest("background-position-x", "calc(10px - 0.5em), -20%, right, 15%", "calc(10px - .5em), -20%, right, 15%");
runTest("background-position-y", "0.5em", ".5em");
});