lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 15:23:44 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

text font fix. close #910

Browse Source
This commit is contained in:
Anton Lavrenov 2020-05-14 11:25:27 -05:00
parent ee99044baa
commit d96e7d9ede
4 changed files with 1327 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1369
konva.js
View File

File diff suppressed because it is too large Load Diff

2
konva.min.js vendored
View File

File diff suppressed because one or more lines are too long

5
src/shapes/Text.ts
View File

@ -366,10 +366,9 @@ export class Text extends Shape<TextConfig> {
SPACE + SPACE +
this.fontVariant() + this.fontVariant() +
SPACE + SPACE +
this.fontSize() + (this.fontSize() + PX_SPACE) +
PX_SPACE +
// wrap font family into " so font families with spaces works ok // wrap font family into " so font families with spaces works ok
+'"' + '"' +
this.fontFamily() + this.fontFamily() +
'"' '"'
); );

6
test/unit/shapes/Text-test.js
View File

@ -559,7 +559,7 @@ suite('Text', function () {
stage.add(layer); stage.add(layer);
var trace = var trace =
'clearRect(0,0,578,200);save();transform(1,0,0,1,10,10);font=normal normal 80px Arial;textBaseline=middle;textAlign=left;translate(0,0);save();save();beginPath();moveTo(0,80);lineTo(189,80);stroke();restore();fillStyle=red;fillText(h,0,40);fillStyle=red;fillText(e,49,40);fillStyle=red;fillText(l,98,40);fillStyle=red;fillText(l,121,40);fillStyle=red;fillText(o,144,40);restore();save();save();beginPath();moveTo(0,160);lineTo(211,160);stroke();restore();fillStyle=red;fillText(w,0,120);fillStyle=red;fillText(o,63,120);fillStyle=red;fillText(r,112,120);fillStyle=red;fillText(l,144,120);fillStyle=red;fillText(d,167,120);restore();restore();'; 'clearRect(0,0,578,200);save();transform(1,0,0,1,10,10);font=normal normal 80px "Arial";textBaseline=middle;textAlign=left;translate(0,0);save();save();beginPath();moveTo(0,80);lineTo(189,80);stroke();restore();fillStyle=red;fillText(h,0,40);fillStyle=red;fillText(e,49,40);fillStyle=red;fillText(l,98,40);fillStyle=red;fillText(l,121,40);fillStyle=red;fillText(o,144,40);restore();save();save();beginPath();moveTo(0,160);lineTo(211,160);stroke();restore();fillStyle=red;fillText(w,0,120);fillStyle=red;fillText(o,63,120);fillStyle=red;fillText(r,112,120);fillStyle=red;fillText(l,144,120);fillStyle=red;fillText(d,167,120);restore();restore();';
assert.equal(layer.getContext().getTrace(), trace); assert.equal(layer.getContext().getTrace(), trace);
}); });
@ -703,7 +703,7 @@ suite('Text', function () {
stage.add(layer); stage.add(layer);
var trace = var trace =
'clearRect(0,0,578,200);save();transform(1,0,0,1,10,10);beginPath();rect(0,0,200,100);closePath();lineWidth=2;strokeStyle=black;stroke();restore();save();transform(1,0,0,1,10,10);font=normal normal 16px Arial;textBaseline=middle;textAlign=left;translate(10,42);save();fillStyle=#555;fillText(Some awesome text,17.523,8);restore();restore();'; 'clearRect(0,0,578,200);save();transform(1,0,0,1,10,10);beginPath();rect(0,0,200,100);closePath();lineWidth=2;strokeStyle=black;stroke();restore();save();transform(1,0,0,1,10,10);font=normal normal 16px "Arial";textBaseline=middle;textAlign=left;translate(10,42);save();fillStyle=#555;fillText(Some awesome text,17.523,8);restore();restore();';
assert.equal(layer.getContext().getTrace(), trace); assert.equal(layer.getContext().getTrace(), trace);
}); });
@ -942,7 +942,7 @@ suite('Text', function () {
// this text should look like it is positioned in y = 40 // this text should look like it is positioned in y = 40
var trace = var trace =
'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();rect(0,0,100,120);closePath();lineWidth=2;strokeStyle=black;stroke();restore();save();transform(1,0,0,1,0,0);font=normal normal 40px Arial;textBaseline=middle;textAlign=left;translate(0,0);save();fillStyle=black;fillText(Some good text,0,60);restore();restore();'; 'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();rect(0,0,100,120);closePath();lineWidth=2;strokeStyle=black;stroke();restore();save();transform(1,0,0,1,0,0);font=normal normal 40px "Arial";textBaseline=middle;textAlign=left;translate(0,0);save();fillStyle=black;fillText(Some good text,0,60);restore();restore();';
assert.equal(layer.getContext().getTrace(), trace); assert.equal(layer.getContext().getTrace(), trace);
}); });