eliott/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird synced 2026-04-26 09:45:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

LibWeb: Register JS-created FontFace objects for font matching

Browse Source 
Previously, FontFace objects created via the JS and added to
`document.fonts` were stored in the FontFaceSet but never participated
in font matching during style resolution. We now store both
CSS-connected and JS-created font faces in a unified map on
`FontComputer`, keyed by family name, and include them all as
candidates in the font matching algorithm.
This commit is contained in:
Tim Ledbetter
2026-04-01 17:01:14 +01:00
committed by Andreas Kling
parent d0b1482e80
commit 5b584fde1d
Notes: github-actions[bot] 2026-04-04 22:14:26 +00:00 
Author: https://github.com/tcl3
Commit: https://github.com/LadybirdBrowser/ladybird/commit/5b584fde1d0
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/8739
10 changed files with 245 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
Tests/LibWeb/Text/input/css/FontFace-arraybuffer-matching.html Normal file
View File

@@ -0,0 +1,42 @@
<!DOCTYPE html>
<script src="../include.js"></script>
<script>
promiseTest(async () => {
const fontData = await fetch("../../../Assets/HashSans.woff").then(
response => response.arrayBuffer());
const face = new FontFace("TestFont", fontData);
document.fonts.add(face);
await face.loaded;
const element = document.createElement("span");
element.style.fontFamily = "TestFont, serif";
element.style.fontSize = "20px";
element.textContent = "test";
document.body.appendChild(element);
const fallbackElement = document.createElement("span");
fallbackElement.style.fontFamily = "serif";
fallbackElement.style.fontSize = "20px";
fallbackElement.textContent = "test";
document.body.appendChild(fallbackElement);
// Force layout
document.body.offsetHeight;
const testWidth = element.offsetWidth;
const fallbackWidth = fallbackElement.offsetWidth;
println(`face.status: ${face.status}`);
println(`font matched: ${testWidth !== fallbackWidth}`);
document.fonts.delete(face);
// Force layout after removal
document.body.offsetHeight;
const afterDeleteWidth = element.offsetWidth;
println(`font unmatched after delete: ${afterDeleteWidth === fallbackWidth}`);
});
</script>