Merge pull request #1488 from ProcessMaker/epic/FOUR-11574

FOUR-11744 / FOUR-11895 / FOUR-12198
ProcessMaker · Dec 11, 2023 · 1d7124c · 1d7124c
2 parents 5221d9f + 150d754
commit 1d7124c
Show file tree

Hide file tree

Showing 30 changed files with 398 additions and 84 deletions.
diff --git a/src/components/vue-form-builder.vue b/src/components/vue-form-builder.vue
diff --git a/tests/e2e/specs/Builder.spec.js b/tests/e2e/specs/Builder.spec.js
@@ -1,6 +1,7 @@
 describe('Screen Builder', () => {
   beforeEach(() => {
     cy.visit('/');
+    cy.openAllAcordeon();
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
   });

diff --git a/tests/e2e/specs/ComputedFields.spec.js b/tests/e2e/specs/ComputedFields.spec.js
@@ -88,6 +88,7 @@ describe('Computed fields', () => {
   });
   it('Create a javascript computed field', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     // Add an input field
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     // Add a second input field
@@ -118,6 +119,7 @@ describe('Computed fields', () => {
 
   it('Create a computed field with formula', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     // Add an input field
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     // Add a second input field

diff --git a/tests/e2e/specs/ComputedFieldsReadOnly.spec.js b/tests/e2e/specs/ComputedFieldsReadOnly.spec.js
@@ -139,6 +139,7 @@ describe('Computed fields', () => {
 
   it.only('The user should not be able to change a FormDatePicker assigned to a computed property', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     // Add an input field
     cy.get('[data-cy=controls-FormDatePicker]').drag('[data-cy=screen-drop-zone]', 'bottom'); 
     cy.get('[data-cy=screen-element-container]').click();

diff --git a/tests/e2e/specs/CustomCss.spec.js b/tests/e2e/specs/CustomCss.spec.js
@@ -1,6 +1,7 @@
 describe('Custom CSS', () => {
   it('Shows Modal', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -11,6 +12,7 @@ describe('Custom CSS', () => {
 
   it('Closes Modal', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -24,6 +26,7 @@ describe('Custom CSS', () => {
 
   it('Does Not Save Custom CSS', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -39,6 +42,7 @@ describe('Custom CSS', () => {
 
   it('Saves Custom CSS', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -55,6 +59,7 @@ describe('Custom CSS', () => {
 
   it('Does not add styling to element in design mode', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -70,6 +75,7 @@ describe('Custom CSS', () => {
 
   it('Adds styling to element in preview mode', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();

diff --git a/tests/e2e/specs/DatePicker.spec.js b/tests/e2e/specs/DatePicker.spec.js
@@ -5,6 +5,7 @@ moment.tz.setDefault('UTC');
 describe('Date Picker', () => {
   beforeEach(() => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.window().then((win) => {
       win.ProcessMaker.user.timezone = 'UTC';
     });
@@ -341,17 +342,14 @@ describe('Date Picker', () => {
   });
   it("Date picker with Required validation shouldn't allow the user to submit the date if empty", () => {
     const date = moment(new Date()).format('MM/DD/YYYY');
-
-
     cy.showValidationOnLoad();
-
     cy.get('[data-cy=controls-FormDatePicker]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.setMultiselect('[data-cy=inspector-dataFormat]', 'Date');
     cy.get('[data-cy=add-rule]').click();
     cy.setMultiselect('[data-cy=select-rule]', 'Required');
     cy.get('[data-cy=save-rule]').click();
-    cy.get('[data-cy=controls-FormButton]').last().drag('[data-cy=screen-element-container]', 'bottom');
+    cy.get('[data-cy=controls-FormButton]').first().drag('[data-cy=screen-element-container]', 'bottom');
 
     cy.get('[data-cy=mode-preview]').click();
     cy.get('.invalid-feedback').contains('Field is required');

diff --git a/tests/e2e/specs/DatePickerTimezone.spec.js b/tests/e2e/specs/DatePickerTimezone.spec.js
@@ -6,6 +6,7 @@ moment.tz.setDefault(timezoneTest);
 describe("Date Picker", () => {
   beforeEach(() => {
     cy.visit("/");
+    cy.openAcordeon("collapse-1");
     cy.window().then((win) => {
       win.ProcessMaker.user.timezone = timezoneTest;
     });

diff --git a/tests/e2e/specs/DefaultValues.spec.js b/tests/e2e/specs/DefaultValues.spec.js
@@ -1,6 +1,7 @@
 describe('Default values', () => {
   it('Basic default value', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -14,6 +15,7 @@ describe('Default values', () => {
 
   it('Text Input Default value if the variable has the next format "people.firstName"', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');   
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=inspector-name]').clear().type('people.firstName');
@@ -30,6 +32,7 @@ describe('Default values', () => {
 
   it('Select List- Default if the variable has the next format "numbers.int"', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormSelectList]').drag('[data-cy=screen-drop-zone]', 'bottom'); 
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=inspector-name]').clear().type('number.int');
@@ -63,6 +66,7 @@ describe('Default values', () => {
 
   it('Javascript default value', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.setPreviewDataInput({name: 'world'});
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
@@ -78,6 +82,7 @@ describe('Default values', () => {
   });
   it('Initially checked checkbox', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormCheckbox]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=inspector-initiallyChecked]').click();
@@ -89,6 +94,7 @@ describe('Default values', () => {
   });
   it('Dynamic Basic default value', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     // Add an input field
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom'); 
     // Add a second input field
@@ -110,6 +116,7 @@ describe('Default values', () => {
   });
   it('Dynamic Javascript default value', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     // Add an input field
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom'); 
     // Add a second input field

diff --git a/tests/e2e/specs/DeviceVisivilityInspector.spec.js b/tests/e2e/specs/DeviceVisivilityInspector.spec.js
@@ -11,6 +11,7 @@ import {nodeControls} from '../support/constants.js'
 describe('Device Visiblility Inspector', () => {
   it('Verify if an input has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -24,6 +25,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a checkbox has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormCheckbox]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -37,6 +39,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a datePicker has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormDatePicker]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -50,6 +53,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FileDownload has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-4");
     cy.get('[data-cy=controls-FileDownload]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -63,6 +67,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FileUpload has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-4");
     cy.get('[data-cy=controls-FileUpload]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -76,6 +81,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormImage has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-2");
     cy.get('[data-cy=controls-FormImage]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -89,6 +95,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormLoop has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-2");
     cy.get('[data-cy=controls-FormLoop]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -102,6 +109,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormMultiColumn has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-2");
     cy.get('[data-cy=controls-FormMultiColumn]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -115,6 +123,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormNestedScreen has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-2");
     cy.get('[data-cy=controls-FormNestedScreen]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -128,6 +137,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormButton has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormButton]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -141,6 +151,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormRecordList has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-2");
     cy.get('[data-cy=controls-FormRecordList]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -154,6 +165,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormHtmlViewer has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-2");
     cy.get('[data-cy=controls-FormHtmlViewer]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -167,6 +179,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormSelectList has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormSelectList]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -180,6 +193,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Verify if a FormTextArea has device visiblility settings', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormTextArea]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -193,6 +207,7 @@ describe('Device Visiblility Inspector', () => {
   });
   it('Enabled device visiblility', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FormInput]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
     cy.get('[data-cy=accordion-Advanced]').click();
@@ -253,6 +268,7 @@ describe('Device Visiblility Inspector', () => {
     cy.visit('/');
     //Step 1: Add Loop
     addControl('Loop');
+    cy.openAcordeon("collapse-1");
 
     //Step 2: Add Line input inside the loop
     addControlInsideLoop(1,nodeControls.formInput);
@@ -313,6 +329,8 @@ describe('Device Visiblility Inspector', () => {
 
   it('Verify Device Visibility of controls inside a table', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-2");
+    cy.openAcordeon("collapse-1");
     //Step 1: Add Loop
     addControl('Multicolumn / Table');
 
@@ -340,7 +358,8 @@ describe('Device Visiblility Inspector', () => {
 
   it('Verify Device Visibility of controls inside a table mobile', () => {
     cy.visit('/');
-
+    cy.openAcordeon("collapse-2");
+    cy.openAcordeon("collapse-1");
     //Step 1: Add Table
     addControl('Multicolumn / Table');
 
@@ -368,7 +387,6 @@ describe('Device Visiblility Inspector', () => {
 
   it('Verify Device Visibility of a control and Visibility Rule', () => {
     cy.visit("/");
-
     //Step 1: Add line input control
     addControl('Line Input');
 

diff --git a/tests/e2e/specs/FileUpload.spec.js b/tests/e2e/specs/FileUpload.spec.js
@@ -1,6 +1,8 @@
 describe('File Upload', () => {
   it('Automatically sets a variable name', () => {
     cy.visit('/');
+    cy.openAcordeon("collapse-4");
+    //cy.openAcordeon("collapse-1");
     cy.get('[data-cy=controls-FileUpload]').drag('[data-cy=screen-drop-zone]', 'bottom');
     cy.get('[data-cy=screen-element-container]').click();
 

diff --git a/tests/e2e/specs/FormImage.spec.js b/tests/e2e/specs/FormImage.spec.js