fix(entities-plugins): revert the changes on the required field (#1249)

* fix(entities-plugins): revert the changes on the required field * test(entities-plugins): fix tests
Kong · Mar 15, 2024 · 755fe82 · 755fe82
1 parent 8f5b159
commit 755fe82
Show file tree

Hide file tree

Showing 3 changed files with 88 additions and 3 deletions.
diff --git a/packages/entities/entities-plugins/fixtures/mockData.ts b/packages/entities/entities-plugins/fixtures/mockData.ts
@@ -772,6 +772,13 @@ export const schema2 = {
               type: 'boolean',
             },
           },
+          {
+            required_non_checkbox_field: {
+              description: 'A non-checkbox but required field.',
+              required: true,
+              type: 'string',
+            },
+          },
         ],
         required: true,
         type: 'record',

diff --git a/packages/entities/entities-plugins/src/components/PluginForm.cy.ts b/packages/entities/entities-plugins/src/components/PluginForm.cy.ts
@@ -280,8 +280,7 @@ describe('<PluginForm />', () => {
       cy.get('@commonFields').find('.plugin-protocols-select').should('be.visible')
 
       // required fields
-      cy.get('@requiredFields').find('#config-include_base_path').should('be.visible')
-      cy.get('@requiredFields').find('#config-random_status_code').should('be.visible')
+      cy.get('@requiredFields').find('#config-required_non_checkbox_field').should('be.visible')
 
       // advanced fields should be hidden by default
       cy.get('@advancedFields').findTestId('k-collapse-hidden-content').should('be.hidden')
@@ -293,7 +292,9 @@ describe('<PluginForm />', () => {
       // advanced fields
       cy.get('@advancedFields').find('#config-api_specification').should('be.visible')
       cy.get('@advancedFields').find('#config-api_specification_filename').should('be.visible')
+      cy.get('@advancedFields').find('#config-include_base_path').should('be.visible')
       cy.get('@advancedFields').find('#config-included_status_codes').should('be.visible')
+      cy.get('@advancedFields').find('#config-random_status_code').should('be.visible')
     })
 
     it('should hide scope selection when hideScopeSelection is true', () => {
@@ -941,6 +942,84 @@ describe('<PluginForm />', () => {
       cy.get('#config-private_network').should('be.visible')
     })
 
+    it('should show common, required, and advanced fields when groupFields is true', () => {
+      interceptKonnectSchema({ mockData: schema2 })
+
+      cy.mount(PluginForm, {
+        global: { components: { VueFormGenerator } },
+        props: {
+          config: {
+            ...baseConfigKonnect,
+            groupFields: true,
+          },
+          pluginType: 'mocking',
+          useCustomNamesForPlugin: true,
+        },
+        router,
+      })
+
+      cy.wait('@getPluginSchema')
+      cy.get('.kong-ui-entities-plugin-form-container').should('be.visible')
+
+      // button state
+      cy.getTestId('form-submit').should('be.visible')
+      cy.getTestId('form-submit').should('be.enabled')
+      cy.getTestId('form-back').should('be.visible')
+      cy.getTestId('form-back').should('be.enabled')
+      cy.getTestId('form-cancel').should('be.visible')
+
+      // scope fields
+      cy.get('.field-selectionGroup').should('be.visible')
+      cy.get('.Global-check').should('be.visible')
+      cy.get('.Scoped-check').should('be.visible')
+      cy.get('.field-selectionGroup').find('.field-AutoSuggest').should('not.be.visible')
+      cy.get('.Scoped-check input').click()
+      cy.get('.field-selectionGroup').find('.field-AutoSuggest').should('be.visible')
+      cy.get('#service-id').should('be.visible')
+      cy.get('#route-id').should('be.visible')
+
+      cy.getTestId('k-collapse-title')
+        .contains('Common Fields')
+        .parents('.k-collapse')
+        .first()
+        .as('commonFields')
+
+      cy.getTestId('k-collapse-title')
+        .contains('Required Fields')
+        .parents('.k-collapse')
+        .first()
+        .as('requiredFields')
+
+      cy.getTestId('k-collapse-title')
+        .contains('Advanced Fields')
+        .parents('.k-collapse')
+        .first()
+        .as('advancedFields')
+
+      // common fields
+      cy.get('@commonFields').find('#enabled').should('exist')
+      cy.get('@commonFields').find('#instance_name').should('exist')
+      cy.get('@commonFields').find('#tags').should('exist')
+      cy.get('@commonFields').find('.plugin-protocols-select').should('be.visible')
+
+      // required fields
+      cy.get('@requiredFields').find('#config-required_non_checkbox_field').should('be.visible')
+
+      // advanced fields should be hidden by default
+      cy.get('@advancedFields').findTestId('k-collapse-hidden-content').should('be.hidden')
+
+      // reveal them
+      cy.get('@advancedFields').findTestId('k-collapse-trigger-content').click()
+      cy.get('@advancedFields').findTestId('k-collapse-hidden-content').should('be.visible')
+
+      // advanced fields
+      cy.get('@advancedFields').find('#config-api_specification').should('be.visible')
+      cy.get('@advancedFields').find('#config-api_specification_filename').should('be.visible')
+      cy.get('@advancedFields').find('#config-include_base_path').should('be.visible')
+      cy.get('@advancedFields').find('#config-included_status_codes').should('be.visible')
+      cy.get('@advancedFields').find('#config-random_status_code').should('be.visible')
+    })
+
     it('should hide scope selection when hideScopeSelection is true', () => {
       interceptKonnectSchema()
 

diff --git a/packages/entities/entities-plugins/src/components/PluginForm.vue b/packages/entities/entities-plugins/src/components/PluginForm.vue
@@ -512,7 +512,6 @@ const buildFormSchema = (parentKey: string, response: Record<string, any>, initi
 
     initialFormSchema[field] = { id: field } // each field's key will be set as the id
     initialFormSchema[field].type = scheme.type === 'boolean' ? 'checkbox' : 'input'
-    initialFormSchema[field].required = scheme.required
 
     if (field.startsWith('config-')) {
       initialFormSchema[field].label = formatPluginFieldLabel(field)