Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/improsocial/impro
An extensible Bluesky client for web impro.social
Something went wrong. Try again.
JavaScript
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166import { describe, it } from "node:test";import assert from "node:assert/strict";import { Theme, getDefaultHighlightColor, getDefaultLikeColor, getDefaultColorScheme,} from "/js/theme.js";
describe("save", () => { it("does not store values that match the defaults", () => { localStorage.clear(); const theme = new Theme({ highlightColor: getDefaultHighlightColor(), likeColor: getDefaultLikeColor(), colorScheme: getDefaultColorScheme(), }); theme.save(); assert.deepEqual(localStorage.getItem("theme-highlightColorv2"), null); assert.deepEqual(localStorage.getItem("theme-likeColor"), null); assert.deepEqual(localStorage.getItem("theme-colorScheme"), null); });
it("stores values that differ from the defaults", () => { localStorage.clear(); const theme = new Theme({ highlightColor: "#123456", likeColor: "#abcdef", colorScheme: "dark", }); theme.save(); assert.deepEqual(localStorage.getItem("theme-highlightColorv2"), "#123456"); assert.deepEqual(localStorage.getItem("theme-likeColor"), "#abcdef"); assert.deepEqual(localStorage.getItem("theme-colorScheme"), "dark"); });
it("removes previously-stored values when reset to the default", () => { localStorage.clear(); localStorage.setItem("theme-highlightColorv2", "#123456"); localStorage.setItem("theme-likeColor", "#abcdef"); localStorage.setItem("theme-colorScheme", "dark"); const theme = new Theme({ highlightColor: getDefaultHighlightColor(), likeColor: getDefaultLikeColor(), colorScheme: getDefaultColorScheme(), }); theme.save(); assert.deepEqual(localStorage.getItem("theme-highlightColorv2"), null); assert.deepEqual(localStorage.getItem("theme-likeColor"), null); assert.deepEqual(localStorage.getItem("theme-colorScheme"), null); });});
describe("getDefaultColorScheme", () => { it('returns "system"', () => { assert.deepEqual(getDefaultColorScheme(), "system"); });});
describe("fromLocalStorage", () => { it("reads stored values when present", () => { localStorage.clear(); localStorage.setItem("theme-highlightColorv2", "#111111"); localStorage.setItem("theme-likeColor", "#222222"); localStorage.setItem("theme-colorScheme", "dark"); const theme = Theme.fromLocalStorage(); assert.deepEqual(theme.$highlightColor.get(), "#111111"); assert.deepEqual(theme.$likeColor.get(), "#222222"); assert.deepEqual(theme.$colorScheme.get(), "dark"); });
it("falls back to defaults when nothing is stored", () => { localStorage.clear(); const theme = Theme.fromLocalStorage(); assert.deepEqual(theme.$highlightColor.get(), getDefaultHighlightColor()); assert.deepEqual(theme.$likeColor.get(), getDefaultLikeColor()); assert.deepEqual(theme.$colorScheme.get(), getDefaultColorScheme()); });});
describe("update methods", () => { it("updateHighlightColor sets the value and persists it", () => { localStorage.clear(); const theme = new Theme({ highlightColor: getDefaultHighlightColor(), likeColor: getDefaultLikeColor(), colorScheme: getDefaultColorScheme(), }); theme.updateHighlightColor("#abcdef"); assert.deepEqual(theme.$highlightColor.get(), "#abcdef"); assert.deepEqual(localStorage.getItem("theme-highlightColorv2"), "#abcdef"); });
it("updateLikeColor sets the value and persists it", () => { localStorage.clear(); const theme = new Theme({ highlightColor: getDefaultHighlightColor(), likeColor: getDefaultLikeColor(), colorScheme: getDefaultColorScheme(), }); theme.updateLikeColor("#abcdef"); assert.deepEqual(theme.$likeColor.get(), "#abcdef"); assert.deepEqual(localStorage.getItem("theme-likeColor"), "#abcdef"); });
it("updateColorScheme sets the value and persists it", () => { localStorage.clear(); const theme = new Theme({ highlightColor: getDefaultHighlightColor(), likeColor: getDefaultLikeColor(), colorScheme: getDefaultColorScheme(), }); theme.updateColorScheme("light"); assert.deepEqual(theme.$colorScheme.get(), "light"); assert.deepEqual(localStorage.getItem("theme-colorScheme"), "light"); });});
describe("apply", () => { it("sets CSS custom properties on the root element", () => { const theme = new Theme({ highlightColor: "#abcdef", likeColor: "#fedcba", colorScheme: "dark", }); theme.apply(); assert.deepEqual( document.documentElement.style.getPropertyValue("--highlight-color"), "#abcdef", ); assert.deepEqual( document.documentElement.style.getPropertyValue("--like-color"), "#fedcba", ); assert.deepEqual( document.documentElement.style.getPropertyValue("color-scheme"), "dark", ); });
it('expands "system" color scheme to "light dark"', () => { const theme = new Theme({ highlightColor: "#abcdef", likeColor: "#fedcba", colorScheme: "system", }); theme.apply(); assert.deepEqual( document.documentElement.style.getPropertyValue("color-scheme"), "light dark", ); });
it("creates a theme-color meta tag if missing", () => { document.querySelector("meta[name='theme-color']")?.remove(); const theme = new Theme({ highlightColor: "#abcdef", likeColor: "#fedcba", colorScheme: "light", }); theme.apply(); const meta = document.querySelector("meta[name='theme-color']"); assert.deepEqual(meta !== null, true); });});