js-draw 0.17.3 → 0.17.4

package/src/tools/Eraser.test.ts

@@ -3,6 +3,7 @@ import Editor from '../Editor';
 import { EditorImage, Rect2, StrokeComponent } from '../lib';
 import { Vec2 } from '../math/Vec2';
 import createEditor from '../testing/createEditor';
+import sendPenEvent from '../testing/sendPenEvent';
 import { InputEvtType } from '../types';
 import Eraser from './Eraser';
 
@@ -23,9 +24,9 @@ describe('Eraser', () => {
 		const editor = createEditor();
 
 		// Draw a line
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(0, 0));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(0, 0));
 		jest.advanceTimersByTime(100);
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(200, 200));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(200, 200));
 
 		// Should have drawn a line
 		const strokes = getAllStrokes(editor);
@@ -35,9 +36,9 @@ describe('Eraser', () => {
 		selectEraser(editor);
 
 		// Erase the line.
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(200, 0));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(200, 0));
 		jest.advanceTimersByTime(400);
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(0, 200));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(0, 200));
 
 		// Should have erased the line
 		expect(getAllStrokes(editor)).toHaveLength(0);
@@ -64,16 +65,16 @@ describe('Eraser', () => {
 		eraser.setThickness(10);
 
 		// Erase the first stroke
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(3, 0));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(3, 0));
 		jest.advanceTimersByTime(100);
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(3, 0));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(3, 0));
 
 		expect(getAllStrokes(editor)).toHaveLength(1);
 
 		// Erase the remaining stroke
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(47, 47));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(47, 47));
 		jest.advanceTimersByTime(100);
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(47, 47));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(47, 47));
 
 		expect(getAllStrokes(editor)).toHaveLength(0);
 	});
@@ -92,9 +93,9 @@ describe('Eraser', () => {
 		eraser.setThickness(100);
 
 		// Try to erase it.
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(0, 0));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(0, 0));
 		jest.advanceTimersByTime(100);
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(3, 0));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(3, 0));
 
 		// Should not have been erased
 		expect(editor.image.getAllElements()).toHaveLength(1);

package/src/tools/PanZoom.test.ts

@@ -68,7 +68,7 @@ describe('PanZoom', () => {
 			firstPointer = sendTouchEvent(editor, eventType, point1, [ secondPointer ]);
 			secondPointer = sendTouchEvent(editor, eventType, point2, [ firstPointer ]);
 			expectedScale = point1.minus(point2).magnitude() / 100;
-			Vec2.zero;
+
 			if (i === maxIterations - 1) {
 				jest.advanceTimersByTime(10);
 

package/src/tools/Pen.test.ts

@@ -7,16 +7,17 @@ import Rect2 from '../math/Rect2';
 import StrokeComponent from '../components/Stroke';
 import Mat33 from '../math/Mat33';
 import { makeFreehandLineBuilder } from '../components/builders/FreehandLineBuilder';
+import sendPenEvent from '../testing/sendPenEvent';
 
 describe('Pen', () => {
 	it('should draw horizontal lines', () => {
 		const editor = createEditor();
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(0, 0));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(0, 0));
 		for (let i = 0; i < 10; i++) {
-			editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(i, 0));
+			sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(i, 0));
 			jest.advanceTimersByTime(200);
 		}
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(200, 0));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(200, 0));
 
 		const elems = editor.image.getElementsIntersectingRegion(new Rect2(0, 10, 10, -10));
 		expect(elems).toHaveLength(1);
@@ -29,12 +30,12 @@ describe('Pen', () => {
 
 	it('should draw vertical line', () => {
 		const editor = createEditor();
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(0, 0));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(0, 0));
 		for (let i = 0; i < 10; i++) {
-			editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(0, i * 20));
+			sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(0, i * 20));
 			jest.advanceTimersByTime(200);
 		}
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(0, 150));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(0, 150));
 
 		const elems = editor.image.getElementsIntersectingRegion(Rect2.unitSquare);
 		expect(elems).toHaveLength(1);
@@ -46,104 +47,104 @@ describe('Pen', () => {
 	it('should draw vertical line with slight bend', () => {
 		const editor = createEditor();
 
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(417, 24)); 
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(417, 24)); 
 		jest.advanceTimersByTime(245);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 197));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 197));
 		jest.advanceTimersByTime(20);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 199));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 199));
 		jest.advanceTimersByTime(12);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 201));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 201));
 		jest.advanceTimersByTime(40);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 203));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 203));
 		jest.advanceTimersByTime(14);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 206));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 206));
 		jest.advanceTimersByTime(35);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 208));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 208));
 		jest.advanceTimersByTime(16);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 211));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 211));
 		jest.advanceTimersByTime(51);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 215));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 215));
 		jest.advanceTimersByTime(32);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 218));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 218));
 		jest.advanceTimersByTime(30);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 220));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 220));
 		jest.advanceTimersByTime(24);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 222));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 222));
 		jest.advanceTimersByTime(14);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 224));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 224));
 		jest.advanceTimersByTime(32);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 227));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 227));
 		jest.advanceTimersByTime(17);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 229));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 229));
 		jest.advanceTimersByTime(53);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 234));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 234));
 		jest.advanceTimersByTime(34);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 236));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 236));
 		jest.advanceTimersByTime(17);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 238));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 238));
 		jest.advanceTimersByTime(39);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 240));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 240));
 		jest.advanceTimersByTime(10);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 243));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 243));
 		jest.advanceTimersByTime(34);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 250));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 250));
 		jest.advanceTimersByTime(57);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(423, 252));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(423, 252));
 		jest.advanceTimersByTime(8);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(422, 256));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(422, 256));
 		jest.advanceTimersByTime(28);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(422, 258));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(422, 258));
 		jest.advanceTimersByTime(21);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(421, 262));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(421, 262));
 		jest.advanceTimersByTime(34);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 264));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 264));
 		jest.advanceTimersByTime(5);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 266));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 266));
 		jest.advanceTimersByTime(22);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 268));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 268));
 		jest.advanceTimersByTime(22);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 271));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 271));
 		jest.advanceTimersByTime(18);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 274));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 274));
 		jest.advanceTimersByTime(33);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 277));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 277));
 		jest.advanceTimersByTime(16);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 279));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 279));
 		jest.advanceTimersByTime(36);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 282));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 282));
 		jest.advanceTimersByTime(15);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 284));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 284));
 		jest.advanceTimersByTime(48);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 289));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 289));
 		jest.advanceTimersByTime(16);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 291));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 291));
 		jest.advanceTimersByTime(31);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 295));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 295));
 		jest.advanceTimersByTime(23);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 301));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 301));
 		jest.advanceTimersByTime(31);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 306));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 306));
 		jest.advanceTimersByTime(18);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 308));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 308));
 		jest.advanceTimersByTime(20);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 310));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 310));
 		jest.advanceTimersByTime(13);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 313));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 313));
 		jest.advanceTimersByTime(17);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 317));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 317));
 		jest.advanceTimersByTime(33);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 321));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 321));
 		jest.advanceTimersByTime(15);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 324));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 324));
 		jest.advanceTimersByTime(23);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 326));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 326));
 		jest.advanceTimersByTime(14);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(419, 329));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(419, 329));
 		jest.advanceTimersByTime(36);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 333));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 333));
 		jest.advanceTimersByTime(8);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(420, 340));
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(420, 340));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(420, 340));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(420, 340));
 
 		const elems = editor.image.getElementsIntersectingRegion(new Rect2(0, 0, 1000, 1000));
 		expect(elems).toHaveLength(1);
@@ -157,9 +158,9 @@ describe('Pen', () => {
 
 		expect(editor.history.undoStackSize).toBe(0);
 
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(10, 10)); 
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(10, 10)); 
 		jest.advanceTimersByTime(100);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(20, 10));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(20, 10));
 
 		const ctrlKeyDown = true;
 		editor.sendKeyboardEvent(InputEvtType.KeyPressEvent, 'z', ctrlKeyDown);
@@ -168,7 +169,7 @@ describe('Pen', () => {
 		expect(editor.history.redoStackSize).toBe(1);
 
 		// Lifting the pointer up shouldn't clear the redo stack.
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(420, 340));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(420, 340));
 		expect(editor.history.redoStackSize).toBe(1);
 	});
 
@@ -179,10 +180,10 @@ describe('Pen', () => {
 		const penTool = editor.toolController.getMatchingTools(PenTool)[0];
 		penTool.setStrokeFactory(makeFreehandLineBuilder);
 
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(0.1, 0.1)); 
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(0.1, 0.1)); 
 		jest.advanceTimersByTime(100);
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(10.1, 10.1));
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(10.1, 10.1));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(10.1, 10.1));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(10.1, 10.1));
 
 		const allElems = editor.image.getAllElements();
 		expect(allElems).toHaveLength(1);

package/src/tools/SelectionTool/SelectionTool.test.ts

@@ -10,6 +10,7 @@ import SelectionTool from './SelectionTool';
 import createEditor from '../../testing/createEditor';
 import Pointer from '../../Pointer';
 import { Rect2 } from '../../lib';
+import sendPenEvent from '../../testing/sendPenEvent';
 
 const getSelectionTool = (editor: Editor): SelectionTool => {
 	return editor.toolController.getMatchingTools(SelectionTool)[0];
@@ -33,9 +34,9 @@ const createEditorWithSingleObjectSelection = (objectSize: number = 50) => {
 	// Select the object
 	const selectionTool = getSelectionTool(editor);
 	selectionTool.setEnabled(true);
-	editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(0, 0));
-	editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(10, 10));
-	editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(5, 5));
+	sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(0, 0));
+	sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(10, 10));
+	sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(5, 5));
 
 	return { editor, testStroke, selectionTool };
 };
@@ -61,9 +62,9 @@ describe('SelectionTool', () => {
 
 		const selectionTool = getSelectionTool(editor);
 		selectionTool.setEnabled(true);
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(0, 0));
-		editor.sendPenEvent(InputEvtType.PointerMoveEvt, Vec2.of(0.1, 0.1));
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(0.1, 0.1));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(0, 0));
+		sendPenEvent(editor, InputEvtType.PointerMoveEvt, Vec2.of(0.1, 0.1));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(0.1, 0.1));
 
 		// Should surround the selected object (which has bbox = (0, 0, 1, 1))
 		// with extra space.
@@ -125,8 +126,8 @@ describe('SelectionTool', () => {
 		selectionTool.setEnabled(true);
 
 		// Select the smaller rectangle
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(40, 40));
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(100, 100));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(40, 40));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(100, 100));
 
 		expect(selectionTool.getSelectedObjects()).toHaveLength(1);
 
@@ -134,21 +135,21 @@ describe('SelectionTool', () => {
 		editor.sendKeyboardEvent(InputEvtType.KeyPressEvent, 'Shift');
 
 		// Select the larger stroke.
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(200, 200));
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(600, 600));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(200, 200));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(600, 600));
 
 		expect(selectionTool.getSelectedObjects()).toHaveLength(2);
 
 		editor.sendKeyboardEvent(InputEvtType.KeyUpEvent, 'Shift');
 
 		// Select the larger stroke without shift pressed
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(200, 200));
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(600, 600));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(200, 200));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(600, 600));
 		expect(selectionTool.getSelectedObjects()).toHaveLength(1);
 
 		// Select nothing
-		editor.sendPenEvent(InputEvtType.PointerDownEvt, Vec2.of(200, 200));
-		editor.sendPenEvent(InputEvtType.PointerUpEvt, Vec2.of(201, 201));
+		sendPenEvent(editor, InputEvtType.PointerDownEvt, Vec2.of(200, 200));
+		sendPenEvent(editor, InputEvtType.PointerUpEvt, Vec2.of(201, 201));
 		expect(selectionTool.getSelectedObjects()).toHaveLength(0);
 	});
 

package/src/tools/SelectionTool/SelectionTool.ts

@@ -379,24 +379,22 @@ export default class SelectionTool extends BaseTool {
 
 		const exportViewport = new Viewport(() => {});
 		exportViewport.updateScreenSize(Vec2.of(bbox.w, bbox.h));
-		exportViewport.resetTransform(Mat33.translation(bbox.topLeft));
-
-		const svgNameSpace = 'http://www.w3.org/2000/svg';
-		const exportElem = document.createElementNS(svgNameSpace, 'svg');
+		exportViewport.resetTransform(Mat33.translation(bbox.topLeft.times(-1)));
 
 		const sanitize = true;
-		const renderer = new SVGRenderer(exportElem, exportViewport, sanitize);
+		const { element: svgExportElem, renderer: svgRenderer } = SVGRenderer.fromViewport(exportViewport, sanitize);
 
 		const text: string[] = [];
 		for (const elem of selectedElems) {
-			elem.render(renderer);
+			elem.render(svgRenderer);
 
 			if (elem instanceof TextComponent) {
 				text.push(elem.getText());
 			}
 		}
 
-		event.setData('image/svg+xml', exportElem.outerHTML);
+		event.setData('image/svg+xml', svgExportElem.outerHTML);
+		event.setData('text/html', svgExportElem.outerHTML);
 		if (text.length > 0) {
 			event.setData('text/plain', text.join('\n'));
 		}