js-draw 0.25.0 → 1.0.0

package/src/rendering/renderers/DummyRenderer.ts

@@ -1,145 +0,0 @@
-import Mat33 from '../../math/Mat33';
-import Rect2 from '../../math/shapes/Rect2';
-import { Point2, Vec2 } from '../../math/Vec2';
-import Vec3 from '../../math/Vec3';
-import Viewport from '../../Viewport';
-import RenderingStyle from '../RenderingStyle';
-import TextRenderingStyle from '../TextRenderingStyle';
-import AbstractRenderer, { RenderableImage } from './AbstractRenderer';
-
-// Renderer that outputs almost nothing. Useful for automated tests.
-export default class DummyRenderer extends AbstractRenderer {
-	// Variables that track the state of what's been rendered
-	public clearedCount: number = 0;
-	public renderedPathCount: number = 0;
-	public lastFillStyle: RenderingStyle|null = null;
-	public lastPoint: Point2|null = null;
-	public objectNestingLevel: number = 0;
-	public lastText: string|null = null;
-	public lastImage: RenderableImage|null = null;
-
-	// List of points drawn since the last clear.
-	public pointBuffer: Point2[] = [];
-
-	public constructor(viewport: Viewport) {
-		super(viewport);
-	}
-
-	public displaySize(): Vec2 {
-		// Do we have a stored viewport size?
-		const viewportSize = this.getViewport().getScreenRectSize();
-
-		// Don't use a 0x0 viewport — DummyRenderer is often used
-		// for tests that run without a display, so pretend we have a
-		// reasonable-sized display.
-		if (viewportSize.x === 0 || viewportSize.y === 0) {
-			return Vec2.of(640, 480);
-		}
-
-		return viewportSize;
-	}
-
-	public clear() {
-		this.clearedCount ++;
-		this.renderedPathCount = 0;
-		this.pointBuffer = [];
-		this.lastText = null;
-		this.lastImage = null;
-
-		// Ensure all objects finished rendering
-		if (this.objectNestingLevel > 0) {
-			throw new Error(
-				`Within an object while clearing! Nesting level: ${this.objectNestingLevel}`
-			);
-		}
-	}
-
-	protected beginPath(startPoint: Vec3) {
-		this.lastPoint = startPoint;
-		this.pointBuffer.push(startPoint);
-	}
-
-	protected endPath(style: RenderingStyle) {
-		this.renderedPathCount++;
-		this.lastFillStyle = style;
-	}
-
-	protected lineTo(point: Vec3) {
-		point = this.canvasToScreen(point);
-
-		this.lastPoint = point;
-		this.pointBuffer.push(point);
-	}
-
-	protected moveTo(point: Point2) {
-		point = this.canvasToScreen(point);
-
-		this.lastPoint = point;
-		this.pointBuffer.push(point);
-	}
-
-	protected traceCubicBezierCurve(p1: Vec3, p2: Vec3, p3: Vec3) {
-		p1 = this.canvasToScreen(p1);
-		p2 = this.canvasToScreen(p2);
-		p3 = this.canvasToScreen(p3);
-
-		this.lastPoint = p3;
-		this.pointBuffer.push(p1, p2, p3);
-	}
-
-	protected traceQuadraticBezierCurve(controlPoint: Vec3, endPoint: Vec3) {
-		controlPoint = this.canvasToScreen(controlPoint);
-		endPoint = this.canvasToScreen(endPoint);
-
-		this.lastPoint = endPoint;
-		this.pointBuffer.push(controlPoint, endPoint);
-	}
-
-	public drawPoints(..._points: Vec3[]) {
-		// drawPoints is intended for debugging.
-		// As such, it is unlikely to be the target of automated tests.
-	}
-
-
-	public drawText(text: string, _transform: Mat33, _style: TextRenderingStyle): void {
-		this.lastText = text;
-	}
-
-	public drawImage(image: RenderableImage) {
-		this.lastImage = image;
-	}
-
-	public override startObject(boundingBox: Rect2, _clip: boolean) {
-		super.startObject(boundingBox);
-
-		this.objectNestingLevel += 1;
-	}
-
-	public override endObject() {
-		super.endObject();
-
-		this.objectNestingLevel -= 1;
-	}
-
-	public isTooSmallToRender(_rect: Rect2): boolean {
-		return false;
-	}
-
-
-	public override canRenderFromWithoutDataLoss(other: AbstractRenderer) {
-		return other instanceof DummyRenderer;
-	}
-
-	public override renderFromOtherOfSameType(transform: Mat33, other: AbstractRenderer): void {
-		if (!(other instanceof DummyRenderer)) {
-			throw new Error(`${other} cannot be rendered onto ${this}`);
-		}
-
-		this.renderedPathCount += other.renderedPathCount;
-		this.lastFillStyle = other.lastFillStyle;
-		this.lastPoint = other.lastPoint;
-		this.pointBuffer.push(...other.pointBuffer.map(point => {
-			return transform.transformVec2(point);
-		}));
-	}
-}

package/src/rendering/renderers/SVGRenderer.ts

@@ -1,377 +0,0 @@
-
-import { LoadSaveDataTable } from '../../components/AbstractComponent';
-import Mat33 from '../../math/Mat33';
-import Path from '../../math/shapes/Path';
-import Rect2 from '../../math/shapes/Rect2';
-import { toRoundedString } from '../../math/rounding';
-import { Point2, Vec2 } from '../../math/Vec2';
-import { svgAttributesDataKey, SVGLoaderUnknownAttribute, SVGLoaderUnknownStyleAttribute, svgStyleAttributesDataKey } from '../../SVGLoader';
-import Viewport from '../../Viewport';
-import RenderingStyle, { stylesEqual } from '../RenderingStyle';
-import TextRenderingStyle from '../TextRenderingStyle';
-import AbstractRenderer, { RenderableImage, RenderablePathSpec } from './AbstractRenderer';
-
-export const renderedStylesheetId = 'js-draw-style-sheet';
-
-const svgNameSpace = 'http://www.w3.org/2000/svg';
-
-const defaultTextStyle: Partial<TextRenderingStyle> = {
-	fontWeight: '400',
-	fontStyle: 'normal',
-};
-
-/**
- * Renders onto an `SVGElement`.
- *
- * @see {@link Editor.toSVG}
- */
-export default class SVGRenderer extends AbstractRenderer {
-	private lastPathStyle: RenderingStyle|null = null;
-	private lastPathString: string[] = [];
-	private objectElems: SVGElement[]|null = null;
-
-	private overwrittenAttrs: Record<string, string|null> = {};
-
-	/**
-	 * Creates a renderer that renders onto `elem`. If `sanitize`, don't render potentially untrusted data.
-	 *
-	 * `viewport` is used to determine the translation/rotation/scaling/output size of the rendered
-	 * data.
-	 */
-	public constructor(private elem: SVGSVGElement, viewport: Viewport, private sanitize: boolean = false) {
-		super(viewport);
-		this.clear();
-
-		this.addStyleSheet();
-	}
-
-	private addStyleSheet() {
-		if (!this.elem.querySelector(`#${renderedStylesheetId}`)) {
-			// Default to rounded strokes.
-			const styleSheet = document.createElementNS('http://www.w3.org/2000/svg', 'style');
-			styleSheet.innerHTML = `
-				path {
-					stroke-linecap: round;
-					stroke-linejoin: round;
-				}
-
-				text {
-					white-space: pre;
-				}
-			`.replace(/\s+/g, '');
-			styleSheet.setAttribute('id', renderedStylesheetId);
-			this.elem.appendChild(styleSheet);
-		}
-	}
-
-	// Sets an attribute on the root SVG element.
-	public setRootSVGAttribute(name: string, value: string|null) {
-		if (this.sanitize) {
-			return;
-		}
-
-		// Make the original value of the attribute restorable on clear
-		if (!(name in this.overwrittenAttrs)) {
-			this.overwrittenAttrs[name] = this.elem.getAttribute(name);
-		}
-
-		if (value !== null) {
-			this.elem.setAttribute(name, value);
-		} else {
-			this.elem.removeAttribute(name);
-		}
-	}
-
-	public displaySize(): Vec2 {
-		return Vec2.of(this.elem.clientWidth, this.elem.clientHeight);
-	}
-
-	public clear() {
-		this.lastPathString = [];
-
-		if (!this.sanitize) {
-			// Restore all all attributes
-			for (const attrName in this.overwrittenAttrs) {
-				const value = this.overwrittenAttrs[attrName];
-
-				if (value) {
-					this.elem.setAttribute(attrName, value);
-				} else {
-					this.elem.removeAttribute(attrName);
-				}
-			}
-			this.overwrittenAttrs = {};
-		}
-	}
-
-	// Push `this.fullPath` to the SVG. Returns the path added to the SVG, if any.
-	// @internal
-	protected addPathToSVG() {
-		if (!this.lastPathStyle || this.lastPathString.length === 0) {
-			return null;
-		}
-
-		const pathElem = document.createElementNS(svgNameSpace, 'path');
-		pathElem.setAttribute('d', this.lastPathString.join(' '));
-
-		const style = this.lastPathStyle;
-		if (style.fill.a > 0) {
-			pathElem.setAttribute('fill', style.fill.toHexString());
-		} else {
-			pathElem.setAttribute('fill', 'none');
-		}
-
-		if (style.stroke) {
-			pathElem.setAttribute('stroke', style.stroke.color.toHexString());
-			pathElem.setAttribute('stroke-width', toRoundedString(style.stroke.width));
-		}
-
-		this.elem.appendChild(pathElem);
-		this.objectElems?.push(pathElem);
-
-		return pathElem;
-	}
-
-	public override drawPath(pathSpec: RenderablePathSpec) {
-		const style = pathSpec.style;
-		const path = Path.fromRenderable(pathSpec).transformedBy(this.getCanvasToScreenTransform());
-
-		// Try to extend the previous path, if possible
-		if (
-			this.lastPathString.length === 0 || !this.lastPathStyle || !stylesEqual(this.lastPathStyle, style)
-		) {
-			this.addPathToSVG();
-			this.lastPathStyle = style;
-			this.lastPathString = [];
-		}
-		this.lastPathString.push(path.toString());
-	}
-
-	// Apply [elemTransform] to [elem]. Uses both a `matrix` and `.x`, `.y` properties if `setXY` is true.
-	// Otherwise, just uses a `matrix`.
-	private transformFrom(elemTransform: Mat33, elem: SVGElement, inCanvasSpace: boolean = false, setXY: boolean = true) {
-		let transform = !inCanvasSpace ? this.getCanvasToScreenTransform().rightMul(elemTransform) : elemTransform;
-		const translation = transform.transformVec2(Vec2.zero);
-
-		if (setXY) {
-			transform = transform.rightMul(Mat33.translation(translation.times(-1)));
-		}
-
-		if (!transform.eq(Mat33.identity)) {
-			elem.style.transform = `matrix(
-				${transform.a1}, ${transform.b1},
-				${transform.a2}, ${transform.b2},
-				${transform.a3}, ${transform.b3}
-			)`;
-		} else {
-			elem.style.transform = '';
-		}
-
-		if (setXY) {
-			elem.setAttribute('x', `${toRoundedString(translation.x)}`);
-			elem.setAttribute('y', `${toRoundedString(translation.y)}`);
-		}
-	}
-
-	private textContainer: SVGTextElement|null = null;
-	private textContainerTransform: Mat33|null = null;
-	private textParentStyle: Partial<TextRenderingStyle>|null = defaultTextStyle;
-	public drawText(text: string, transform: Mat33, style: TextRenderingStyle): void {
-		const applyTextStyles = (elem: SVGTextElement|SVGTSpanElement, style: TextRenderingStyle) => {
-			if (style.fontFamily !== this.textParentStyle?.fontFamily) {
-				elem.style.fontFamily = style.fontFamily;
-			}
-			if (style.fontVariant !== this.textParentStyle?.fontVariant) {
-				elem.style.fontVariant = style.fontVariant ?? '';
-			}
-			if (style.fontWeight !== this.textParentStyle?.fontWeight) {
-				elem.style.fontWeight = style.fontWeight ?? '';
-			}
-			if (style.fontStyle !== this.textParentStyle?.fontStyle) {
-				elem.style.fontStyle = style.fontStyle ?? '';
-			}
-			if (style.size !== this.textParentStyle?.size) {
-				elem.style.fontSize = style.size + 'px';
-			}
-
-			const fillString = style.renderingStyle.fill.toHexString();
-			// TODO: Uncomment at some future major version release --- currently causes incompatibility due
-			//       to an SVG parsing bug in older versions.
-			//const parentFillString = this.textParentStyle?.renderingStyle?.fill?.toHexString();
-			//if (fillString !== parentFillString) {
-			elem.style.fill = fillString;
-			//}
-
-			if (style.renderingStyle.stroke) {
-				const strokeStyle = style.renderingStyle.stroke;
-				elem.style.stroke = strokeStyle.color.toHexString();
-				elem.style.strokeWidth = strokeStyle.width + 'px';
-			}
-		};
-		transform = this.getCanvasToScreenTransform().rightMul(transform);
-
-		if (!this.textContainer) {
-			const container = document.createElementNS(svgNameSpace, 'text');
-			container.appendChild(document.createTextNode(text));
-
-			// Don't set .x/.y properties (just use .style.transform).
-			// Child nodes aren't translated by .x/.y properties, but are by .style.transform.
-			const setXY = false;
-			this.transformFrom(transform, container, true, setXY);
-			applyTextStyles(container, style);
-
-			this.elem.appendChild(container);
-			this.objectElems?.push(container);
-			if (this.objectLevel > 0) {
-				this.textContainer = container;
-				this.textContainerTransform = transform;
-				this.textParentStyle = { ...defaultTextStyle, ...style };
-			}
-		} else {
-			const elem = document.createElementNS(svgNameSpace, 'tspan');
-			elem.appendChild(document.createTextNode(text));
-			this.textContainer.appendChild(elem);
-
-			// Make .x/.y relative to the parent.
-			transform = this.textContainerTransform!.inverse().rightMul(transform);
-
-			// .style.transform does nothing to tspan elements. As such, we need to set x/y:
-			const translation = transform.transformVec2(Vec2.zero);
-			elem.setAttribute('x', `${toRoundedString(translation.x)}`);
-			elem.setAttribute('y', `${toRoundedString(translation.y)}`);
-
-			applyTextStyles(elem, style);
-		}
-	}
-
-	public drawImage(image: RenderableImage) {
-		let label = image.label ?? image.image.getAttribute('aria-label') ?? '';
-		if (label === '') {
-			label = image.image.getAttribute('alt') ?? '';
-		}
-
-		const svgImgElem = document.createElementNS(svgNameSpace, 'image');
-		svgImgElem.setAttribute('href', image.base64Url);
-		svgImgElem.setAttribute('width', image.image.getAttribute('width') ?? '');
-		svgImgElem.setAttribute('height', image.image.getAttribute('height') ?? '');
-		svgImgElem.setAttribute('aria-label', label);
-		this.transformFrom(image.transform, svgImgElem);
-
-		this.elem.appendChild(svgImgElem);
-		this.objectElems?.push(svgImgElem);
-	}
-
-	public override startObject(boundingBox: Rect2) {
-		super.startObject(boundingBox);
-
-		// Only accumulate a path within an object
-		this.lastPathString = [];
-		this.lastPathStyle = null;
-		this.textContainer = null;
-		this.textParentStyle = defaultTextStyle;
-		this.objectElems = [];
-	}
-
-	public override endObject(loaderData?: LoadSaveDataTable, elemClassNames?: string[]) {
-		super.endObject(loaderData);
-
-		// Don't extend paths across objects
-		this.addPathToSVG();
-
-		if (loaderData && !this.sanitize) {
-			// Restore any attributes unsupported by the app.
-			for (const elem of this.objectElems ?? []) {
-				const attrs = loaderData[svgAttributesDataKey] as SVGLoaderUnknownAttribute[]|undefined;
-				const styleAttrs = loaderData[svgStyleAttributesDataKey] as SVGLoaderUnknownStyleAttribute[]|undefined;
-
-				if (attrs) {
-					for (const [ attr, value ] of attrs) {
-						elem.setAttribute(attr, value);
-					}
-				}
-
-				if (styleAttrs) {
-					for (const attr of styleAttrs) {
-						elem.style.setProperty(attr.key, attr.value, attr.priority);
-					}
-				}
-			}
-		}
-
-		// Add class names to the object, if given.
-		if (elemClassNames && this.objectElems) {
-			if (this.objectElems.length === 1) {
-				this.objectElems[0].classList.add(...elemClassNames);
-			} else {
-				const wrapper = document.createElementNS(svgNameSpace, 'g');
-				wrapper.classList.add(...elemClassNames);
-
-				for (const elem of this.objectElems) {
-					elem.remove();
-					wrapper.appendChild(elem);
-				}
-
-				this.elem.appendChild(wrapper);
-			}
-		}
-	}
-
-	// Not implemented -- use drawPath instead.
-	private unimplementedMessage() { throw new Error('Not implemenented!'); }
-	protected beginPath(_startPoint: Point2) { this.unimplementedMessage(); }
-	protected endPath(_style: RenderingStyle) { this.unimplementedMessage(); }
-	protected lineTo(_point: Point2) { this.unimplementedMessage(); }
-	protected moveTo(_point: Point2) { this.unimplementedMessage(); }
-	protected traceCubicBezierCurve(
-		_controlPoint1: Point2, _controlPoint2: Point2, _endPoint: Point2
-	) { this.unimplementedMessage(); }
-	protected traceQuadraticBezierCurve(_controlPoint: Point2, _endPoint: Point2) { this.unimplementedMessage(); }
-
-	public drawPoints(...points: Point2[]) {
-		points.map(point => {
-			const elem = document.createElementNS(svgNameSpace, 'circle');
-			elem.setAttribute('cx', `${point.x}`);
-			elem.setAttribute('cy', `${point.y}`);
-			elem.setAttribute('r', '15');
-			this.elem.appendChild(elem);
-		});
-	}
-
-	// Renders a **copy** of the given element.
-	public drawSVGElem(elem: SVGElement) {
-		if (this.sanitize) {
-			return;
-		}
-
-		// Don't add multiple copies of the default stylesheet.
-		if (elem.tagName.toLowerCase() === 'style' && elem.getAttribute('id') === renderedStylesheetId) {
-			return;
-		}
-
-		this.elem.appendChild(elem.cloneNode(true));
-	}
-
-	public isTooSmallToRender(_rect: Rect2): boolean {
-		return false;
-	}
-
-	// Creates a new SVG element and SVGRenerer with attributes set for the given Viewport.
-	public static fromViewport(viewport: Viewport, sanitize: boolean = true) {
-		const svgNameSpace = 'http://www.w3.org/2000/svg';
-		const result = document.createElementNS(svgNameSpace, 'svg');
-
-		const rect = viewport.getScreenRectSize();
-		// rect.x -> size of rect in x direction, rect.y -> size of rect in y direction.
-		result.setAttribute('viewBox', [0, 0, rect.x, rect.y].map(part => toRoundedString(part)).join(' '));
-		result.setAttribute('width', toRoundedString(rect.x));
-		result.setAttribute('height', toRoundedString(rect.y));
-
-		// Ensure the image can be identified as an SVG if downloaded.
-		// See https://jwatt.org/svg/authoring/
-		result.setAttribute('version', '1.1');
-		result.setAttribute('baseProfile', 'full');
-		result.setAttribute('xmlns', svgNameSpace);
-
-		return { element: result, renderer: new SVGRenderer(result, viewport, sanitize) };
-	}
-}

package/src/rendering/renderers/TextOnlyRenderer.test.ts

@@ -1,34 +0,0 @@
-import { ImageComponent, Mat33 } from '../../lib';
-import createEditor from '../../testing/createEditor';
-import TextOnlyRenderer from './TextOnlyRenderer';
-
-describe('TextOnlyRenderer', () => {
-	it('should summarize the number of visible image nodes', () => {
-		const editor = createEditor();
-
-		const htmlImage = new Image();
-		htmlImage.width = 500;
-		htmlImage.height = 200;
-
-		const image = new ImageComponent({
-			transform: Mat33.identity,
-			image: htmlImage,
-			base64Url: '',
-			label: 'Testing...',
-		});
-		editor.dispatch(editor.image.addElement(image));
-
-		const textRenderer = new TextOnlyRenderer(editor.viewport, editor.localization);
-		editor.image.render(textRenderer, editor.viewport);
-
-		// Should contian number of image nodes and the image description
-		expect(textRenderer.getDescription()).toContain('Testing...');
-		expect(textRenderer.getDescription()).toContain('1');
-
-		textRenderer.clear();
-
-		// After clearing, should not contain description of the image/image count
-		expect(textRenderer.getDescription()).not.toContain('Testing...');
-		expect(textRenderer.getDescription()).not.toContain('1');
-	});
-});

package/src/rendering/renderers/TextOnlyRenderer.ts

@@ -1,71 +0,0 @@
-import Mat33 from '../../math/Mat33';
-import Rect2 from '../../math/shapes/Rect2';
-import { Vec2 } from '../../math/Vec2';
-import Vec3 from '../../math/Vec3';
-import Viewport from '../../Viewport';
-import { TextRendererLocalization } from '../localization';
-import RenderingStyle from '../RenderingStyle';
-import TextRenderingStyle from '../TextRenderingStyle';
-import AbstractRenderer, { RenderableImage } from './AbstractRenderer';
-
-// Outputs a description of what was rendered.
-export default class TextOnlyRenderer extends AbstractRenderer {
-	private descriptionBuilder: string[] = [];
-	private pathCount: number = 0;
-	private textNodeCount: number = 0;
-	private imageNodeCount: number = 0;
-
-	public constructor(viewport: Viewport, private localizationTable: TextRendererLocalization) {
-		super(viewport);
-	}
-
-	public displaySize(): Vec3 {
-		// We don't have a graphical display, export a reasonable size.
-		return Vec2.of(500, 500);
-	}
-
-	public clear(): void {
-		this.descriptionBuilder = [];
-		this.pathCount = 0;
-		this.textNodeCount = 0;
-		this.imageNodeCount = 0;
-	}
-
-	public getDescription(): string {
-		return [
-			this.localizationTable.pathNodeCount(this.pathCount),
-			...(this.textNodeCount > 0 ? [this.localizationTable.textNodeCount(this.textNodeCount)] : []),
-			...(this.imageNodeCount > 0 ? [this.localizationTable.imageNodeCount(this.imageNodeCount)] : []),
-			...this.descriptionBuilder
-		].join('\n');
-	}
-
-	protected beginPath(_startPoint: Vec3): void {
-	}
-	protected endPath(_style: RenderingStyle): void {
-		this.pathCount ++;
-	}
-	protected lineTo(_point: Vec3): void {
-	}
-	protected moveTo(_point: Vec3): void {
-	}
-	protected traceCubicBezierCurve(_p1: Vec3, _p2: Vec3, _p3: Vec3): void {
-	}
-	protected traceQuadraticBezierCurve(_controlPoint: Vec3, _endPoint: Vec3): void {
-	}
-	public drawText(text: string, _transform: Mat33, _style: TextRenderingStyle): void {
-		this.descriptionBuilder.push(this.localizationTable.textNode(text));
-		this.textNodeCount ++;
-	}
-	public drawImage(image: RenderableImage) {
-		const label = image.label ? this.localizationTable.imageNode(image.label) : this.localizationTable.unlabeledImageNode;
-
-		this.descriptionBuilder.push(label);
-		this.imageNodeCount ++;
-	}
-	public isTooSmallToRender(rect: Rect2): boolean {
-		return rect.maxDimension < 15 / this.getSizeOfCanvasPixelOnScreen();
-	}
-	public drawPoints(..._points: Vec3[]): void {
-	}
-}

package/src/shortcuts/KeyBinding.test.ts

@@ -1,51 +0,0 @@
-import KeyBinding from './KeyBinding';
-
-describe('KeyBinding', ()  => {
-	it('toString should produce keybinds that can be interpreted by fromString', () => {
-		const testStrings = [
-			'c',
-			'Shift+c',
-			'Ctrl+Shift+a',
-			'Ctrl+c',
-			'control',
-			'shift',
-			'meta',
-			'Ctrl+Alt+delete',
-			'leftarrow',
-			'CtrlOrMeta+z',
-			'á',
-			'-',
-			'+',
-		];
-
-		for (const str of testStrings) {
-			expect(KeyBinding.fromString(str).toString()).toBe(str);
-		}
-	});
-
-	it('ctrlOrMeta should match events with either ctrl or meta (or both) modifiers', () => {
-		const ctrlOrMetaA = KeyBinding.fromString('CtrlOrMeta-a');
-		const ctrlA = KeyBinding.fromString('ctrl-a');
-		const metaA = KeyBinding.fromString('meta-a');
-		const ctrlOrMetaShiftB = KeyBinding.fromString('CtrlOrMeta-Shift-b');
-		const shiftB = KeyBinding.fromString('Shift-b');
-
-		expect(ctrlOrMetaA.matchesEvent(ctrlA)).toBe(true);
-		expect(ctrlOrMetaA.matchesEvent(metaA)).toBe(true);
-		expect(ctrlOrMetaA.matchesEvent(ctrlOrMetaShiftB)).toBe(false);
-		expect(
-			ctrlOrMetaShiftB.matchesEvent({
-				key: 'b', shiftKey: true, metaKey: true
-			}),
-		).toBe(true);
-		expect(ctrlOrMetaShiftB.matchesEvent(shiftB)).toBe(false);
-	});
-
-	it('ctrl-1 should match ctrl + the number 1', () => {
-		const ctrl1 = KeyBinding.fromString('ctrl-1');
-
-		expect(ctrl1.matchesEvent({ key: '1', shiftKey: false, ctrlKey: true })).toBe(true);
-		expect(ctrl1.matchesEvent({ key: '1', shiftKey: true, ctrlKey: true })).toBe(true);
-		expect(ctrl1.matchesEvent({ key: '1', shiftKey: true, ctrlKey: false })).toBe(false);
-	});
-});