From 9bf71af5914f71d22b6eb4b958c12bced09009bd Mon Sep 17 00:00:00 2001 From: emilys314 Date: Mon, 14 Oct 2024 10:04:22 -0400 Subject: [PATCH] Add cypress test --- .../cypress/cypress/pages/workbench.ts | 30 ++++++++ .../tests/mocked/projects/workbench.cy.ts | 70 +++++++++++++++++++ .../screens/spawner/SpawnerFooter.tsx | 14 ++-- .../connections/ConnectionsFormSection.tsx | 4 +- .../connections/SelectConnectionsModal.tsx | 1 + 5 files changed, 109 insertions(+), 10 deletions(-) diff --git a/frontend/src/__tests__/cypress/cypress/pages/workbench.ts b/frontend/src/__tests__/cypress/cypress/pages/workbench.ts index e369f0fdd6..d26a380023 100644 --- a/frontend/src/__tests__/cypress/cypress/pages/workbench.ts +++ b/frontend/src/__tests__/cypress/cypress/pages/workbench.ts @@ -174,6 +174,22 @@ class NotebookRow extends TableRow { } } +class AttachConnectionModal extends Modal { + constructor() { + super('Attach existing connections'); + } + + selectConnectionOption(name: string) { + this.find().findByRole('button', { name: 'Connections' }).click(); + this.find().findByRole('option', { name }).click(); + this.find().findByRole('button', { name: 'Connections' }).click(); + } + + findAttachButton() { + return this.find().findByTestId('attach-button'); + } +} + class CreateSpawnerPage { k8sNameDescription = new K8sNameDescriptionField('workbench'); @@ -309,6 +325,19 @@ class CreateSpawnerPage { findContainerSizeInput(name: string) { return cy.findByTestId('container-size-group').contains(name); } + + findAttachConnectionButton() { + return cy.findByTestId('attach-existing-connection-button'); + } + + findConnectionsTable() { + return cy.findByTestId('connections-table'); + } + + findConnectionsTableRow(name: string, type: string) { + this.findConnectionsTable().find(`[data-label=Name]`).contains(name); + this.findConnectionsTable().find(`[data-label=Type]`).contains(type); + } } class EditSpawnerPage extends CreateSpawnerPage { @@ -373,3 +402,4 @@ export const notebookConfirmModal = new NotebookConfirmModal(); export const editSpawnerPage = new EditSpawnerPage(); export const storageModal = new StorageModal(); export const notFoundSpawnerPage = new NotFoundSpawnerPage(); +export const attachConnectionModal = new AttachConnectionModal(); diff --git a/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/workbench.cy.ts b/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/workbench.cy.ts index fef7f93dff..5d81eab73e 100644 --- a/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/workbench.cy.ts +++ b/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/workbench.cy.ts @@ -13,6 +13,7 @@ import { mockImageStreamK8sResource } from '~/__mocks__/mockImageStreamK8sResour import { mockPVCK8sResource } from '~/__mocks__/mockPVCK8sResource'; import { mockPodK8sResource } from '~/__mocks__/mockPodK8sResource'; import { + attachConnectionModal, createSpawnerPage, editSpawnerPage, notFoundSpawnerPage, @@ -37,6 +38,7 @@ import { import { mock200Status } from '~/__mocks__/mockK8sStatus'; import type { NotebookSize } from '~/types'; import { mockAcceleratorProfile } from '~/__mocks__/mockAcceleratorProfile'; +import { mockConnectionTypeConfigMap } from '~/__mocks__/mockConnectionType'; const configYamlPath = '../../__mocks__/mock-upload-configmap.yaml'; @@ -407,6 +409,74 @@ describe('Workbench page', () => { verifyRelativeURL('/projects/test-project?section=workbenches'); }); + it('Create workbench with connection', () => { + initIntercepts({ isEmpty: true }); + cy.interceptOdh('GET /api/config', mockDashboardConfig({ disableConnectionTypes: false })); + cy.interceptOdh('GET /api/connection-types', [mockConnectionTypeConfigMap({})]); + cy.interceptK8sList( + { model: SecretModel, ns: 'test-project' }, + mockK8sResourceList([ + mockSecretK8sResource({ name: 'test1', displayName: 'test1' }), + mockSecretK8sResource({ name: 'test2', displayName: 'test2' }), + ]), + ); + + workbenchPage.visit('test-project'); + workbenchPage.findCreateButton().click(); + createSpawnerPage.findSubmitButton().should('be.disabled'); + verifyRelativeURL('/projects/test-project/spawner'); + createSpawnerPage.k8sNameDescription.findDisplayNameInput().fill('1234'); + createSpawnerPage.findNotebookImage('test-9').click(); + + createSpawnerPage.findAttachConnectionButton().click(); + attachConnectionModal.shouldBeOpen(); + attachConnectionModal.findAttachButton().should('be.disabled'); + attachConnectionModal.selectConnectionOption('test1'); + attachConnectionModal.findAttachButton().should('be.enabled'); + attachConnectionModal.selectConnectionOption('test2'); + attachConnectionModal.findAttachButton().click(); + + createSpawnerPage.findConnectionsTableRow('test1', 's3'); + createSpawnerPage.findConnectionsTableRow('test2', 's3'); + + createSpawnerPage.findSubmitButton().click(); + cy.wait('@createWorkbench').then((interception) => { + expect(interception.request.body).to.containSubset({ + metadata: { + annotations: { + 'openshift.io/display-name': '1234', + }, + name: 'wb-1234', + namespace: 'test-project', + }, + spec: { + template: { + spec: { + affinity: {}, + containers: [ + { + envFrom: [ + { + secretRef: { + name: 'test1', + }, + }, + { + secretRef: { + name: 'test2', + }, + }, + ], + }, + ], + }, + }, + }, + }); + }); + verifyRelativeURL('/projects/test-project?section=workbenches'); + }); + it('list workbench and table sorting', () => { initIntercepts({ notebookSizes: [ diff --git a/frontend/src/pages/projects/screens/spawner/SpawnerFooter.tsx b/frontend/src/pages/projects/screens/spawner/SpawnerFooter.tsx index bba20feb87..54ed3f874f 100644 --- a/frontend/src/pages/projects/screens/spawner/SpawnerFooter.tsx +++ b/frontend/src/pages/projects/screens/spawner/SpawnerFooter.tsx @@ -41,8 +41,8 @@ type SpawnerFooterProps = { storageData: StorageData; envVariables: EnvVariable[]; dataConnection: DataConnectionData; - isConnectionTypesEnabled: boolean; - connections: Connection[]; + isConnectionTypesEnabled?: boolean; + connections?: Connection[]; canEnablePipelines: boolean; }; @@ -52,7 +52,7 @@ const SpawnerFooter: React.FC = ({ envVariables, dataConnection, isConnectionTypesEnabled, - connections, + connections = [], canEnablePipelines, }) => { const [error, setError] = React.useState(); @@ -155,16 +155,12 @@ const SpawnerFooter: React.FC = ({ dataConnection, existingNotebookDataConnection, dryRun, - ).catch(handleError); + ); - if (isConnectionTypesEnabled && envFrom) { + if (isConnectionTypesEnabled) { envFrom = setConnectionsOnEnvFrom(connections, envFrom, projectConnections); } - if (!pvcDetails || !envFrom) { - return; - } - const annotations = { ...editNotebook.metadata.annotations }; if (envFrom.length > 0) { annotations['notebooks.opendatahub.io/notebook-restart'] = 'true'; diff --git a/frontend/src/pages/projects/screens/spawner/connections/ConnectionsFormSection.tsx b/frontend/src/pages/projects/screens/spawner/connections/ConnectionsFormSection.tsx index d9170b2737..ae22584397 100644 --- a/frontend/src/pages/projects/screens/spawner/connections/ConnectionsFormSection.tsx +++ b/frontend/src/pages/projects/screens/spawner/connections/ConnectionsFormSection.tsx @@ -111,6 +111,7 @@ export const ConnectionsFormSection: React.FC = ({ trigger={unselectedConnections.length === 0 ? 'mouseenter focus' : 'manual'} > {' '}