diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts new file mode 100644 index 0000000000..309005277e --- /dev/null +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts @@ -0,0 +1,28 @@ +import { test } from '@playwright/test'; +import { + waitForPageInit, + selectTopPanelButton, + TopPanelButton, + openFile, + takeEditorScreenshot, +} from '@utils'; + +test.describe.only('PPTX files', () => { + test.beforeEach(async ({ page }) => { + await waitForPageInit(page); + }); + + test('open pptx file', async ({ page }) => { + await selectTopPanelButton(TopPanelButton.Open, page); + await openFile('PPTX/pptx-with-chem-draw.pptx', page); + await takeEditorScreenshot(page); + await page.getByText('Structure 2').click(); + await takeEditorScreenshot(page); + }); + + test('open empty pptx file', async ({ page }) => { + await selectTopPanelButton(TopPanelButton.Open, page); + await openFile('PPTX/pptx-empty.pptx', page); + await takeEditorScreenshot(page); + }); +}); diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-empty-pptx-file-1-chromium-linux.png b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-empty-pptx-file-1-chromium-linux.png new file mode 100644 index 0000000000..dd7b855481 Binary files /dev/null and b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-empty-pptx-file-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-pptx-file-1-chromium-linux.png b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-pptx-file-1-chromium-linux.png new file mode 100644 index 0000000000..6315336eaf Binary files /dev/null and b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-pptx-file-1-chromium-linux.png differ diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-pptx-file-2-chromium-linux.png b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-pptx-file-2-chromium-linux.png new file mode 100644 index 0000000000..4c1585241e Binary files /dev/null and b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PPTX-Files/pptx-files.spec.ts-snapshots/PPTX-files-open-pptx-file-2-chromium-linux.png differ diff --git a/ketcher-autotests/tests/test-data/PPTX/pptx-empty.pptx b/ketcher-autotests/tests/test-data/PPTX/pptx-empty.pptx new file mode 100644 index 0000000000..bc334d1442 Binary files /dev/null and b/ketcher-autotests/tests/test-data/PPTX/pptx-empty.pptx differ diff --git a/ketcher-autotests/tests/test-data/PPTX/pptx-with-chem-draw.pptx b/ketcher-autotests/tests/test-data/PPTX/pptx-with-chem-draw.pptx new file mode 100644 index 0000000000..63b354f85f Binary files /dev/null and b/ketcher-autotests/tests/test-data/PPTX/pptx-with-chem-draw.pptx differ diff --git a/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.module.less b/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.module.less index 7ad6f28c89..db8a21b03d 100644 --- a/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.module.less +++ b/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.module.less @@ -35,16 +35,27 @@ } .menuListWrapper { - background: @color-background-canvas; - padding: 2em 1em; + background: @gray-background-color; + padding: 16px 8px; border-radius: 8px; flex: 1; + overflow-y: auto; > ul { background: @color-background-primary; > li { padding: 0.5em; + + &:hover { + background: @color-spec-button-primary-hover !important; + color: white; + } + } + + :global(.Mui-selected) { + background: @color-button-primary-clicked !important; + color: white; } } diff --git a/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.tsx b/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.tsx index aa8b44cc9e..dad101004d 100644 --- a/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.tsx +++ b/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/components/CDXStructuresViewer/CDXStructuresViewer.tsx @@ -59,7 +59,7 @@ export const CDXStructuresViewer = ({ } else { inputHandler(itemsMap[selectedIndex].struct); } - }, [itemsMap, selectedIndex]); + }, [inputHandler, itemsMap, selectedIndex]); const getImages = useCallback(() => { const options = { outputFormat: 'png', bondThickness: 1 }; @@ -84,7 +84,7 @@ export const CDXStructuresViewer = ({ .catch((error) => { return { struct: str, - error: error.message, + error: error.message || error, }; }); }); @@ -137,7 +137,7 @@ export const CDXStructuresViewer = ({