diff --git a/e2e/tests/functional/plugins/imagery/exampleImagery.e2e.spec.js b/e2e/tests/functional/plugins/imagery/exampleImagery.e2e.spec.js index 60b68a52ca..4b1481bbe3 100644 --- a/e2e/tests/functional/plugins/imagery/exampleImagery.e2e.spec.js +++ b/e2e/tests/functional/plugins/imagery/exampleImagery.e2e.spec.js @@ -30,6 +30,7 @@ const { test, expect } = require('../../../../pluginFixtures'); const { createDomainObjectWithDefaults } = require('../../../../appActions'); const backgroundImageSelector = '.c-imagery__main-image__background-image'; const panHotkey = process.platform === 'linux' ? ['Shift', 'Alt'] : ['Alt']; +const tagHotkey = ['Shift', 'Alt']; const expectedAltText = process.platform === 'linux' ? 'Shift+Alt drag to pan' : 'Alt drag to pan'; const thumbnailUrlParamsRegexp = /\?w=100&h=100/; @@ -129,6 +130,36 @@ test.describe('Example Imagery Object', () => { }); + test('Can use alt+shift+drag to create a tag', async ({ page }) => { + const canvas = page.locator('canvas'); + await canvas.hover({trial: true}); + + const canvasBoundingBox = await canvas.boundingBox(); + const canvasCenterX = canvasBoundingBox.x + canvasBoundingBox.width / 2; + const canvasCenterY = canvasBoundingBox.y + canvasBoundingBox.height / 2; + + await Promise.all(tagHotkey.map(x => page.keyboard.down(x))); + await page.mouse.down(); + // steps not working for me here + await page.mouse.move(canvasCenterX - 20, canvasCenterY - 20); + await page.mouse.move(canvasCenterX - 100, canvasCenterY - 100); + await page.mouse.up(); + await Promise.all(tagHotkey.map(x => page.keyboard.up(x))); + + //Wait for canvas to stablize. + await canvas.hover({trial: true}); + + // add some tags + await page.getByText('Annotations').click(); + await page.getByRole('button', { name: /Add Tag/ }).click(); + await page.getByPlaceholder('Type to select tag').click(); + await page.getByText('Driving').click(); + + await page.getByRole('button', { name: /Add Tag/ }).click(); + await page.getByPlaceholder('Type to select tag').click(); + await page.getByText('Science').click(); + }); + test('Can use + - buttons to zoom on the image @unstable', async ({ page }) => { await buttonZoomOnImageAndAssert(page); }); diff --git a/src/plugins/imagery/components/AnnotationsCanvas.vue b/src/plugins/imagery/components/AnnotationsCanvas.vue index 505526a7e7..c8df12dd05 100644 --- a/src/plugins/imagery/components/AnnotationsCanvas.vue +++ b/src/plugins/imagery/components/AnnotationsCanvas.vue @@ -79,7 +79,6 @@ export default { this.buildAnnotationIndex(); }, beforeDestroy() { - console.debug(`🚮 Canvas destroyed`); this.openmct.selection.off('change', this.updateSelection); document.body.removeEventListener('click', this.cancelSelection); }, @@ -158,7 +157,7 @@ export default { this.context.stroke(); }, trackAnnotationDrag(event) { - if (this.mouseDown && !this.dragging && event.shiftKey) { + if (this.mouseDown && !this.dragging && event.shiftKey && event.altKey) { this.startAnnotationDrag(event); } else if (this.dragging) { const boundingRect = this.canvas.getBoundingClientRect();