import { addStage, cloneAndCompareLayer, Konva } from './test-utils'; import { assert } from 'chai'; describe('Group', function () { // ====================================================== it('cache group with text', function () { var stage = addStage(); var layer = new Konva.Layer(); var group = new Konva.Group({ draggable: true, x: 50, y: 40, }); var text = new Konva.Text({ text: 'some text', fontSize: 20, fill: 'black', y: 50, }); var rect = new Konva.Rect({ height: 100, width: 100, stroke: 'black', strokeWidth: 10, // cornerRadius: 1, }); group.add(text); group.add(rect); layer.add(group); stage.add(layer); group .cache({ x: -15, y: -15, width: 150, height: 150, }) .offsetX(5) .offsetY(5); layer.draw(); cloneAndCompareLayer(layer, 200); }); it('clip group with a Path2D', function () { var stage = addStage(); var layer = new Konva.Layer(); var path = new Konva.Group({ width: 100, height: 100, clipFunc: () => [new Path2D('M0 0v50h50Z')] }); layer.add(path); stage.add(layer); const trace = layer.getContext().getTrace() assert.equal(trace, 'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();clip([object Path2D]);transform(1,0,0,1,0,0);restore();'); }); it('clip group with a Path2D and clipRule', function () { var stage = addStage(); var layer = new Konva.Layer(); var path = new Konva.Group({ width: 100, height: 100, clipFunc: () => [new Path2D('M0 0v50h50Z'), 'evenodd'], }); layer.add(path); stage.add(layer); const trace = layer.getContext().getTrace() assert.equal(trace, 'clearRect(0,0,578,200);save();transform(1,0,0,1,0,0);beginPath();clip([object Path2D],evenodd);transform(1,0,0,1,0,0);restore();'); }); });