imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use browser's font size instead of hardcoded 16px as root font size (#12246)

Browse source 
* WIP Use browser font size instead of hardcoded 16px

* Add font migration to v3

* Remove custom font size input

* Use a dropdown instead of a slider

* Add margin to the font size dropdown

* Fix `UpdateFontSizeDelta` action typo

* Fix `fontScale`in `Call.ts`

* Rename `baseFontSizeV3` to `fontSizeDelta`

* Update playwright test

* Add `default` next to the browser font size

* Remove remaining `TODO`

* Remove falsy `private`

* Improve doc

* Update snapshots after develop merge

* Remove commented import
This commit is contained in:
Florian Duros 2024-02-21 12:23:07 +01:00 • committed by GitHub
parent 36a8d503df
commit 6d55ce0217
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
17 changed files with 453 additions and 366 deletions
Download patch file Download diff file Expand all files Collapse all files

29
test/settings/watchers/FontWatcher-test.tsx
View file

@ -123,6 +123,7 @@ describe("FontWatcher", function () {
let watcher: FontWatcher | undefined;
beforeEach(() => {
document.documentElement.style.fontSize = "14px";
watcher = new FontWatcher();
});
@ -132,13 +133,35 @@ describe("FontWatcher", function () {
it("should not run the migration", async () => {
await watcher!.start();
expect(SettingsStore.getValue("baseFontSizeV2")).toBe(16);
expect(SettingsStore.getValue("fontSizeDelta")).toBe(0);
});
it("should migrate to default font size", async () => {
it("should migrate from V1 font size to V3", async () => {
await SettingsStore.setValue("baseFontSize", null, SettingLevel.DEVICE, 13);
await watcher!.start();
expect(SettingsStore.getValue("baseFontSizeV2")).toBe(19);
// 13px (V1 font size) + 5px (V1 offset) + 1px (root font size increase) - 14px (default browser font size) = 5px
expect(SettingsStore.getValue("fontSizeDelta")).toBe(5);
// baseFontSize should be cleared
expect(SettingsStore.getValue("baseFontSize")).toBe(0);
});
it("should migrate from V2 font size to V3 using browser font size", async () => {
await SettingsStore.setValue("baseFontSizeV2", null, SettingLevel.DEVICE, 18);
await watcher!.start();
// 18px - 14px (default browser font size) = 2px
expect(SettingsStore.getValue("fontSizeDelta")).toBe(4);
// baseFontSize should be cleared
expect(SettingsStore.getValue("baseFontSizeV2")).toBe(0);
});
it("should migrate from V2 font size to V3 using fallback font size", async () => {
document.documentElement.style.fontSize = "";
await SettingsStore.setValue("baseFontSizeV2", null, SettingLevel.DEVICE, 18);
await watcher!.start();
// 18px - 16px (fallback) = 2px
expect(SettingsStore.getValue("fontSizeDelta")).toBe(2);
// baseFontSize should be cleared
expect(SettingsStore.getValue("baseFontSizeV2")).toBe(0);
});
});
});