Test for PVC clone

Signed-off-by: Ankush Behl <cloudbehl@gmail.com>

frontend/packages/console-app/src/components/modals/clone/clone-pvc-modal.tsx

@@ -121,6 +121,7 @@ const ClonePVCModal = withHandlePromise((props: ClonePVCModalProps) => {
           <FormGroup label="Size" isRequired fieldId="clone-pvc-modal__size">
             <RequestSizeInput
               name="requestSize"
+              testId="input-request-size"
               onChange={requestedSizeInputChange}
               defaultRequestSizeUnit={requestedUnit}
               defaultRequestSizeValue={requestedSize}

frontend/packages/integration-tests-cypress/tests/storage/clone.spec.ts

@@ -0,0 +1,79 @@
+import { testName, checkErrors } from '../../support';
+import { listPage } from '../../views/list-page';
+import { PVC, testerDeployment } from '../../mocks/snapshot';
+import { detailsPage, DetailsPageSelector } from '../../views/details-page';
+import { modal } from '../../views/modal';
+
+import { resourceStatusShouldContain } from '../../views/common';
+
+const cloneName = `${PVC.metadata.name}-clone`;
+const cloneSize = '2';
+
+if (Cypress.env('BRIDGE_AWS')) {
+  describe('Clone Tests', () => {
+    before(() => {
+      cy.login();
+      cy.createProject(testName);
+      cy.exec(`echo '${JSON.stringify(PVC)}' | oc apply -n ${testName} -f -`);
+      cy.exec(`echo '${JSON.stringify(testerDeployment)}' | oc apply -n ${testName} -f -`);
+      cy.clickNavLink(['Storage', 'Persistent Volume Claims']);
+      listPage.filter.byName(PVC.metadata.name);
+      resourceStatusShouldContain('Bound');
+    });
+
+    afterEach(() => {
+      checkErrors();
+    });
+
+    after(() => {
+      cy.exec(`echo '${JSON.stringify(testerDeployment)}' | oc delete -n ${testName} -f -`);
+      cy.exec(`echo '${JSON.stringify(PVC)}' | oc delete -n ${testName} -f -`);
+      cy.deleteProject(testName);
+      cy.logout();
+    });
+
+    it('Creates PVC Clone', () => {
+      listPage.rows.clickKebabAction(PVC.metadata.name, 'Clone PVC');
+      modal.shouldBeOpened();
+      modal.submitShouldBeEnabled();
+      cy.byTestID('input-request-size')
+        .clear()
+        .type(cloneSize);
+      modal.submit();
+      modal.shouldBeClosed();
+      cy.location('pathname').should(
+        'include',
+        `persistentvolumeclaims/${PVC.metadata.name}-clone`,
+      );
+      detailsPage.titleShouldContain(`${PVC.metadata.name}-clone`);
+      cy.exec(`oc get pvc ${PVC.metadata.name}-clone -n ${testName} -o json`)
+        .its('stdout')
+        .then((res) => {
+          const pvc = JSON.parse(res);
+          cy.get(DetailsPageSelector.name).contains(pvc.metadata.name);
+          cy.get(DetailsPageSelector.namespace).contains(pvc.metadata.namespace);
+          cy.byTestID('pvc-requested-capacity').contains(`${cloneSize} GiB`);
+        });
+    });
+
+    it('Lists Clone', () => {
+      cy.clickNavLink(['Persistent Volume Claims']);
+      listPage.rows.shouldBeLoaded();
+      listPage.rows.shouldExist(cloneName);
+    });
+
+    it('Deletes PVC Clone', () => {
+      listPage.filter.byName(cloneName);
+      listPage.rows.clickKebabAction(cloneName, 'Delete Persistent Volume Claim');
+      modal.shouldBeOpened();
+      modal.submitShouldBeEnabled();
+      modal.submit();
+      modal.shouldBeClosed();
+      listPage.rows.shouldNotExist(cloneName);
+    });
+  });
+} else {
+  describe('Skipping Clone Tests', () => {
+    it('No CSI based storage classes are available in this platform', () => {});
+  });
+}

frontend/packages/integration-tests-cypress/tests/storage/snapshot.spec.ts

@@ -2,7 +2,7 @@ import { testName, checkErrors } from '../../support';
 import { SnapshotDetails, dropdownFirstItem } from '../../views/storage/snapshot';
 import { listPage } from '../../views/list-page';
 import { PVC, testerDeployment, SnapshotClass, patchForVolume } from '../../mocks/snapshot';
-import { detailsPage } from '../../views/details-page';
+import { detailsPage, DetailsPageSelector } from '../../views/details-page';
 import { modal } from '../../views/modal';
 import { resourceStatusShouldContain } from '../../views/common';
 
@@ -57,8 +57,8 @@ if (Cypress.env('BRIDGE_AWS')) {
         .its('stdout')
         .then((res) => {
           const volumeSnapshot = JSON.parse(res);
-          cy.get(SnapshotDetails.name).contains(volumeSnapshot.metadata.name);
-          cy.get(SnapshotDetails.namespace).contains(volumeSnapshot.metadata.namespace);
+          cy.get(DetailsPageSelector.name).contains(volumeSnapshot.metadata.name);
+          cy.get(DetailsPageSelector.namespace).contains(volumeSnapshot.metadata.namespace);
           cy.get(SnapshotDetails.vsc).contains(
             volumeSnapshot.status.boundVolumeSnapshotContentName,
           );

frontend/packages/integration-tests-cypress/views/details-page.ts

@@ -13,3 +13,8 @@ export const detailsPage = {
       .click();
   },
 };
+
+export namespace DetailsPageSelector {
+  export const name = 'dd[data-test-selector="details-item-value__Name"]';
+  export const namespace = 'dd[data-test-selector="details-item-value__Namespace"] a';
+}

frontend/packages/integration-tests-cypress/views/storage/snapshot.ts

@@ -1,6 +1,4 @@
 export namespace SnapshotDetails {
-  export const name = '[data-test-selector="details-item-value__Name"]';
-  export const namespace = '[data-test-selector="details-item-value__Namespace"] a';
   export const pvc = '[data-test="details-item-value__PVC"] a';
   export const vsc = '[data-test="details-item-value__VSC"] a';
   export const sc = '[data-test="details-item-value__SC"] a';

frontend/public/components/utils/request-size-input.tsx

@@ -19,7 +19,7 @@ export class RequestSizeInput extends React.Component<RequestSizeInputProps> {
   };
 
   render() {
-    const { describedBy, name, inputID } = this.props;
+    const { describedBy, name, inputID, testId } = this.props;
     const inputName = `${name}Value`;
     const dropdownName = `${name}Unit`;
     return (
@@ -34,6 +34,7 @@ export class RequestSizeInput extends React.Component<RequestSizeInputProps> {
             aria-describedby={describedBy}
             name={inputName}
             id={inputID}
+            data-test={testId}
             required={this.props.required}
             value={this.props.defaultRequestSizeValue}
             min={this.props.minValue}
@@ -67,4 +68,5 @@ export type RequestSizeInputProps = {
   minValue?: number;
   inputClassName?: string;
   inputID?: string;
+  testId?: string;
 };