diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts new file mode 100644 index 0000000000..24584e7958 --- /dev/null +++ b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts @@ -0,0 +1,159 @@ +import { Page, test } from '@playwright/test'; +import { + BondType, + clickOnAtom, + clickOnBond, + dragMouseTo, + getControlModifier, + getCoordinatesOfTheMiddleOfTheScreen, + openFileAndAddToCanvas, + selectDropdownTool, + takeEditorScreenshot, + waitForPageInit, +} from '@utils'; +import { getAtomByIndex } from '@utils/canvas/atoms'; +import { getBondByIndex } from '@utils/canvas/bonds'; + +test.describe('Rectangle selection tool', () => { + test.beforeEach(async ({ page }) => { + await waitForPageInit(page); + }); + + test.afterEach(async ({ page }) => { + await takeEditorScreenshot(page); + }); + + const xDelta = 30; + const yDelta = 60; + const modifier = getControlModifier(); + + async function selectObjects( + page: Page, + xAxisRadius: number, + yAxisRadius: number, + ) { + const point = await getCoordinatesOfTheMiddleOfTheScreen(page); + await page.mouse.move(point.x - xAxisRadius, point.y - yAxisRadius); + await page.mouse.down(); + await page.mouse.move(point.x + xAxisRadius, point.y + yAxisRadius); + await page.mouse.up(); + return point; + } + + const selectionCoords = { x: 300, y: 200 }; + async function clickCanvas(page: Page) { + await page.mouse.click(selectionCoords.x, selectionCoords.y); + } + + test('Structure selection with rectangle selection tool', async ({ + page, + }) => { + // Test case: EPMLSOPKET-1347 + await openFileAndAddToCanvas('KET/two-benzene-with-atoms.ket', page); + await page.getByTestId('select-rectangle').click(); + await clickCanvas(page); + await selectObjects(page, selectionCoords.x, selectionCoords.y); + }); + + test('Drag structure', async ({ page }) => { + // Test case: EPMLSOPKET-1348 + const objectSelection = 100; + const atomNumber = 5; + await openFileAndAddToCanvas('KET/two-benzene-with-atoms.ket', page); + await page.getByTestId('select-rectangle').click(); + const point = await selectObjects(page, objectSelection, objectSelection); + await clickOnAtom(page, 'C', atomNumber); + await dragMouseTo(point.x + xDelta, point.y - yDelta, page); + }); + + test('Reaction components selection', async ({ page }) => { + // Test case: EPMLSOPKET-1349 + const atomNumber = 5; + const moveMouseCoordinatesY = 10; + const moveMouseCoordinatesX = 270; + await openFileAndAddToCanvas('Rxn-V2000/benzene-chain-reaction.rxn', page); + await page.getByTestId('select-rectangle').click(); + const point = await getCoordinatesOfTheMiddleOfTheScreen(page); + await clickCanvas(page); + + await page.keyboard.down('Shift'); + await page.mouse.click( + point.x - moveMouseCoordinatesX, + point.y + moveMouseCoordinatesY, + ); + await page.mouse.click(point.x, point.y + atomNumber); + await page.keyboard.up('Shift'); + await clickCanvas(page); + + await page.keyboard.press(`${modifier}+KeyA`); + }); + + test('Reaction components dragging', async ({ page }) => { + // Test case: EPMLSOPKET-1350 + const objectSelection = 100; + const moveMouseCoordinatesY = 10; + await openFileAndAddToCanvas('Rxn-V2000/benzene-chain-reaction.rxn', page); + await page.getByTestId('select-rectangle').click(); + await clickCanvas(page); + const point = await selectObjects( + page, + selectionCoords.x, + selectionCoords.y, + ); + await clickOnAtom(page, 'C', moveMouseCoordinatesY); + await dragMouseTo( + point.x - objectSelection, + point.y - selectionCoords.y, + page, + ); + }); + + test('Fusing atoms together', async ({ page }) => { + // Test case: EPMLSOPKET-1351 + const firstAtomNumber = 4; + const secondAtomNumber = 9; + await openFileAndAddToCanvas('KET/two-benzene-with-atoms.ket', page); + await page.getByTestId('select-rectangle').click(); + await clickOnAtom(page, 'C', firstAtomNumber); + const atomPoint = await getAtomByIndex( + page, + { label: 'C' }, + secondAtomNumber, + ); + await dragMouseTo(atomPoint.x, atomPoint.y, page); + }); + + test('Fusing bonds together', async ({ page }) => { + // Test case: EPMLSOPKET-1351 + const firstBondNumber = 3; + const secondBondnumber = 8; + await openFileAndAddToCanvas('KET/two-benzene-with-atoms.ket', page); + await page.getByTestId('select-rectangle').click(); + await clickOnBond(page, BondType.SINGLE, firstBondNumber); + const bondPoint = await getBondByIndex( + page, + { type: BondType.SINGLE }, + secondBondnumber, + ); + await dragMouseTo(bondPoint.x, bondPoint.y, page); + }); + + test('Delete with selection', async ({ page }) => { + // Test case: EPMLSOPKET-1352 + + async function selectReactionLeftPart() { + const shift = 5; + const emptySpace = { x: 100, y: 100 }; + const mostRightAtom = await getAtomByIndex(page, { label: 'Br' }, 0); + await page.mouse.move(emptySpace.x, emptySpace.y); + await dragMouseTo(mostRightAtom.x + shift, mostRightAtom.y + shift, page); + } + const atomOnTheRightSide = 14; + await openFileAndAddToCanvas('Rxn-V2000/benzene-chain-reaction.rxn', page); + await selectDropdownTool(page, 'select-rectangle', 'select-rectangle'); + await selectReactionLeftPart(); + await page.keyboard.press('Delete'); + await clickOnAtom(page, 'C', atomOnTheRightSide); + await page.keyboard.press('Delete'); + }); +}); diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Delete-with-selection-1-chromium-linux.png b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Delete-with-selection-1-chromium-linux.png new file mode 100644 index 0000000000..7fdf6e86af Binary files /dev/null and b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Delete-with-selection-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Drag-structure-1-chromium-linux.png b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Drag-structure-1-chromium-linux.png new file mode 100644 index 0000000000..435b6243f5 Binary files /dev/null and b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Drag-structure-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Fusing-atoms-together-1-chromium-linux.png b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Fusing-atoms-together-1-chromium-linux.png new file mode 100644 index 0000000000..30406ce76f Binary files /dev/null and b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Fusing-atoms-together-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Fusing-bonds-together-1-chromium-linux.png b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Fusing-bonds-together-1-chromium-linux.png new file mode 100644 index 0000000000..c253775ab4 Binary files /dev/null and b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Fusing-bonds-together-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Reaction-components-dragging-1-chromium-linux.png b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Reaction-components-dragging-1-chromium-linux.png new file mode 100644 index 0000000000..f7ad1db383 Binary files /dev/null and b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Reaction-components-dragging-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Reaction-components-selection-1-chromium-linux.png b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Reaction-components-selection-1-chromium-linux.png new file mode 100644 index 0000000000..db1c9a3783 Binary files /dev/null and b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Reaction-components-selection-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Structure-selection-with-rectangle-selection-tool-1-chromium-linux.png b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Structure-selection-with-rectangle-selection-tool-1-chromium-linux.png new file mode 100644 index 0000000000..78bdbcc788 Binary files /dev/null and b/ketcher-autotests/tests/Structure-Creating-&-Editing/Actions-With-Structures/Rectangle selection/rectangle-tool.spec.ts-snapshots/Rectangle-selection-tool-Structure-selection-with-rectangle-selection-tool-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/test-data/Rxn-V2000/benzene-chain-reaction.rxn b/ketcher-autotests/tests/test-data/Rxn-V2000/benzene-chain-reaction.rxn index fc75db4a15..4c0614fbb4 100644 --- a/ketcher-autotests/tests/test-data/Rxn-V2000/benzene-chain-reaction.rxn +++ b/ketcher-autotests/tests/test-data/Rxn-V2000/benzene-chain-reaction.rxn @@ -68,4 +68,8 @@ $MOL 1 0 0 0 0 999 V2000 25.8000 -6.3500 0.0000 Br 0 0 0 0 0 0 0 0 0 0 0 0 +<<<<<<< HEAD M END +======= +M END +>>>>>>> e62b0b8839743ff44ba2618abdd05f291237a829