Repository: ProcessMaker/modeler (js)

Issue:
Use the 0.4.6 version of processmaker-bpmn-moddle
Upgrade the version of processmaker-bpmn-moddle to the latest one that currently is 0.4.6

Pull request:
Use the 0.4.6 version of processmaker-bpmn-moddle 
Resolves #904 

Needs this PR from  processmaker-bpmn-moddle:

https://github.com/ProcessMaker/processmaker-bpmn-moddle/pull/31



Patch:
diff --git a/package-lock.json b/package-lock.json
index 22a457be..81c6c9ab 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3532,9 +3532,9 @@
       }
     },
     "@processmaker/processmaker-bpmn-moddle": {
-      "version": "0.4.5",
-      "resolved": "https://registry.npmjs.org/@processmaker/processmaker-bpmn-moddle/-/processmaker-bpmn-moddle-0.4.5.tgz",
-      "integrity": "sha512-IijNvUpsA9BPGLGKHN+grcCaN4QVG06S2aVM8Otz22FmtIuuyDpgKyTvzQ1di70INPs6KWbkjagXyHcwj2Ct9Q==",
+      "version": "0.4.6",
+      "resolved": "https://registry.npmjs.org/@processmaker/processmaker-bpmn-moddle/-/processmaker-bpmn-moddle-0.4.6.tgz",
+      "integrity": "sha512-VSd90lwiD8E7LeDsx5WUefVC0vDv8Ua2Yl6Fm9bvzQghfYcY24J4ZiIJBZU48cgv6IrlBcuc8Wi5AhgyQ9pIww==",
       "dev": true,
       "requires": {
         "min-dash": "^3.0.0"
@@ -10682,13 +10682,15 @@
           "version": "1.0.0",
           "resolved": false,
           "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "resolved": false,
           "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
           "dev": true,
+          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -10705,19 +10707,22 @@
           "version": "1.1.0",
           "resolved": false,
           "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "concat-map": {
           "version": "0.0.1",
           "resolved": false,
           "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "resolved": false,
           "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -10848,7 +10853,8 @@
           "version": "2.0.3",
           "resolved": false,
           "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.5",
@@ -10862,6 +10868,7 @@
           "resolved": false,
           "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
           "dev": true,
+          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -10878,6 +10885,7 @@
           "resolved": false,
           "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
           "dev": true,
+          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -10886,13 +10894,15 @@
           "version": "0.0.8",
           "resolved": false,
           "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "minipass": {
           "version": "2.3.5",
           "resolved": false,
           "integrity": "sha512-Gi1W4k059gyRbyVUZQ4mEqLm0YIUiGYfvxhF6SIlk3ui1WVxMTGfGdQ2SInh3PDrRTVvPKgULkpJtT4RH10+VA==",
           "dev": true,
+          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -10913,6 +10923,7 @@
           "resolved": false,
           "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
           "dev": true,
+          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -11001,7 +11012,8 @@
           "version": "1.0.1",
           "resolved": false,
           "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -11015,6 +11027,7 @@
           "resolved": false,
           "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
           "dev": true,
+          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -11152,6 +11165,7 @@
           "resolved": false,
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
           "dev": true,
+          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -19175,7 +19189,7 @@
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "resolved": "http://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
           "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
           "dev": true,
           "requires": {
diff --git a/package.json b/package.json
index fb2833cd..86cda9c6 100644
--- a/package.json
+++ b/package.json
@@ -59,7 +59,7 @@
   "devDependencies": {
     "@cypress/code-coverage": "^1.10.1",
     "@panter/vue-i18next": "^0.15.1",
-    "@processmaker/processmaker-bpmn-moddle": "0.4.5",
+    "@processmaker/processmaker-bpmn-moddle": "0.4.6",
     "@processmaker/screen-builder": "0.20.7",
     "@processmaker/vue-form-elements": "0.12.4",
     "@vue/cli-plugin-babel": "^4.0.5",
diff --git a/src/components/InspectorExtensionManager.js b/src/components/InspectorExtensionManager.js
index ccff948b..637cddf8 100644
--- a/src/components/InspectorExtensionManager.js
+++ b/src/components/InspectorExtensionManager.js
@@ -1,16 +1,15 @@
 export default function registerInspectorExtension(node, config) {
   const inspectorItems = getInspectorItems(node, config);
   addInspectorItem(inspectorItems, config);
-  inspectorItems.sort(moveAdvancedAccordionToBottom);
+  node.inspectorConfig[0].items.sort(moveAdvancedAccordionToBottom);
 }
 
-function moveAdvancedAccordionToBottom(inspectorItemA, inspectorItemB) {
-  const isAdvancedAccordion = (inspectorItem) => inspectorItem.label === 'Advanced';
-  if (isAdvancedAccordion(inspectorItemA)) {
+function moveAdvancedAccordionToBottom(accordionA, accordionB) {
+  if (isAdvancedAccordion(accordionA)) {
     return 1;
   }
 
-  if (isAdvancedAccordion(inspectorItemB)) {
+  if (isAdvancedAccordion(accordionB)) {
     return -1;
   }
 
@@ -34,3 +33,7 @@ function getInspectorItems(node, config) {
   }
   return node.inspectorConfig[0].items[0].items;
 }
+
+function isAdvancedAccordion(accordion) {
+  return accordion.config && accordion.config.label === 'Advanced';
+}
diff --git a/src/components/controls.vue b/src/components/controls.vue
index 04ef26e5..313e488a 100644
--- a/src/components/controls.vue
+++ b/src/components/controls.vue
@@ -106,6 +106,8 @@ export default {
 </script>
 
 <style lang="scss">
+$border-color: rgba(0, 0, 0, 0.125);
+
 .card-header {
   background: #f7f7f7;
 }
@@ -114,6 +116,14 @@ export default {
   border-top: 0;
 }
 
+.controls-column {
+  .list-group {
+    &:last-child {
+      border-bottom: 1px solid $border-color;
+    }
+  }
+}
+
 .tool {
   cursor: grab;
   user-select: none;
diff --git a/src/components/crownButton.vue b/src/components/crownButton.vue
index 4248e2e5..4ea819f3 100644
--- a/src/components/crownButton.vue
+++ b/src/components/crownButton.vue
@@ -40,7 +40,7 @@ export default {
   padding: 0;
   margin-top: 0;
 }
-img {
+img, i {
   margin: 5px 10px;
   font-size: 1rem;
 }
diff --git a/src/components/crownDropdown.vue b/src/components/crownDropdown.vue
index be9ee228..ae4da531 100644
--- a/src/components/crownDropdown.vue
+++ b/src/components/crownDropdown.vue
@@ -1,8 +1,13 @@
 <template>
   <div class="cog-container" v-if="showDropdown" role="menuitem">
-    <button class="cog-container--button" @click="dropdownOpen = !dropdownOpen">
-      <i class="fas fa-cog" />
-    </button>
+    <crown-button
+      id="dropdown-button"
+      aria-label="Select a type"
+      v-on="$listeners"
+      @click="dropdownOpen = !dropdownOpen"
+    >
+      <i class="fas fa-cog cog-container--button" />
+    </crown-button>
 
     <ul class="element-list" v-if="dropdownOpen" role="list">
       <li class="element-list--item" role="listitem" v-for="{label, nodeType, dataTest} in dropdownData" :key="nodeType">
@@ -18,8 +23,11 @@
   </div>
 </template>
 <script>
+import CrownButton from '@/components/crownButton';
+
 export default {
   name: 'CrownDropdown',
+  components: { CrownButton },
   props: {
     dropdownData: Array,
     node: Object,
@@ -40,7 +48,7 @@ $primary-color: #5096db;
 $primary-light: #fff;
 
 $element-list-top: 2.5rem;
-$element-list-left: -0.65rem;
+$element-list-left: 0;
 $element-list-top-chevron: -0.2rem;
 $element-list-left-chevron: 0.5rem;
 $crown-top-chevron: 0.8rem;
@@ -70,8 +78,6 @@ $chevron-height: 1.25rem;
     background: none;
     border: none;
     color: $primary-light;
-    padding: 0;
-    position: relative;
   }
 }
 


Test patch:
diff --git a/src/setup/extensions/testTaskInspectorExtension.js b/src/setup/extensions/testTaskInspectorExtension.js
index bff5f459..1612520d 100644
--- a/src/setup/extensions/testTaskInspectorExtension.js
+++ b/src/setup/extensions/testTaskInspectorExtension.js
@@ -1,6 +1,4 @@
-import {
-  task,
-} from '@/components/nodes';
+import { task } from '@/components/nodes';
 
 window.ProcessMaker.EventBus.$on('modeler-init', ({ registerInspectorExtension }) => {
 
@@ -17,6 +15,7 @@ window.ProcessMaker.EventBus.$on('modeler-init', ({ registerInspectorExtension }
       validation: 'numeric|min:1',
     },
   });
+
   registerInspectorExtension(task, {
     id: 'pm-assigned-users',
     component: 'FormSelect',
@@ -32,4 +31,25 @@ window.ProcessMaker.EventBus.$on('modeler-init', ({ registerInspectorExtension }
       ],
     },
   });
+
+  registerInspectorExtension(task, {
+    component: 'FormAccordion',
+    container: true,
+    config: {
+      initiallyOpen: false,
+      label: 'Assignment Rules',
+      icon: 'users',
+      name: 'assignmentRules',
+    },
+    items: [
+      {
+        component: 'FormInput',
+        config: {
+          label: 'Task Assignment',
+          helper: '',
+          name: 'taskAssignment',
+        },
+      },
+    ],
+  });
 });
diff --git a/tests/unit/inspectorExtensionManager.spec.js b/tests/unit/inspectorExtensionManager.spec.js
index 93f50c51..8053d308 100644
--- a/tests/unit/inspectorExtensionManager.spec.js
+++ b/tests/unit/inspectorExtensionManager.spec.js
@@ -17,32 +17,31 @@ describe('Inspector Extension Manager', function() {
         ],
       }],
     };
+
     config = {
       id: 5,
       container: true,
       name: 'inspector-accordion',
-      label: 'Advanced',
+      config: {
+        label: 'Advanced',
+      },
     };
   });
 
   it('should always sort the advanced accordion to the end when the config is a container', function() {
     registerInspectorExtension(node, config);
+    registerInspectorExtension(node, {
+      id: 'no-advanced-accordion',
+      container: true,
+      config: {
+        label: 'Non-advanced',
+      },
+    });
 
     const [lastItem] = node.inspectorConfig[0].items.slice(-1);
     expect(lastItem).toBe(config);
   });
 
-  it('should always sort the advanced accordion to the end when the config is not a container', function() {
-    delete config.container;
-    const items = node.inspectorConfig[0].items;
-    node.inspectorConfig[0].items = [{ items }];
-
-    registerInspectorExtension(node, config);
-
-    const [lastItem] = node.inspectorConfig[0].items[0].items.slice(-1);
-    expect(lastItem).toBe(config);
-  });
-
   it('should update items that have the same id', function() {
     config.id = 1;