16439: Adds e2e tests for creating collections & projects.

Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas@di-pentima.com.ar>

diff --git a/cypress/integration/side-panel.spec.js b/cypress/integration/side-panel.spec.js
index 95b564007cbc656af5f8787801575038cb60b463..40f39144ec82e67af3873685e84478bf6d144ed4 100644 (file)
--- a/cypress/integration/side-panel.spec.js
+++ b/cypress/integration/side-panel.spec.js
@@ -75,4 +75,68 @@ describe('Side panel tests', function() {
                 .and('be.disabled');
         })
     })
+
+    it('creates new collection on home project', function() {
+        cy.loginAs(activeUser);
+        cy.visit(`/projects/${activeUser.user.uuid}`);
+        cy.get('[data-cy=breadcrumb-first]').should('contain', 'Projects');
+        cy.get('[data-cy=breadcrumb-last]').should('not.exist');
+        // Create new collection
+        cy.get('[data-cy=side-panel-button]').click();
+        cy.get('[data-cy=side-panel-new-collection]').click();
+        const collName = `Test collection (${Math.floor(999999 * Math.random())})`;
+        cy.get('[data-cy=form-dialog]')
+            .should('contain', 'New collection')
+            .within(() => {
+                cy.get('[data-cy=parent-field]').within(() => {
+                    cy.get('input').should('have.value', 'Home project');
+                })
+                cy.get('[data-cy=name-field]').within(() => {
+                    cy.get('input').type(collName);
+                })
+            })
+        cy.get('[data-cy=form-submit-btn]').click();
+        // Confirm that the user was taken to the newly created thing
+        cy.get('[data-cy=form-dialog]').should('not.exist');
+        cy.get('[data-cy=breadcrumb-first]').should('contain', 'Projects');
+        cy.get('[data-cy=breadcrumb-last]').should('contain', collName);
+    })
+
+    it('creates new project on home project and then a subproject inside it', function() {
+        const createProject = function(name, parentName) {
+            cy.get('[data-cy=side-panel-button]').click();
+            cy.get('[data-cy=side-panel-new-project]').click();
+            cy.get('[data-cy=form-dialog]')
+                .should('contain', 'New project')
+                .within(() => {
+                    cy.get('[data-cy=parent-field]').within(() => {
+                        cy.get('input').invoke('val').then((val) => {
+                            expect(val).to.include(parentName);
+                        })
+                    })
+                    cy.get('[data-cy=name-field]').within(() => {
+                        cy.get('input').type(name);
+                    })
+                })
+            cy.get('[data-cy=form-submit-btn]').click();
+        }
+
+        cy.loginAs(activeUser);
+        cy.visit(`/projects/${activeUser.user.uuid}`);
+        cy.get('[data-cy=breadcrumb-first]').should('contain', 'Projects');
+        cy.get('[data-cy=breadcrumb-last]').should('not.exist');
+        // Create new project
+        const projName = `Test project (${Math.floor(999999 * Math.random())})`;
+        createProject(projName, 'Home project');
+        // Confirm that the user was taken to the newly created thing
+        cy.get('[data-cy=form-dialog]').should('not.exist');
+        cy.get('[data-cy=breadcrumb-first]').should('contain', 'Projects');
+        cy.get('[data-cy=breadcrumb-last]').should('contain', projName);
+        // Create a subproject
+        const subProjName = `Test project (${Math.floor(999999 * Math.random())})`;
+        createProject(subProjName, projName);
+        cy.get('[data-cy=form-dialog]').should('not.exist');
+        cy.get('[data-cy=breadcrumb-first]').should('contain', 'Projects');
+        cy.get('[data-cy=breadcrumb-last]').should('contain', subProjName);
+    })
 })
\ No newline at end of file

diff --git a/src/components/form-dialog/form-dialog.tsx b/src/components/form-dialog/form-dialog.tsx
index 3df874b7a3921e473a7c12b6d9ffe8f06bf9bc1e..b37ec68dfb8096fa07187344e5e141121c664fc4 100644 (file)
--- a/src/components/form-dialog/form-dialog.tsx
+++ b/src/components/form-dialog/form-dialog.tsx
@@ -54,7 +54,7 @@ export const FormDialog = withStyles(styles)((props: DialogProjectProps) =>
         disableEscapeKeyDown={props.submitting}
         fullWidth
         maxWidth='md'>
-        <form>
+        <form data-cy='form-dialog'>
             <DialogTitle className={props.classes.dialogTitle}>
                 {props.dialogTitle}
             </DialogTitle>
@@ -70,6 +70,7 @@ export const FormDialog = withStyles(styles)((props: DialogProjectProps) =>
                     {props.cancelLabel || 'Cancel'}
                 </Button>
                 <Button
+                    data-cy='form-submit-btn'
                     type="submit"
                     onClick={props.handleSubmit}
                     className={props.classes.lastButton}

diff --git a/src/views-components/form-fields/collection-form-fields.tsx b/src/views-components/form-fields/collection-form-fields.tsx
index b3a3c224dbb097023906cdef0eac14df34da366a..623cb31782dee17aea8a3e44e707729d525fdc60 100644 (file)
--- a/src/views-components/form-fields/collection-form-fields.tsx
+++ b/src/views-components/form-fields/collection-form-fields.tsx
@@ -27,12 +27,12 @@ export const CollectionNameField = connect(
                 COLLECTION_NAME_VALIDATION : COLLECTION_NAME_VALIDATION_ALLOW_SLASH)
         };
     })((props: CollectionNameFieldProps) =>
-        <Field
+        <span data-cy='name-field'><Field
             name='name'
             component={TextField}
             validate={props.validate}
             label="Collection Name"
-            autoFocus={true} />
+            autoFocus={true} /></span>
     );
 
 export const CollectionDescriptionField = () =>

diff --git a/src/views-components/form-fields/project-form-fields.tsx b/src/views-components/form-fields/project-form-fields.tsx
index 64386ea050f636d9eadddab6b8022e50842d2429..dc1e1612aaa92112f9fa4a4f8d4cb7672358c7be 100644 (file)
--- a/src/views-components/form-fields/project-form-fields.tsx
+++ b/src/views-components/form-fields/project-form-fields.tsx
@@ -28,12 +28,12 @@ export const ProjectNameField = connect(
                 PROJECT_NAME_VALIDATION : PROJECT_NAME_VALIDATION_ALLOW_SLASH)
         };
     })((props: ProjectNameFieldProps) =>
-        <Field
+        <span data-cy='name-field'><Field
             name='name'
             component={TextField}
             validate={props.validate}
             label="Project Name"
-            autoFocus={true} />
+            autoFocus={true} /></span>
     );
 
 export const ProjectDescriptionField = () =>

diff --git a/src/views-components/form-fields/resource-form-fields.tsx b/src/views-components/form-fields/resource-form-fields.tsx
index 0c4ae64a4ad0a5dfcfa6ed00384a9d63cb6d2e93..343831bf81ef41044f0778b9a55fae839059f820 100644 (file)
--- a/src/views-components/form-fields/resource-form-fields.tsx
+++ b/src/views-components/form-fields/resource-form-fields.tsx
@@ -24,7 +24,7 @@ export const ResourceParentField = connect(
         };
     })
     ((props: ResourceParentFieldProps) =>
-        <Field
+        <span data-cy='parent-field'><Field
             name='ownerUuid'
             disabled={true}
             label='Parent project'
@@ -40,5 +40,5 @@ export const ResourceParentField = connect(
                     return value;
                 }
             }
-            component={TextField} />
+            component={TextField} /></span>
     );