mirror of
https://github.com/vector-im/element-web.git
synced 2025-11-09 12:41:07 +01:00
b3188b47be
* Simplify favicons and other web icons browserconfig.xml seems to have died with Internet Explorer `apple-touch-icon` is awfully documented but seems like larger sizes are now preferred Use PNG for the favicon as things now support it across the board, we could even consider moving to SVG favicons in the future Optimised using oxipng, this is to simplify icon replacement in `element-web-bin` Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix paths Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update tests Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Remove border around favicons Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Add test Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Add test Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
92 lines
2.8 KiB
TypeScript
92 lines
2.8 KiB
TypeScript
/*
|
|
Copyright 2024 New Vector Ltd.
|
|
Copyright 2022 The Matrix.org Foundation C.I.C.
|
|
|
|
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
|
|
Please see LICENSE files in the repository root for full details.
|
|
*/
|
|
|
|
import "jest-canvas-mock";
|
|
|
|
import Favicon from "../../src/favicon";
|
|
|
|
jest.useFakeTimers();
|
|
|
|
describe("Favicon", () => {
|
|
beforeEach(() => {
|
|
jest.restoreAllMocks();
|
|
document.getElementsByTagName("head")[0]?.remove();
|
|
const head = document.createElement("head");
|
|
window.document.documentElement.prepend(head);
|
|
});
|
|
|
|
it("should create a link element if one doesn't yet exist", () => {
|
|
const favicon = new Favicon();
|
|
expect(favicon).toBeTruthy();
|
|
const link = window.document.querySelector("link")!;
|
|
expect(link.rel).toContain("icon");
|
|
});
|
|
|
|
it("should draw a badge if called with a non-zero value", () => {
|
|
const favicon = new Favicon();
|
|
favicon.badge(123);
|
|
jest.runAllTimers();
|
|
expect(favicon["context"].__getDrawCalls()).toMatchSnapshot();
|
|
});
|
|
|
|
it("should clear a badge if called with a zero value", () => {
|
|
const favicon = new Favicon();
|
|
favicon.badge(123);
|
|
jest.runAllTimers();
|
|
favicon.badge(0);
|
|
expect(favicon["context"].__getDrawCalls()).toMatchSnapshot();
|
|
});
|
|
|
|
it("should recreate link element for firefox and opera", () => {
|
|
window["InstallTrigger"] = {};
|
|
window["opera"] = {};
|
|
const favicon = new Favicon();
|
|
const originalLink = window.document.querySelector("link");
|
|
favicon.badge(123);
|
|
jest.runAllTimers();
|
|
const newLink = window.document.querySelector("link");
|
|
expect(originalLink).not.toStrictEqual(newLink);
|
|
});
|
|
|
|
it("should default to 144px", () => {
|
|
const head = document.getElementsByTagName("head")[0];
|
|
const link = document.createElement("link");
|
|
link.rel = "icon";
|
|
link.href = "favicon.png";
|
|
head.appendChild(link);
|
|
|
|
const spy = jest.spyOn(document, "createElement");
|
|
const favicon = new Favicon();
|
|
jest.runAllTimers();
|
|
|
|
const img = spy.mock.results[0].value;
|
|
img.onload();
|
|
|
|
expect(favicon["canvas"].height).toBe(144);
|
|
});
|
|
|
|
it("should use the size of the last favicon", () => {
|
|
const head = document.getElementsByTagName("head")[0];
|
|
const link = document.createElement("link");
|
|
link.rel = "icon";
|
|
link.sizes = "512x512";
|
|
link.href = "favicon.png";
|
|
head.appendChild(link);
|
|
|
|
const spy = jest.spyOn(document, "createElement");
|
|
const favicon = new Favicon();
|
|
jest.runAllTimers();
|
|
|
|
const img = spy.mock.results[0].value;
|
|
img.height = 512;
|
|
img.onload();
|
|
|
|
expect(favicon["canvas"].height).toBe(512);
|
|
});
|
|
});
|