additional fix

konvajs · Sep 4, 2023 · f6bcbb7 · f6bcbb7
1 parent 3af5f0f
commit f6bcbb7
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 2 deletions.
diff --git a/src/shapes/Text.ts b/src/shapes/Text.ts
@@ -605,9 +605,11 @@ export class Text extends Shape<TextConfig> {
   }
 
   _useBufferCanvas() {
-    const hasUnderline = this.textDecoration().indexOf('underline') !== -1;
+    const hasLine =
+      this.textDecoration().indexOf('underline') !== -1 ||
+      this.textDecoration().indexOf('line-through') !== -1;
     const hasShadow = this.hasShadow();
-    if (hasUnderline && hasShadow) {
+    if (hasLine && hasShadow) {
       return true;
     }
     return super._useBufferCanvas();

diff --git a/test/unit/Text-test.ts b/test/unit/Text-test.ts
@@ -1022,6 +1022,40 @@ describe('Text', function () {
     compareCanvases(groupCanvas, text.toCanvas(), 200);
   });
 
+  it('text with line-through and shadow', function () {
+    var stage = addStage();
+    var layer = new Konva.Layer();
+
+    var text = new Konva.Text({
+      text: 'Test',
+      fill: 'black',
+      fontSize: 40,
+      textDecoration: 'line-through',
+      shadowEnabled: true,
+      shadowColor: 'red',
+      shadowOffsetX: 5,
+      shadowOffsetY: 5,
+    });
+
+    layer.add(text);
+    stage.add(layer);
+
+    var trace =
+      'clearRect();save();shadowColor;shadowBlur;shadowOffsetX;shadowOffsetY;drawImage();restore();';
+
+    assert.equal(layer.getContext().getTrace(true), trace);
+
+    // now check result visually
+    // text with red shadow is the same as red text with back text on top
+    const group = new Konva.Group({});
+    layer.add(group);
+    group.add(text.clone({ shadowEnabled: false, x: 5, y: 5, fill: 'red' }));
+    group.add(text.clone({ shadowEnabled: false }));
+    const groupCanvas = group.toCanvas();
+
+    compareCanvases(groupCanvas, text.toCanvas(), 200, 50);
+  });
+
   // ======================================================
   it('change font size should update text data', function () {
     var stage = addStage();