18219: Fixes collection edit dialog. Adds test.

Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas.dipentima@curii.com>

diff --git a/cypress/integration/collection.spec.js b/cypress/integration/collection.spec.js
index c509bfbf9da4b35a32c15e35f24a542873f7c667..ce711be9e9afa3fa85265d7fbe443c3ead5fca9d 100644 (file)
--- a/cypress/integration/collection.spec.js
+++ b/cypress/integration/collection.spec.js
@@ -75,7 +75,52 @@ describe('Collection panel tests', function () {
         });
     });
 
         });
     });
 

-    it('uses the property editor with vocabulary terms', function () {
+    it('uses the property editor (from edit dialog) with vocabulary terms', function () {
+        cy.createCollection(adminUser.token, {
+            name: `Test collection ${Math.floor(Math.random() * 999999)}`,
+            owner_uuid: activeUser.user.uuid,
+            manifest_text: ". 37b51d194a7513e45b56f6524f2d51f2+3 0:3:bar\n"
+        })
+            .as('testCollection').then(function () {
+                cy.loginAs(activeUser);
+                cy.goToPath(`/collections/${this.testCollection.uuid}`);
+
+                cy.get('[data-cy=collection-info-panel')
+                    .should('contain', this.testCollection.name)
+                    .and('not.contain', 'Color: Magenta');
+
+                cy.get('[data-cy=collection-panel-options-btn]').click();
+                cy.get('[data-cy=context-menu]').contains('Edit collection').click();
+                cy.get('[data-cy=form-dialog]').should('contain', 'Properties');
+
+                // Key: Color (IDTAGCOLORS) - Value: Magenta (IDVALCOLORS3)
+                cy.get('[data-cy=resource-properties-form]').within(() => {
+                    cy.get('[data-cy=property-field-key]').within(() => {
+                        cy.get('input').type('Color');
+                    });
+                    cy.get('[data-cy=property-field-value]').within(() => {
+                        cy.get('input').type('Magenta');
+                    });
+                    cy.root().submit();
+                });
+                // Confirm proper vocabulary labels are displayed on the UI.
+                cy.get('[data-cy=form-dialog]').should('contain', 'Color: Magenta');
+                cy.get('[data-cy=form-dialog]').contains('Save').click();
+                cy.get('[data-cy=form-dialog]').should('not.exist');
+                // Confirm proper vocabulary IDs were saved on the backend.
+                cy.doRequest('GET', `/arvados/v1/collections/${this.testCollection.uuid}`)
+                    .its('body').as('collection')
+                    .then(function () {
+                        expect(this.collection.properties.IDTAGCOLORS).to.equal('IDVALCOLORS3');
+                    });
+                // Confirm the property is displayed on the UI.
+                cy.get('[data-cy=collection-info-panel')
+                    .should('contain', this.testCollection.name)
+                    .and('contain', 'Color: Magenta');
+            });
+    });
+
+    it('uses the property editor (from details panel) with vocabulary terms', function () {

         cy.createCollection(adminUser.token, {
             name: `Test collection ${Math.floor(Math.random() * 999999)}`,
             owner_uuid: activeUser.user.uuid,
         cy.createCollection(adminUser.token, {
             name: `Test collection ${Math.floor(Math.random() * 999999)}`,
             owner_uuid: activeUser.user.uuid,

diff --git a/src/store/collections/collection-update-actions.ts b/src/store/collections/collection-update-actions.ts
index 2caaf88a23db6de2ae8552c75cc7889d10790576..82418d27abe75b8bbeef49b07132151ef52187bb 100644 (file)
--- a/src/store/collections/collection-update-actions.ts
+++ b/src/store/collections/collection-update-actions.ts
@@ -32,7 +32,7 @@ export interface CollectionUpdateFormDialogData {
 }
 
 export const COLLECTION_UPDATE_FORM_NAME = 'collectionUpdateFormName';
 }
 
 export const COLLECTION_UPDATE_FORM_NAME = 'collectionUpdateFormName';

-export const COLLECTION_UPDATE_PROPERTIES_FORM_NAME = "collectionCreatePropertiesFormName";
+export const COLLECTION_UPDATE_PROPERTIES_FORM_NAME = "collectionUpdatePropertiesFormName";

 export const COLLECTION_UPDATE_FORM_SELECTOR = formValueSelector(COLLECTION_UPDATE_FORM_NAME);
 
 export const openCollectionUpdateDialog = (resource: CollectionUpdateFormDialogData) =>
 export const COLLECTION_UPDATE_FORM_SELECTOR = formValueSelector(COLLECTION_UPDATE_FORM_NAME);
 
 export const openCollectionUpdateDialog = (resource: CollectionUpdateFormDialogData) =>

diff --git a/src/views-components/collection-properties/update-collection-properties-form.tsx b/src/views-components/collection-properties/update-collection-properties-form.tsx
index 13a29ad4b679a9561af978fe01bb947770cb335c..940e318c3f8a808a970f888175a9498e64460d18 100644 (file)
--- a/src/views-components/collection-properties/update-collection-properties-form.tsx
+++ b/src/views-components/collection-properties/update-collection-properties-form.tsx
@@ -5,6 +5,7 @@
 import { reduxForm, reset } from 'redux-form';
 import { withStyles } from '@material-ui/core';
 import {
 import { reduxForm, reset } from 'redux-form';
 import { withStyles } from '@material-ui/core';
 import {

+    COLLECTION_UPDATE_FORM_NAME,

     COLLECTION_UPDATE_PROPERTIES_FORM_NAME
 } from 'store/collections/collection-update-actions';
 import {
     COLLECTION_UPDATE_PROPERTIES_FORM_NAME
 } from 'store/collections/collection-update-actions';
 import {


@@ -26,7 +27,7 @@ const Form = withStyles(
 export const UpdateCollectionPropertiesForm = reduxForm<ResourcePropertiesFormData>({
     form: COLLECTION_UPDATE_PROPERTIES_FORM_NAME,
     onSubmit: (data, dispatch) => {
 export const UpdateCollectionPropertiesForm = reduxForm<ResourcePropertiesFormData>({
     form: COLLECTION_UPDATE_PROPERTIES_FORM_NAME,
     onSubmit: (data, dispatch) => {

-        dispatch(addPropertyToResourceForm(data, COLLECTION_UPDATE_PROPERTIES_FORM_NAME));
+        dispatch(addPropertyToResourceForm(data, COLLECTION_UPDATE_FORM_NAME));

         dispatch(reset(COLLECTION_UPDATE_PROPERTIES_FORM_NAME));
     }
 })(Form);
\ No newline at end of file
         dispatch(reset(COLLECTION_UPDATE_PROPERTIES_FORM_NAME));
     }
 })(Form);
\ No newline at end of file