fix: 🐛 broken emojis when wrap text (#6153)

* fix: 🐛 broken emojis when wrap text

* refactor: Delete unnecessary "else" (reduce indentation)

* fix: remove code block that causes the emojis to disappear

* Apply suggestions from code review

Co-authored-by: David Luzar <luzar.david@gmail.com>

* fix: 🚑 possibly undefined value

* Add spec

Co-authored-by: David Luzar <luzar.david@gmail.com>
Co-authored-by: Aakansha Doshi <aakansha1216@gmail.com>
pull/4281/merge
Ignacio Cuadra 2 years ago committed by GitHub
parent cf38c0f933
commit b52c8943e4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -12,6 +12,20 @@ describe("Test wrapText", () => {
expect(res).toBe("Hello whats up "); expect(res).toBe("Hello whats up ");
}); });
it("should work with emojis", () => {
const text = "😀";
const maxWidth = 1;
const res = wrapText(text, font, maxWidth);
expect(res).toBe("😀");
});
it("should show the text correctly when min width reached", () => {
const text = "Hello😀";
const maxWidth = 10;
const res = wrapText(text, font, maxWidth);
expect(res).toBe("H\ne\nl\nl\no\n😀");
});
describe("When text doesn't contain new lines", () => { describe("When text doesn't contain new lines", () => {
const text = "Hello whats up"; const text = "Hello whats up";
[ [

@ -359,96 +359,94 @@ export const wrapText = (text: string, font: FontString, maxWidth: number) => {
// This means its newline so push it // This means its newline so push it
if (words.length === 1 && words[0] === "") { if (words.length === 1 && words[0] === "") {
lines.push(words[0]); lines.push(words[0]);
} else { return; // continue
let currentLine = ""; }
let currentLineWidthTillNow = 0; let currentLine = "";
let currentLineWidthTillNow = 0;
let index = 0; let index = 0;
while (index < words.length) { while (index < words.length) {
const currentWordWidth = getLineWidth(words[index], font); const currentWordWidth = getLineWidth(words[index], font);
// Start breaking longer words exceeding max width // Start breaking longer words exceeding max width
if (currentWordWidth >= maxWidth) { if (currentWordWidth >= maxWidth) {
// push current line since the current word exceeds the max width // push current line since the current word exceeds the max width
// so will be appended in next line // so will be appended in next line
push(currentLine); push(currentLine);
currentLine = ""; currentLine = "";
currentLineWidthTillNow = 0; currentLineWidthTillNow = 0;
while (words[index].length > 0) { while (words[index].length > 0) {
const currentChar = words[index][0]; const currentChar = String.fromCodePoint(
const width = charWidth.calculate(currentChar, font); words[index].codePointAt(0)!,
currentLineWidthTillNow += width; );
words[index] = words[index].slice(1); const width = charWidth.calculate(currentChar, font);
currentLineWidthTillNow += width;
if (currentLineWidthTillNow >= maxWidth) { words[index] = words[index].slice(currentChar.length);
// only remove last trailing space which we have added when joining words
if (currentLine.slice(-1) === " ") { if (currentLineWidthTillNow >= maxWidth) {
currentLine = currentLine.slice(0, -1); // only remove last trailing space which we have added when joining words
} if (currentLine.slice(-1) === " ") {
push(currentLine); currentLine = currentLine.slice(0, -1);
currentLine = currentChar;
currentLineWidthTillNow = width;
if (currentLineWidthTillNow === maxWidth) {
currentLine = "";
currentLineWidthTillNow = 0;
}
} else {
currentLine += currentChar;
} }
}
// push current line if appending space exceeds max width
if (currentLineWidthTillNow + spaceWidth >= maxWidth) {
push(currentLine); push(currentLine);
currentLine = ""; currentLine = currentChar;
currentLineWidthTillNow = 0; currentLineWidthTillNow = width;
} else { } else {
// space needs to be appended before next word currentLine += currentChar;
// as currentLine contains chars which couldn't be appended
// to previous line
currentLine += " ";
currentLineWidthTillNow += spaceWidth;
} }
}
index++; // push current line if appending space exceeds max width
if (currentLineWidthTillNow + spaceWidth >= maxWidth) {
push(currentLine);
currentLine = "";
currentLineWidthTillNow = 0;
} else { } else {
// Start appending words in a line till max width reached // space needs to be appended before next word
while (currentLineWidthTillNow < maxWidth && index < words.length) { // as currentLine contains chars which couldn't be appended
const word = words[index]; // to previous line
currentLineWidthTillNow = getLineWidth(currentLine + word, font); currentLine += " ";
currentLineWidthTillNow += spaceWidth;
}
if (currentLineWidthTillNow >= maxWidth) { index++;
push(currentLine); } else {
currentLineWidthTillNow = 0; // Start appending words in a line till max width reached
currentLine = ""; while (currentLineWidthTillNow < maxWidth && index < words.length) {
const word = words[index];
currentLineWidthTillNow = getLineWidth(currentLine + word, font);
break; if (currentLineWidthTillNow >= maxWidth) {
} push(currentLine);
index++; currentLineWidthTillNow = 0;
currentLine += `${word} `; currentLine = "";
// Push the word if appending space exceeds max width break;
if (currentLineWidthTillNow + spaceWidth >= maxWidth) {
const word = currentLine.slice(0, -1);
push(word);
currentLine = "";
currentLineWidthTillNow = 0;
break;
}
} }
if (currentLineWidthTillNow === maxWidth) { index++;
currentLine += `${word} `;
// Push the word if appending space exceeds max width
if (currentLineWidthTillNow + spaceWidth >= maxWidth) {
const word = currentLine.slice(0, -1);
push(word);
currentLine = ""; currentLine = "";
currentLineWidthTillNow = 0; currentLineWidthTillNow = 0;
break;
} }
} }
} if (currentLineWidthTillNow === maxWidth) {
if (currentLine) { currentLine = "";
// only remove last trailing space which we have added when joining words currentLineWidthTillNow = 0;
if (currentLine.slice(-1) === " ") {
currentLine = currentLine.slice(0, -1);
} }
push(currentLine);
} }
} }
if (currentLine) {
// only remove last trailing space which we have added when joining words
if (currentLine.slice(-1) === " ") {
currentLine = currentLine.slice(0, -1);
}
push(currentLine);
}
}); });
return lines.join("\n"); return lines.join("\n");
}; };

Loading…
Cancel
Save