Matrix/element-call-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-call.git synced 2026-09-04 21:35:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

Review:

Browse Source 
Use `.each` to shorten the tests.
This commit is contained in:
Timo
2024-09-24 21:35:25 +02:00
parent 7ad033ab39
commit 2f62c893bd
1 changed files with 20 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
src/useTheme.test.ts
View File

@@ -27,84 +27,40 @@ vi.mock("./UrlParams", () => ({
describe("useTheme", () => { describe("useTheme", () => {
let originalClassList: DOMTokenList; let originalClassList: DOMTokenList;
beforeEach(() => { beforeEach(() => {
// Save the original classList so we can restore it later // Save the original classList to setup spies
originalClassList = document.body.classList; originalClassList = document.body.classList;
vi.spyOn(document.body.classList, "add").mockImplementation(vi.fn()); vi.spyOn(originalClassList, "add");
vi.spyOn(document.body.classList, "remove").mockImplementation(vi.fn()); vi.spyOn(originalClassList, "remove");
vi.spyOn(document.body.classList, "item").mockImplementation(() => null); vi.spyOn(originalClassList, "item").mockReturnValue(null);
}); });
afterEach(() => { afterEach(() => {
vi.clearAllMocks(); vi.clearAllMocks();
}); });
test("should apply dark theme by default when no theme is specified", () => { describe.each([
// Mock useUrlParams to return no theme { setTheme: null, add: ["cpd-theme-dark"] },
(useUrlParams as Mock).mockReturnValue({ theme: null }); { setTheme: "light", add: ["cpd-theme-light"] },
{ setTheme: "dark-high-contrast", add: ["cpd-theme-dark-hc"] },
{ setTheme: "light-high-contrast", add: ["cpd-theme-light-hc"] },
])("apply procedure", ({ setTheme, add }) => {
test(`should apply ${add[0]} theme when ${setTheme} theme is specified`, () => {
(useUrlParams as Mock).mockReturnValue({ theme: setTheme });
renderHook(() => useTheme()); renderHook(() => useTheme());
expect(originalClassList.remove).toHaveBeenCalledWith( expect(originalClassList.remove).toHaveBeenCalledWith(
"cpd-theme-light", "cpd-theme-light",
"cpd-theme-dark", "cpd-theme-dark",
"cpd-theme-light-hc", "cpd-theme-light-hc",
"cpd-theme-dark-hc", "cpd-theme-dark-hc",
); );
expect(originalClassList.add).toHaveBeenCalledWith("cpd-theme-dark"); expect(originalClassList.add).toHaveBeenCalledWith(...add);
});
test("should apply light theme when theme is set to light", () => {
// Mock useUrlParams to return light theme
(useUrlParams as Mock).mockReturnValue({ theme: "light" });
renderHook(() => useTheme());
expect(originalClassList.remove).toHaveBeenCalledWith(
"cpd-theme-light",
"cpd-theme-dark",
"cpd-theme-light-hc",
"cpd-theme-dark-hc",
);
expect(originalClassList.add).toHaveBeenCalledWith("cpd-theme-light");
});
test("should apply dark-high-contrast theme when theme is set to dark-high-contrast", () => {
// Mock useUrlParams to return dark-high-contrast theme
(useUrlParams as Mock).mockReturnValue({
theme: "dark-high-contrast",
}); });
renderHook(() => useTheme());
expect(originalClassList.remove).toHaveBeenCalledWith(
"cpd-theme-light",
"cpd-theme-dark",
"cpd-theme-light-hc",
"cpd-theme-dark-hc",
);
expect(originalClassList.add).toHaveBeenCalledWith("cpd-theme-dark-hc");
});
test("should apply light-high-contrast theme when theme is set to light-high-contrast", () => {
// Mock useUrlParams to return light-high-contrast theme
(useUrlParams as Mock).mockReturnValue({
theme: "light-high-contrast",
});
renderHook(() => useTheme());
expect(originalClassList.remove).toHaveBeenCalledWith(
"cpd-theme-light",
"cpd-theme-dark",
"cpd-theme-light-hc",
"cpd-theme-dark-hc",
);
expect(originalClassList.add).toHaveBeenCalledWith("cpd-theme-light-hc");
}); });
test("should not reapply the same theme if it hasn't changed", () => { test("should not reapply the same theme if it hasn't changed", () => {
// Mock useUrlParams to return dark theme initially
(useUrlParams as Mock).mockReturnValue({ theme: "dark" }); (useUrlParams as Mock).mockReturnValue({ theme: "dark" });
// Simulate a previous theme // Simulate a previous theme
originalClassList.item = vi.fn().mockReturnValue("cpd-theme-dark"); originalClassList.item = vi.fn().mockReturnValue("cpd-theme-dark");