smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

use DOM height only for safari to fix LS

Browse source
This commit is contained in:
Aakansha Doshi 2023-04-06 14:18:13 +05:30
parent f21a6b587a
commit d75889238d
3 changed files with 18 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/element/textElement.ts
View file

@ -289,10 +289,13 @@ export const measureText = (
.map((x) => x || " ")
.join("\n");
const fontSize = parseFloat(font);
const height = getTextHeight(text, fontSize, lineHeight);
let height = getTextHeight(text, fontSize, lineHeight);
const width = getTextWidth(text, font);
const { baseline } = getDOMMetrics(text, font, lineHeight);
return { width, height, baseline };
const domMetrics = getDOMMetrics(text, font, lineHeight);
if (isSafari) {
height = domMetrics.height;
}
return { width, height, baseline: domMetrics.baseline };
};
export const getDOMMetrics = (
@ -313,7 +316,6 @@ export const getDOMMetrics = (
}
container.style.lineHeight = String(lineHeight);
const canvasHeight = getTextHeight(text, parseFloat(font), lineHeight);
container.innerText = text;
@ -326,23 +328,9 @@ export const getDOMMetrics = (
span.style.width = "1px";
span.style.height = "1px";
container.appendChild(span);
let baseline = span.offsetTop + span.offsetHeight;
const baseline = span.offsetTop + span.offsetHeight;
const height = container.offsetHeight;
if (isSafari) {
// In Safari sometimes DOM height could be less than canvas height due to
// which text could go out of the bounding box hence shifting the baseline
// to make sure text is rendered correctly
if (canvasHeight > height) {
baseline += canvasHeight - height;
}
// In Safari sometimes DOM height could be more than canvas height due to
// which text could go out of the bounding box hence shifting the baseline
// to make sure text is rendered correctly
if (height > canvasHeight) {
baseline -= height - canvasHeight;
}
}
document.body.removeChild(container);
return { baseline, height };
};