Merge pull request #16794 from Snuffleupagus/CSS-round
Use the `round` CSS function in the `setLayerDimensions` helper function
This commit is contained in:
commit
de1f31aae8
@ -967,6 +967,8 @@ function getCurrentTransformInverse(ctx) {
|
|||||||
return [a, b, c, d, e, f];
|
return [a, b, c, d, e, f];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const useRound = globalThis.CSS?.supports?.("width: round(1.5px, 1px)");
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {HTMLDivElement} div
|
* @param {HTMLDivElement} div
|
||||||
* @param {PageViewport} viewport
|
* @param {PageViewport} viewport
|
||||||
@ -983,14 +985,10 @@ function setLayerDimensions(
|
|||||||
const { pageWidth, pageHeight } = viewport.rawDims;
|
const { pageWidth, pageHeight } = viewport.rawDims;
|
||||||
const { style } = div;
|
const { style } = div;
|
||||||
|
|
||||||
// TODO: Investigate if it could be interesting to use the css round
|
const w = `var(--scale-factor) * ${pageWidth}px`,
|
||||||
// function (https://developer.mozilla.org/en-US/docs/Web/CSS/round):
|
h = `var(--scale-factor) * ${pageHeight}px`;
|
||||||
// const widthStr =
|
const widthStr = useRound ? `round(${w}, 1px)` : `calc(${w})`,
|
||||||
// `round(down, var(--scale-factor) * ${pageWidth}px, 1px)`;
|
heightStr = useRound ? `round(${h}, 1px)` : `calc(${h})`;
|
||||||
// const heightStr =
|
|
||||||
// `round(down, var(--scale-factor) * ${pageHeight}px, 1px)`;
|
|
||||||
const widthStr = `calc(var(--scale-factor) * ${pageWidth}px)`;
|
|
||||||
const heightStr = `calc(var(--scale-factor) * ${pageHeight}px)`;
|
|
||||||
|
|
||||||
if (!mustFlip || viewport.rotation % 180 === 0) {
|
if (!mustFlip || viewport.rotation % 180 === 0) {
|
||||||
style.width = widthStr;
|
style.width = widthStr;
|
||||||
|
@ -945,6 +945,8 @@ async function startBrowser(browserName, startUrl = "") {
|
|||||||
"gfx.offscreencanvas.enabled": true,
|
"gfx.offscreencanvas.enabled": true,
|
||||||
// Disable gpu acceleration
|
// Disable gpu acceleration
|
||||||
"gfx.canvas.accelerated": false,
|
"gfx.canvas.accelerated": false,
|
||||||
|
// Enable the `round` CSS function.
|
||||||
|
"layout.css.round.enabled": true,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user