From 60644cbcc69e721014d6a2c9bcb52911ba035ee7 Mon Sep 17 00:00:00 2001 From: Martin Stamm Date: Tue, 22 Mar 2022 16:15:26 +0100 Subject: [PATCH] feat(element-templates): open custom groups --- .../properties/CustomProperties.js | 3 +- .../properties/CustomProperties.js | 3 +- .../properties/CustomProperties.spec.js | 54 +++++++++++++++++++ .../properties/CustomProperties.spec.js | 54 +++++++++++++++++++ 4 files changed, 112 insertions(+), 2 deletions(-) diff --git a/src/provider/cloud-element-templates/properties/CustomProperties.js b/src/provider/cloud-element-templates/properties/CustomProperties.js index 47b41f767..ee670d124 100644 --- a/src/provider/cloud-element-templates/properties/CustomProperties.js +++ b/src/provider/cloud-element-templates/properties/CustomProperties.js @@ -122,7 +122,8 @@ function addCustomGroup(groups, props) { id, label, component: Group, - entries: [] + entries: [], + shouldOpen: true }; properties.forEach((property, index) => { diff --git a/src/provider/element-templates/properties/CustomProperties.js b/src/provider/element-templates/properties/CustomProperties.js index abf64104e..f67d996cb 100644 --- a/src/provider/element-templates/properties/CustomProperties.js +++ b/src/provider/element-templates/properties/CustomProperties.js @@ -161,7 +161,8 @@ function addCustomGroup(groups, props) { id, label, component: Group, - entries: [] + entries: [], + shouldOpen: true }; properties.forEach((property, index) => { diff --git a/test/spec/provider/cloud-element-templates/properties/CustomProperties.spec.js b/test/spec/provider/cloud-element-templates/properties/CustomProperties.spec.js index 06e15071b..5f7add8d9 100644 --- a/test/spec/provider/cloud-element-templates/properties/CustomProperties.spec.js +++ b/test/spec/provider/cloud-element-templates/properties/CustomProperties.spec.js @@ -16,6 +16,7 @@ import { } from 'min-dash'; import { + classes as domClasses, query as domQuery, queryAll as domQueryAll } from 'min-dom'; @@ -1043,6 +1044,27 @@ describe('provider/cloud-element-templates - CustomProperties', function() { }); + it('should open custom groups', async function() { + + // given + await expectSelected('ServiceTask_1'); + + // when + var customGroups = [ + getGroupById('ElementTemplates__CustomProperties-headers', container), + getGroupById('ElementTemplates__CustomProperties-payload', container), + getGroupById('ElementTemplates__CustomProperties-mapping', container), + getGroupById('ElementTemplates__CustomProperties', container) + ]; + + // then + customGroups.forEach(function(group) { + expectGroupOpen(group, true); + }); + + }); + + it('should display in defined properties order', async function() { // given @@ -1091,6 +1113,22 @@ describe('provider/cloud-element-templates - CustomProperties', function() { }); + it('should open default group', async function() { + + // given + await expectSelected('ServiceTask_noGroups'); + + // when + var tempalteGroup = getGroupById('ElementTemplates__Template', container); + var customPropertiesGroup = getGroupById('ElementTemplates__CustomProperties', container); + + + // then + expectGroupOpen(tempalteGroup, false); + expectGroupOpen(customPropertiesGroup, true); + }); + + it('should not create default group', async function() { // given @@ -1265,6 +1303,13 @@ function expectError(entry, message) { expect(error).to.equal(message); } +function expectGroupOpen(group, open) { + + const entries = domQuery('.bio-properties-panel-group-entries', group); + + expect(domClasses(entries).contains('open')).to.eql(open); +} + function expectValid(entry) { expectError(entry, null); } @@ -1285,6 +1330,15 @@ function getGroup(entry) { return parent && withoutPrefix(parent.dataset.groupId); } +function getGroupById(id, container) { + const group = domQuery( + `[data-group-id=group-${id}]`, + container + ); + + return group; +} + function withoutPrefix(groupId) { return groupId.slice(6); } diff --git a/test/spec/provider/element-templates/properties/CustomProperties.spec.js b/test/spec/provider/element-templates/properties/CustomProperties.spec.js index ce6fd834e..e88f1c6f7 100644 --- a/test/spec/provider/element-templates/properties/CustomProperties.spec.js +++ b/test/spec/provider/element-templates/properties/CustomProperties.spec.js @@ -16,6 +16,7 @@ import { } from 'min-dash'; import { + classes as domClasses, query as domQuery, queryAll as domQueryAll } from 'min-dom'; @@ -1762,6 +1763,27 @@ describe('provider/element-templates - CustomProperties', function() { }); + it('should open defined groups', async function() { + + // given + await expectSelected('ServiceTask_1'); + + // when + var customGroups = [ + getGroupById('ElementTemplates__CustomProperties-one', container), + getGroupById('ElementTemplates__CustomProperties-two', container), + getGroupById('ElementTemplates__CustomProperties-three', container), + getGroupById('ElementTemplates__CustomProperties', container) + ]; + + // then + customGroups.forEach(function(group) { + expectGroupOpen(group, true); + }); + + }); + + it('should display in defined properties order', async function() { // given @@ -1810,6 +1832,22 @@ describe('provider/element-templates - CustomProperties', function() { }); + it('should open default group', async function() { + + // given + await expectSelected('ServiceTask_noGroups'); + + // when + var tempalteGroup = getGroupById('ElementTemplates__Template', container); + var customPropertiesGroup = getGroupById('ElementTemplates__CustomProperties', container); + + + // then + expectGroupOpen(tempalteGroup, false); + expectGroupOpen(customPropertiesGroup, true); + }); + + it('should not create default group', async function() { // given @@ -1896,6 +1934,13 @@ function expectValid(entry) { expectError(entry, null); } +function expectGroupOpen(group, open) { + + const entries = domQuery('.bio-properties-panel-group-entries', group); + + expect(domClasses(entries).contains('open')).to.eql(open); +} + function findEntry(id, container) { return domQuery(`[data-entry-id='${ id }']`, container); } @@ -1912,6 +1957,15 @@ function findTextarea(container) { return domQuery('textarea', container); } +function getGroupById(id, container) { + const group = domQuery( + `[data-group-id=group-${id}]`, + container + ); + + return group; +} + function getGroupIds(container) { if (!container) { throw new Error('container is missing');