fix: advance matching in the route create page causes the page to cra…

…sh (apache#2440)
bzp2010 · May 30, 2022 · 5e624a5 · 5e624a5
1 parent 7543860
commit 5e624a5
Show file tree

Hide file tree

Showing 3 changed files with 83 additions and 39 deletions.
diff --git a/web/cypress/integration/route/can-skip-upstream-when-select-service-id.spec.js b/web/cypress/integration/route/can-skip-upstream-when-select-service-id.spec.js
@@ -30,6 +30,13 @@ context('Can select service_id skip upstream in route', () => {
     deleteAlert: '.ant-modal-body',
     notificationCloseIcon: '.ant-notification-close-icon',
     enable_websocket: '#enable_websocket',
+    addbtn: '.ant-btn-primary',
+    selectItem: '.ant-select-item-option-content',
+    position: '#position',
+    value: '#value',
+    operator: '#operator',
+    rowcard: '.ant-table-row-level-0',
+    reverse: '#reverse',
   };
 
   const data = {
@@ -45,6 +52,8 @@ context('Can select service_id skip upstream in route', () => {
     ip1: '127.0.0.1',
     port0: '7000',
     weight0: '1',
+    parameterName: 'text_Parameter',
+    value: '["1", "2"]',
   };
 
   beforeEach(() => {
@@ -103,12 +112,46 @@ context('Can select service_id skip upstream in route', () => {
     cy.get(selector.input).should('be.disabled');
 
     cy.contains(data.upstreamName).click();
-    cy.contains('None').click({ force: true });
+    cy.contains('None').click({
+      force: true,
+    });
     cy.contains('Next').click();
     cy.contains('Next').click();
     cy.contains('Submit').click();
     cy.contains('Goto List').click();
   });
+  it('should Add Advanced Routing Matching Conditions', function () {
+    cy.visit('/');
+    cy.contains('Route').click();
+
+    cy.get(selector.nameSelector).type(data.routeName);
+    cy.contains('Search').click();
+    cy.contains(data.routeName).siblings().contains('Configure').click();
+    cy.get(selector.addbtn).contains('Add').click();
+    cy.get(selector.position).click();
+    cy.get(selector.selectItem).within(() => {
+      cy.contains('HTTP Request Header').click();
+    });
+    cy.get('.ant-form-item-control-input-content > #name').type(data.parameterName);
+    cy.get(selector.reverse).click();
+    cy.get(selector.operator).click();
+    cy.get(selector.selectItem).within(() => {
+      cy.contains('IN').click();
+    });
+    cy.get(selector.value).type(data.value);
+    cy.contains('Confirm').click();
+    cy.get(selector.rowcard).should('be.visible');
+    cy.get(selector.rowcard).get('tr>td').eq(2).contains('true').should('be.visible');
+    cy.get(selector.rowcard).contains('Configure').click();
+    cy.get(selector.reverse).click();
+    cy.contains('Confirm').click();
+    cy.get(selector.rowcard).get('tr>td').eq(2).contains('false').should('be.visible');
+    cy.contains('Next').click();
+    cy.contains('Next').click();
+    cy.contains('Next').click();
+    cy.contains('Submit').click();
+    cy.contains(data.submitSuccess);
+  });
 
   it('should skip upstream module after service is selected when editing route', function () {
     cy.visit('/');

diff --git a/web/src/pages/Route/List.tsx b/web/src/pages/Route/List.tsx
@@ -228,47 +228,47 @@ const Page: React.FC = () => {
       onClick: () => void;
       icon?: ReactNode;
     }[] = [
-        {
-          name: formatMessage({ id: 'component.global.view' }),
-          onClick: () => {
-            setId(record.id);
-            setRawData(omit(record, DELETE_FIELDS));
-            setVisible(true);
-            setEditorMode('update');
-          },
+      {
+        name: formatMessage({ id: 'component.global.view' }),
+        onClick: () => {
+          setId(record.id);
+          setRawData(omit(record, DELETE_FIELDS));
+          setVisible(true);
+          setEditorMode('update');
         },
-        {
-          name: formatMessage({ id: 'component.global.duplicate' }),
-          onClick: () => {
-            history.push(`/routes/${record.id}/duplicate`);
-          },
+      },
+      {
+        name: formatMessage({ id: 'component.global.duplicate' }),
+        onClick: () => {
+          history.push(`/routes/${record.id}/duplicate`);
         },
-        {
-          name: formatMessage({ id: 'component.global.delete' }),
-          onClick: () => {
-            Modal.confirm({
-              type: 'warning',
-              title: formatMessage({ id: 'component.global.popconfirm.title.delete' }),
-              content: (
-                <>
-                  {formatMessage({ id: 'component.global.name' })} - {record.name}
-                  <br />
-                  ID - {record.id}
-                </>
-              ),
-              onOk: () => {
-                return remove(record.id!).then(() => {
-                  handleTableActionSuccessResponse(
-                    `${formatMessage({ id: 'component.global.delete' })} ${formatMessage({
-                      id: 'menu.routes',
-                    })} ${formatMessage({ id: 'component.status.success' })}`,
-                  );
-                });
-              },
-            });
-          },
+      },
+      {
+        name: formatMessage({ id: 'component.global.delete' }),
+        onClick: () => {
+          Modal.confirm({
+            type: 'warning',
+            title: formatMessage({ id: 'component.global.popconfirm.title.delete' }),
+            content: (
+              <>
+                {formatMessage({ id: 'component.global.name' })} - {record.name}
+                <br />
+                ID - {record.id}
+              </>
+            ),
+            onOk: () => {
+              return remove(record.id!).then(() => {
+                handleTableActionSuccessResponse(
+                  `${formatMessage({ id: 'component.global.delete' })} ${formatMessage({
+                    id: 'menu.routes',
+                  })} ${formatMessage({ id: 'component.status.success' })}`,
+                );
+              });
+            },
+          });
         },
-      ];
+      },
+    ];
 
     return (
       <Dropdown

diff --git a/web/src/pages/Route/components/Step1/MatchingRulesView.tsx b/web/src/pages/Route/components/Step1/MatchingRulesView.tsx
@@ -264,6 +264,7 @@ const MatchingRulesView: React.FC<RouteModule.Step1PassProps> = ({
             name={'reverse'}
             valuePropName={'checked'}
             required
+            initialValue={false}
           >
             <Switch />
           </Form.Item>