eliott/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird synced 2026-04-28 10:37:17 +02:00
Code Issues Packages Projects Releases Wiki Activity

LibWeb: Correctly parse logical border-*-*-radius shorthands

Browse Source 
Builds on #7609 by parsing these properties correctly in the first place
This commit is contained in:
Callum Law
2026-01-25 15:34:43 +13:00
committed by Alexander Kalenik
parent 191e0e8c18
commit afdde488c3
Notes: github-actions[bot] 2026-02-06 11:08:00 +00:00 
Author: https://github.com/Calme1709
Commit: https://github.com/LadybirdBrowser/ladybird/commit/afdde488c3f
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/7615
5 changed files with 56 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
Tests/LibWeb/Text/input/css/logical-border-radius-computed.html
View File

@@ -39,5 +39,37 @@ test(() => {
target.style.borderEndEndRadius = "calc(100% / 4)";
println(`border-end-end-radius: calc(100% / 4) -> ${getComputedStyle(target).borderBottomRightRadius}`);
// Reset
target.style.cssText = "width: 200px; height: 100px;";
// Test <length-percentage>{2} values
target.style.borderStartStartRadius = "50% 0%";
println(`border-start-start-radius: 50% 0% -> ${getComputedStyle(target).borderTopLeftRadius}`);
target.style.borderStartEndRadius = "45% 5%";
println(`border-start-end-radius: 45% 5% -> ${getComputedStyle(target).borderTopRightRadius}`);
target.style.borderEndStartRadius = "40% 10%";
println(`border-end-start-radius: 40% 10% -> ${getComputedStyle(target).borderBottomLeftRadius}`);
target.style.borderEndEndRadius = "35% 15%";
println(`border-end-end-radius: 35% 15% -> ${getComputedStyle(target).borderBottomRightRadius}`);
// Reset
target.style.cssText = "width: 200px; height: 100px;";
// Test <slash-separated-border-radius-syntax> values
target.style.borderStartStartRadius = "30% / 20%";
println(`border-start-start-radius: 30% / 20% -> ${getComputedStyle(target).borderTopLeftRadius}`);
target.style.borderStartEndRadius = "25% / 15%";
println(`border-start-end-radius: 25% / 15% -> ${getComputedStyle(target).borderTopRightRadius}`);
target.style.borderEndStartRadius = "20% / 10%";
println(`border-end-start-radius: 20% / 10% -> ${getComputedStyle(target).borderBottomLeftRadius}`);
target.style.borderEndEndRadius = "15% / 5%";
println(`border-end-end-radius: 15% / 5% -> ${getComputedStyle(target).borderBottomRightRadius}`);
});
</script>