[ARVADOS-WORKBENCH2] updated: 2.3.0-5-gc4cc8cb0
Git user
git at public.arvados.org
Wed Nov 10 23:28:55 UTC 2021
Summary of changes:
cypress/integration/collection.spec.js | 27 ++++++++++++++++++++--
src/models/vocabulary.ts | 4 ++--
.../property-key-field.tsx | 11 +++++++--
.../property-value-field.tsx | 11 +++++++--
4 files changed, 45 insertions(+), 8 deletions(-)
via c4cc8cb078eeed7aba167f5263d65bae3bf6e115 (commit)
from fc4b2b280ad3e9f332844116a4c9e57eb843def0 (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit c4cc8cb078eeed7aba167f5263d65bae3bf6e115
Author: Lucas Di Pentima <lucas.dipentima at curii.com>
Date: Wed Nov 10 20:27:17 2021 -0300
17944: Adds property key/value auto-selection when changing focus.
Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas.dipentima at curii.com>
diff --git a/cypress/integration/collection.spec.js b/cypress/integration/collection.spec.js
index fb126af6..3e06d7e5 100644
--- a/cypress/integration/collection.spec.js
+++ b/cypress/integration/collection.spec.js
@@ -97,14 +97,37 @@ describe('Collection panel tests', function () {
});
// Confirm proper vocabulary labels are displayed on the UI.
cy.get('[data-cy=collection-properties-panel]')
- .should('contain', 'Color')
- .and('contain', 'Magenta');
+ .should('contain', 'Color: Magenta');
// 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');
});
+
+ // Case-insensitive on-blur auto-selection test
+ // Key: Size (IDTAGSIZES) - Value: Small (IDVALSIZES2)
+ cy.get('[data-cy=resource-properties-form]').within(() => {
+ cy.get('[data-cy=property-field-key]').within(() => {
+ cy.get('input').type('sIzE');
+ });
+ cy.get('[data-cy=property-field-value]').within(() => {
+ cy.get('input').type('sMaLL');
+ });
+ // Cannot "type()" TAB on Cypress so let's click another field
+ // to trigger the onBlur event.
+ cy.get('[data-cy=property-field-key]').click();
+ cy.root().submit();
+ });
+ // Confirm proper vocabulary labels are displayed on the UI.
+ cy.get('[data-cy=collection-properties-panel]')
+ .should('contain', 'Size: S');
+ // 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.IDTAGSIZES).to.equal('IDVALSIZES2');
+ });
});
});
diff --git a/src/models/vocabulary.ts b/src/models/vocabulary.ts
index 03f28c07..3c542844 100644
--- a/src/models/vocabulary.ts
+++ b/src/models/vocabulary.ts
@@ -47,7 +47,7 @@ export const getTagValueID = (tagKeyID:string, tagValueLabel:string, vocabulary:
(tagKeyID && vocabulary.tags[tagKeyID] && vocabulary.tags[tagKeyID].values)
? Object.keys(vocabulary.tags[tagKeyID].values!).find(
k => vocabulary.tags[tagKeyID].values![k].labels.find(
- l => l.label === tagValueLabel) !== undefined) || ''
+ l => l.label.toLowerCase() === tagValueLabel.toLowerCase()) !== undefined) || ''
: '';
export const getTagValueLabel = (tagKeyID:string, tagValueID:string, vocabulary: Vocabulary) =>
@@ -94,7 +94,7 @@ export const getTags = ({ tags }: Vocabulary) => {
export const getTagKeyID = (tagKeyLabel:string, vocabulary: Vocabulary) =>
Object.keys(vocabulary.tags).find(
k => vocabulary.tags[k].labels.find(
- l => l.label === tagKeyLabel) !== undefined
+ l => l.label.toLowerCase() === tagKeyLabel.toLowerCase()) !== undefined
) || '';
export const getTagKeyLabel = (tagKeyID:string, vocabulary: Vocabulary) =>
diff --git a/src/views-components/resource-properties-form/property-key-field.tsx b/src/views-components/resource-properties-form/property-key-field.tsx
index 029d44cc..791949f5 100644
--- a/src/views-components/resource-properties-form/property-key-field.tsx
+++ b/src/views-components/resource-properties-form/property-key-field.tsx
@@ -6,7 +6,7 @@ import React from 'react';
import { WrappedFieldProps, Field, FormName, reset, change, WrappedFieldInputProps, WrappedFieldMetaProps } from 'redux-form';
import { memoize } from 'lodash';
import { Autocomplete } from 'components/autocomplete/autocomplete';
-import { Vocabulary, getTags, getTagKeyID } from 'models/vocabulary';
+import { Vocabulary, getTags, getTagKeyID, getTagKeyLabel } from 'models/vocabulary';
import {
handleSelect,
handleBlur,
@@ -39,7 +39,14 @@ const PropertyKeyInput = ({ vocabulary, ...props }: WrappedFieldProps & Vocabula
label='Key'
suggestions={getSuggestions(props.input.value, vocabulary)}
onSelect={handleSelect(PROPERTY_KEY_FIELD_ID, data.form, props.input, props.meta)}
- onBlur={handleBlur(PROPERTY_KEY_FIELD_ID, data.form, props.meta, props.input, getTagKeyID(props.input.value, vocabulary))}
+ onBlur={() => {
+ // Case-insensitive search for the key in the vocabulary
+ const foundKeyID = getTagKeyID(props.input.value, vocabulary);
+ if (foundKeyID !== '') {
+ props.input.value = getTagKeyLabel(foundKeyID, vocabulary);
+ }
+ handleBlur(PROPERTY_KEY_FIELD_ID, data.form, props.meta, props.input, foundKeyID)();
+ }}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
const newValue = e.currentTarget.value;
handleChange(data.form, props.input, props.meta, newValue);
diff --git a/src/views-components/resource-properties-form/property-value-field.tsx b/src/views-components/resource-properties-form/property-value-field.tsx
index a2b53b3c..b023e412 100644
--- a/src/views-components/resource-properties-form/property-value-field.tsx
+++ b/src/views-components/resource-properties-form/property-value-field.tsx
@@ -6,7 +6,7 @@ import React from 'react';
import { WrappedFieldProps, Field, formValues, FormName, WrappedFieldInputProps, WrappedFieldMetaProps, change } from 'redux-form';
import { compose } from 'redux';
import { Autocomplete } from 'components/autocomplete/autocomplete';
-import { Vocabulary, isStrictTag, getTagValues, getTagValueID } from 'models/vocabulary';
+import { Vocabulary, isStrictTag, getTagValues, getTagValueID, getTagValueLabel } from 'models/vocabulary';
import { PROPERTY_KEY_FIELD_ID, PROPERTY_KEY_FIELD_NAME } from 'views-components/resource-properties-form/property-key-field';
import {
handleSelect,
@@ -60,7 +60,14 @@ const PropertyValueInput = ({ vocabulary, propertyKeyId, propertyKeyName, ...pro
disabled={props.disabled}
suggestions={getSuggestions(props.input.value, propertyKeyId, vocabulary)}
onSelect={handleSelect(PROPERTY_VALUE_FIELD_ID, data.form, props.input, props.meta)}
- onBlur={handleBlur(PROPERTY_VALUE_FIELD_ID, data.form, props.meta, props.input, getTagValueID(propertyKeyId, props.input.value, vocabulary))}
+ onBlur={() => {
+ // Case-insensitive search for the value in the vocabulary
+ const foundValueID = getTagValueID(propertyKeyId, props.input.value, vocabulary);
+ if (foundValueID !== '') {
+ props.input.value = getTagValueLabel(propertyKeyId, foundValueID, vocabulary);
+ }
+ handleBlur(PROPERTY_VALUE_FIELD_ID, data.form, props.meta, props.input, foundValueID)();
+ }}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
const newValue = e.currentTarget.value;
const tagValueID = getTagValueID(propertyKeyId, newValue, vocabulary);
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list