Merge branch 'master' of github.com:epam/ketcher into 3276-remove-edi…

…t-attachment-point-from-right-click-context-menu

example/src/PolymerToggler/PolymerToggler.tsx

@@ -22,7 +22,7 @@ export interface PolymerTogglerProps {
 
 const PolymerToggler = ({ toggle }: PolymerTogglerProps): JSX.Element => {
   return (
-    <label className={styles.switch} data-testid="PolymerToggler">
+    <label className={styles.switch} data-testid="polymer-toggler">
       <input type="checkbox" onChange={(e) => toggle(e.target.checked)} />
       <span className={styles.slider} />
     </label>

ketcher-autotests/Dockerfile

@@ -1,6 +1,6 @@
 
 FROM node:18-alpine
-FROM mcr.microsoft.com/playwright:v1.36.0-jammy
+FROM mcr.microsoft.com/playwright:v1.37.0-jammy
 
 WORKDIR /app
 

ketcher-autotests/constants/testIdConstants.ts

@@ -2,7 +2,7 @@ const PEPTIDES_TAB = 'PEPTIDES_TAB';
 const RNA_TAB = 'RNA_TAB';
 const CHEM_TAB = 'CHEM_TAB';
 const FAVORITES_TAB = 'FAVORITES_TAB';
-const POLYMER_TOGGLER = 'PolymerToggler';
+const POLYMER_TOGGLER = 'polymer-toggler';
 const SUGAR = 'rna-builder-slot--sugar';
 const BASE = 'rna-builder-slot--base';
 const PHOSPHATE = 'rna-builder-slot--phosphate';

ketcher-autotests/package.json

@@ -8,7 +8,7 @@
     "test": "npx playwright test",
     "test:debug": "npx playwright test --debug",
     "test:update": "npx playwright test --update-snapshots",
-    "test:trace": "npx playwright test --trace on --grep @check",
+    "test:trace": "npx playwright test --trace on",
     "check:code": "npm run check:types && npm run check:lint",
     "check:types": "tsc --noEmit",
     "check:lint": "eslint .",
@@ -24,7 +24,7 @@
   "author": "Nitvex",
   "license": "ISC",
   "devDependencies": {
-    "@playwright/test": "^1.36.1",
+    "@playwright/test": "1.37.0",
     "eslint": "^8.44.0",
     "lint-staged": "^13.1.2",
     "prettier": "2.8.4"

ketcher-autotests/tests/File-Management/Open-And-Save-Files/InChi/InChi.spec.ts

@@ -476,6 +476,7 @@ test.describe('Open and Save InChI file', () => {
     await pasteFromClipboardAndAddToCanvas(
       page,
       '1S/C9H14/c1-3-5-7-9-8-6-4-2/h3,5-9H,4H2,1-2H3/b5-3-,8-6+,9-7+',
+      false,
     );
     const convertErrorMessage = await page
       .getByTestId('info-modal-body')

ketcher-autotests/tests/Macromolecule-editor/Erase-Tool/erase-tool.spec.ts

@@ -0,0 +1,55 @@
+import { test } from '@playwright/test';
+import {
+  addMonomerToCanvas,
+  selectEraseTool,
+  selectSingleBondTool,
+  takeEditorScreenshot,
+} from '@utils';
+import { turnOnMacromoleculesEditor } from '@utils/macromolecules';
+import { bondTwoMonomers } from '@utils/macromolecules/polymerBond';
+/* eslint-disable no-magic-numbers */
+
+test.describe('Erase Tool', () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto('');
+    await turnOnMacromoleculesEditor(page);
+  });
+  test.skip('Delete monomer bonded with another monomers', async ({ page }) => {
+    /* 
+    Test case: #2370 - "Erase" tool for macromolecules editor
+    Description: Erase Tool
+    */
+
+    // Create 4 peptides on canvas
+    const MONOMER_NAME = 'Tza___3-thiazolylalanine';
+    const MONOMER_ALIAS = 'Tza';
+    await addMonomerToCanvas(page, MONOMER_NAME, 300, 300);
+    await addMonomerToCanvas(page, MONOMER_NAME, 400, 400);
+    await addMonomerToCanvas(page, MONOMER_NAME, 500, 500);
+    await addMonomerToCanvas(page, MONOMER_NAME, 500, 200);
+
+    // Get 4 peptides locators
+    const peptides = await page.getByText(MONOMER_ALIAS).locator('..');
+    const peptide1 = peptides.nth(0);
+    const peptide2 = peptides.nth(1);
+    const peptide3 = peptides.nth(2);
+    const peptide4 = peptides.nth(3);
+
+    // Select bond tool
+    await selectSingleBondTool(page);
+
+    // Create bonds between peptides
+    await bondTwoMonomers(page, peptide1, peptide2);
+    await bondTwoMonomers(page, peptide3, peptide2);
+    await bondTwoMonomers(page, peptide3, peptide4);
+
+    await takeEditorScreenshot(page);
+
+    await selectEraseTool(page);
+
+    // Delete peptide linked with two other peptides by bonds
+    await peptide3.click();
+
+    await takeEditorScreenshot(page);
+  });
+});

ketcher-autotests/tests/Macromolecule-editor/Polymer-Bond-Tool/polymer-bond-tool.spec.ts

@@ -1,5 +1,6 @@
-import { test, expect } from '@playwright/test';
+import { test } from '@playwright/test';
 import { selectSingleBondTool, waitForPageInit } from '@utils';
+import { turnOnMacromoleculesEditor } from '@utils/macromolecules';
 /* eslint-disable no-magic-numbers */
 
 test.describe('Polymer Bond Tool', () => {
@@ -12,8 +13,7 @@ test.describe('Polymer Bond Tool', () => {
     Description: Polymer bond tool
     */
 
-    await expect(page.getByTestId('PolymerToggler')).toBeVisible();
-    await page.getByTestId('PolymerToggler').click();
+    await turnOnMacromoleculesEditor(page);
 
     // Choose peptide
     await page.getByText('Tza').click();
@@ -25,7 +25,7 @@ test.describe('Polymer Bond Tool', () => {
     await page.mouse.click(500, 200);
 
     // Get 4 peptides locators
-    const peptides = await page.getByText('Tza');
+    const peptides = await page.getByText('Tza').locator('..');
     const peptide1 = peptides.nth(0);
     const peptide2 = peptides.nth(1);
     const peptide3 = peptides.nth(2);
@@ -69,8 +69,7 @@ test.describe('Polymer Bond Tool', () => {
     Description: Polymer bond tool
     */
 
-    await expect(page.getByTestId('PolymerToggler')).toBeVisible();
-    await page.getByTestId('PolymerToggler').click();
+    await turnOnMacromoleculesEditor(page);
 
     // Choose chems
     await page.getByText('CHEM').click();
@@ -81,7 +80,7 @@ test.describe('Polymer Bond Tool', () => {
     await page.mouse.click(400, 400);
 
     // Get 2 chems locators
-    const chems = await page.getByText('hxy');
+    const chems = await page.getByText('hxy').locator('..');
     const chem1 = chems.nth(0);
     const chem2 = chems.nth(1);
 

ketcher-autotests/tests/Macromolecule-editor/RNAEditor/add-default-presets.spec.ts

@@ -1,4 +1,5 @@
-import { test, expect } from '@playwright/test';
+import { turnOnMacromoleculesEditor } from '@utils/macromolecules';
+import { test } from '@playwright/test';
 import { waitForPageInit } from '@utils/common';
 
 test.describe('Macromolecules default presets', () => {
@@ -10,8 +11,7 @@ test.describe('Macromolecules default presets', () => {
     Test case: #2934 - rna builder: add default presets
     Description: Switch to Polymer Editor
     */
-    await expect(page.getByTestId('PolymerToggler')).toBeVisible();
-    await page.getByTestId('PolymerToggler').click();
+    await turnOnMacromoleculesEditor(page);
     await page.getByText('RNA').click();
 
     await page.getByTestId('cancel-btn').click();
@@ -25,8 +25,7 @@ test.describe('Macromolecules default presets', () => {
     /* 
     Test case: #2507 - Add RNA monomers to canvas (by click)
     */
-    await expect(page.getByTestId('PolymerToggler')).toBeVisible();
-    await page.getByTestId('PolymerToggler').click();
+    await turnOnMacromoleculesEditor(page);
     await page.getByText('RNA').click();
     await page.getByTestId('cancel-btn').click();
 

ketcher-autotests/tests/Macromolecule-editor/Rectangle-Selection-Tool/rectangle-selection-tool.spec.ts

@@ -0,0 +1,116 @@
+import { test } from '@playwright/test';
+import {
+  addMonomerToCanvas,
+  dragMouseTo,
+  selectEraseTool,
+  selectRectangleArea,
+  selectRectangleSelectionTool,
+  selectSingleBondTool,
+  takeEditorScreenshot,
+} from '@utils';
+import { turnOnMacromoleculesEditor } from '@utils/macromolecules';
+import { bondTwoMonomers } from '@utils/macromolecules/polymerBond';
+/* eslint-disable no-magic-numbers */
+
+test.describe('Rectangle Selection Tool', () => {
+  test.beforeEach(async ({ page }) => {
+    await page.goto('');
+    await turnOnMacromoleculesEditor(page);
+  });
+  test.skip('Select monomer and bonds and then erase', async ({ page }) => {
+    /* 
+    Test case: #2360 - "Select" tool for Macromolecules editor
+    Description: Rectangle Selection Tool
+    */
+
+    // Create 4 peptides on canvas
+    const MONOMER_NAME = 'Tza___3-thiazolylalanine';
+    const MONOMER_ALIAS = 'Tza';
+    await addMonomerToCanvas(page, MONOMER_NAME, 300, 300);
+    await addMonomerToCanvas(page, MONOMER_NAME, 400, 400);
+    await addMonomerToCanvas(page, MONOMER_NAME, 500, 500);
+    await addMonomerToCanvas(page, MONOMER_NAME, 500, 200);
+
+    // Get 4 peptides locators
+    const peptides = await page.getByText(MONOMER_ALIAS).locator('..');
+    const peptide1 = peptides.nth(0);
+    const peptide2 = peptides.nth(1);
+    const peptide3 = peptides.nth(2);
+    const peptide4 = peptides.nth(3);
+
+    // Select bond tool
+    await selectSingleBondTool(page);
+
+    // Create bonds between peptides
+    await bondTwoMonomers(page, peptide1, peptide2);
+    await bondTwoMonomers(page, peptide3, peptide2);
+    await bondTwoMonomers(page, peptide3, peptide4);
+
+    await page.screenshot({
+      path: 'tests/Macromolecule-editor/screenshots/rectangle-selection-tool.png',
+    });
+
+    await selectRectangleSelectionTool(page);
+
+    // Coordinates for rectangle selection
+    const startX = 100;
+    const startY = 100;
+    const endX = 500;
+    const endY = 500;
+
+    await selectRectangleArea(page, startX, startY, endX, endY);
+
+    await page.screenshot({
+      path: 'tests/Macromolecule-editor/screenshots/rectangle-selection-tool2.png',
+    });
+
+    // Erase selected elements
+    await selectEraseTool(page);
+
+    await page.screenshot({
+      path: 'tests/Macromolecule-editor/screenshots/rectangle-selection-tool3.png',
+    });
+  });
+
+  test.skip('Move monomer bonded with another monomers', async ({ page }) => {
+    /* 
+    Test case: #2367 - move items on the canvas
+    Description: check ability to move items on the canvas
+    */
+
+    // Choose peptide
+    await page.getByText('Tza').click();
+
+    // Create 4 peptides on canvas
+    await page.mouse.click(300, 300);
+    await page.mouse.click(400, 400);
+    await page.mouse.click(500, 500);
+    await page.mouse.click(600, 600);
+
+    // Get 4 peptides locators
+    const peptides = await page.getByText('Tza').locator('..');
+    const peptide1 = peptides.nth(0);
+    const peptide2 = peptides.nth(1);
+    const peptide3 = peptides.nth(2);
+    const peptide4 = peptides.nth(3);
+
+    // Select bond tool
+    await selectSingleBondTool(page);
+
+    // Create bonds between peptides
+    await bondTwoMonomers(page, peptide1, peptide2);
+    await bondTwoMonomers(page, peptide3, peptide2);
+    await bondTwoMonomers(page, peptide3, peptide4);
+
+    await takeEditorScreenshot(page);
+
+    // Move selected monomer
+    await selectRectangleSelectionTool(page);
+    await page.mouse.move(400, 400);
+    await dragMouseTo(500, 500, page);
+    await page.mouse.move(400, 400);
+    await dragMouseTo(200, 400, page);
+
+    await takeEditorScreenshot(page);
+  });
+});

ketcher-autotests/tests/Reactions/Reaction-tools/Plus-and-Arrow-tools/plus-and-arrows-tools.spec.ts

@@ -735,7 +735,6 @@ test.describe('Plus and Arrows tools ', () => {
        * Test case: Test case: EPMLSOPKET - 16947
        * Description:  All Arrows should have correct tooltip
        */
-
       await selectLeftPanelButton(LeftPanelButton.ArrowOpenAngleTool, page);
       await selectLeftPanelButton(LeftPanelButton.ArrowOpenAngleTool, page);
       const button = page.getByTestId(id).first();

ketcher-autotests/tests/Templates/Functional-Groups/functional-groups.spec.ts

@@ -498,8 +498,8 @@ test.describe('Functional Groups', () => {
     await pressButton(page, STRUCTURE_LIBRARY_BUTTON_NAME);
     await pressTab(page, 'Salts and Solvents');
     await selectSaltsAndSolvents(SaltsAndSolvents.MethaneSulphonicAcid, page);
-    await clickInTheMiddleOfTheScreen(page);
 
+    await clickInTheMiddleOfTheScreen(page);
     await clickInTheMiddleOfTheScreen(page, 'right');
     await page.getByText('Expand Abbreviation').click();
 

ketcher-autotests/tests/test-data/CDXML/mixed-and-stereo-marks-expected.cdxml

@@ -48,19 +48,19 @@
                     <s font="3" size="10" face="96">OH</s>
                 </t>
             </n>
-            <n id="11" p="128.647324 42.840656" Geometry="Tetrahedral" BondOrdering="5 9 12 5" EnhancedStereoType="Absolute"/>
+            <n id="11" p="128.647324 42.840645" Geometry="Tetrahedral" BondOrdering="5 9 12 5" EnhancedStereoType="Absolute"/>
             <n id="12" p="128.647324 69.450546" Geometry="Tetrahedral" BondOrdering="6 11 13 5" EnhancedStereoType="Absolute"/>
             <n id="13" p="103.049927 82.447800" Geometry="Tetrahedral" BondOrdering="7 12 14 5" EnhancedStereoType="Absolute"/>
             <n id="14" p="77.609169 69.456123" Geometry="Tetrahedral" BondOrdering="8 13 15 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
             <n id="15" p="77.609169 42.843433" Geometry="Tetrahedral" BondOrdering="9 14 16 5" EnhancedStereoType="And" EnhancedStereoGroupNum="2"/>
             <n id="16" p="52.316608 30.005592"/>
             <n id="17" p="302.243713 63.912636"/>
-            <n id="18" p="330.859070 80.434044" Geometry="Tetrahedral" BondOrdering="17 24 19 5" EnhancedStereoType="And" EnhancedStereoGroupNum="3"/>
-            <n id="19" p="360.227081 63.912636" Geometry="Tetrahedral" BondOrdering="18 25 20 5" EnhancedStereoType="And" EnhancedStereoGroupNum="4"/>
-            <n id="20" p="388.095154 80.434044"/>
-            <n id="21" p="416.713226 63.912636"/>
-            <n id="22" Element="8" NumHydrogens="0" p="273.625702 80.434044">
-                <t p="273.625702 80.434044" LabelJustification="Left">
+            <n id="18" p="330.859039 80.434044" Geometry="Tetrahedral" BondOrdering="17 24 19 5" EnhancedStereoType="And" EnhancedStereoGroupNum="3"/>
+            <n id="19" p="360.227051 63.912636" Geometry="Tetrahedral" BondOrdering="18 25 20 5" EnhancedStereoType="And" EnhancedStereoGroupNum="4"/>
+            <n id="20" p="388.095123 80.434044"/>
+            <n id="21" p="416.713196 63.912636"/>
+            <n id="22" Element="8" NumHydrogens="0" p="273.625671 80.434044">
+                <t p="273.625671 80.434044" LabelJustification="Left">
                     <s font="3" size="10" face="96">O</s>
                 </t>
             </n>
@@ -69,13 +69,13 @@
                     <s font="3" size="10" face="96">OH</s>
                 </t>
             </n>
-            <n id="24" Element="7" NumHydrogens="2" p="330.859070 113.476822">
-                <t p="330.859070 113.476822" LabelJustification="Left">
+            <n id="24" Element="7" NumHydrogens="2" p="330.859039 113.476822">
+                <t p="330.859039 113.476822" LabelJustification="Left">
                     <s font="3" size="10" face="96">NH</s>
                     <s font="3" size="10" face="32">2</s>
                 </t>
             </n>
-            <n id="25" p="359.477081 30.867033"/>
+            <n id="25" p="359.477051 30.867033"/>
             <b id="26" B="10" E="16"/>
             <b id="27" B="15" E="9"/>
             <b id="28" B="9" E="11"/>

ketcher-autotests/tests/test-data/CDXML/stereo-and-structure-expected.cdxml

@@ -23,18 +23,18 @@
                     <s font="3" size="10" face="96">OH</s>
                 </t>
             </n>
-            <n id="6" Element="8" NumHydrogens="1" p="156.737961 90.041985">
-                <t p="156.737961 90.041985" LabelJustification="Left">
+            <n id="6" Element="8" NumHydrogens="1" p="156.737961 90.041969">
+                <t p="156.737961 90.041969" LabelJustification="Left">
                     <s font="3" size="10" face="96">OH</s>
                 </t>
             </n>
-            <n id="7" Element="8" NumHydrogens="1" p="104.732979 120.065987">
-                <t p="104.732979 120.065987" LabelJustification="Left">
+            <n id="7" Element="8" NumHydrogens="1" p="104.732956 120.065979">
+                <t p="104.732956 120.065979" LabelJustification="Left">
                     <s font="3" size="10" face="96">OH</s>
                 </t>
             </n>
-            <n id="8" Element="8" NumHydrogens="1" p="52.886982 90.047997">
-                <t p="52.886982 90.047997" LabelJustification="Left">
+            <n id="8" Element="8" NumHydrogens="1" p="52.886982 90.047981">
+                <t p="52.886982 90.047981" LabelJustification="Left">
                     <s font="3" size="10" face="96">OH</s>
                 </t>
             </n>
@@ -48,10 +48,10 @@
                     <s font="3" size="10" face="96">OH</s>
                 </t>
             </n>
-            <n id="11" p="130.814957 45.012001" Geometry="Tetrahedral" BondOrdering="5 9 12 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
-            <n id="12" p="130.814957 75.029999" Geometry="Tetrahedral" BondOrdering="6 11 13 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
-            <n id="13" p="104.726974 90.047997" Geometry="Tetrahedral" BondOrdering="7 14 12 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
-            <n id="14" p="78.809967 75.036003" Geometry="Tetrahedral" BondOrdering="8 13 15 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
+            <n id="11" p="130.814926 45.012001" Geometry="Tetrahedral" BondOrdering="5 9 12 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
+            <n id="12" p="130.814926 75.029984" Geometry="Tetrahedral" BondOrdering="6 11 13 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
+            <n id="13" p="104.726974 90.047981" Geometry="Tetrahedral" BondOrdering="7 14 12 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
+            <n id="14" p="78.809967 75.035995" Geometry="Tetrahedral" BondOrdering="8 13 15 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
             <n id="15" p="78.809967 45.014992" Geometry="Tetrahedral" BondOrdering="9 14 16 5" EnhancedStereoType="And" EnhancedStereoGroupNum="1"/>
             <n id="16" p="52.886982 30.003004"/>
             <b id="17" B="10" E="16"/>