This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git
The following commit(s) were added to refs/heads/master by this push:
new 5eaa272 fix: route edit page suspend due to the form shouldupdate
(#1926)
5eaa272 is described below
commit 5eaa272df4432bda4e29843dd440cc7a67e58083
Author: liuxiran <[email protected]>
AuthorDate: Sun Jun 6 10:45:06 2021 +0800
fix: route edit page suspend due to the form shouldupdate (#1926)
---
.../create-edit-route-with-redirect-plugin.spec.js | 114 +++++++++++++++++++++
web/src/pages/Route/components/Step1/MetaView.tsx | 12 ++-
2 files changed, 122 insertions(+), 4 deletions(-)
diff --git
a/web/cypress/integration/route/create-edit-route-with-redirect-plugin.spec.js
b/web/cypress/integration/route/create-edit-route-with-redirect-plugin.spec.js
new file mode 100644
index 0000000..c653705
--- /dev/null
+++
b/web/cypress/integration/route/create-edit-route-with-redirect-plugin.spec.js
@@ -0,0 +1,114 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* eslint-disable no-undef */
+
+context('Create Edit and Delete Route with redirect plugin', () => {
+ const name = `routeName${new Date().valueOf()}`;
+ const newName = `newName${new Date().valueOf()}`;
+
+ const selector = {
+ empty: '.ant-empty-normal',
+ name: '#name',
+ redirect: '[data-cy=route-redirect]',
+ customRedirectSelectOpt: '#redirectOption_list_1',
+ customRedirectUrI: '#redirectURI',
+ customRedirectCode: '[data-cy=redirect_code]',
+ customRedirectLabel: '[title=\'Custom Redirect\']',
+ deleteAlert: '.ant-modal-body',
+ notificationCloseIcon: '.ant-notification-close-icon',
+ notification: '.ant-notification-notice-message',
+ };
+
+ const data = {
+ customRedirectUrI: '/test',
+ submitSuccess: 'Submit Successfully',
+ deleteRouteSuccess: 'Delete Route Successfully',
+ step2Title: 'Define API Backend Server',
+ step3Title: 'Plugin Config',
+ setUpstreamNotice: 'If you do not bind the service, you must set the
Upstream (Step 2)'
+ };
+
+ beforeEach(() => {
+ cy.login();
+ });
+
+ it('should create route with custom redirect plugin', function () {
+ cy.visit('/');
+ cy.contains('Route').click();
+ cy.get(selector.empty).should('be.visible');
+ cy.contains('Create').click();
+ cy.contains('Next').click().click();
+ cy.get(selector.name).type(name);
+ cy.get(selector.redirect).click();
+ cy.contains('Custom').click({force: true});
+ // after choose Custom option, Custom Redirect form field should be visible
+ cy.get(selector.customRedirectLabel).should('be.visible');
+ cy.get(selector.customRedirectUrI).should('be.visible');
+ cy.get(selector.customRedirectCode).should('be.visible');
+
+ // step 2 and step 3 should not be visible
+ cy.contains(data.step2Title).should('not.exist');
+ cy.contains(data.step3Title).should('not.exist');
+ // type customRedirectUrI
+ cy.get(selector.customRedirectUrI).type(data.customRedirectUrI);
+ cy.contains('Next').click();
+ cy.contains('Submit').click();
+ cy.contains(data.submitSuccess);
+
+ // back to route list page
+ cy.contains('Goto List').click();
+ cy.url().should('contains', 'routes/list');
+ });
+
+ it('should edit the route without notice', function () {
+ cy.visit('/');
+ cy.contains('Route').click();
+
+ cy.get(selector.name).type(name);
+ cy.contains('Search').click();
+ cy.contains(name).siblings().contains('Configure').click();
+
+ // NOTE: make sure all components rerender done
+ cy.get('#status').should('have.class', 'ant-switch-checked');
+ // should not shown set upstream notice
+ cy.contains(data.setUpstreamNotice).should('not.exist');
+ cy.get(selector.name).clear().type(newName);
+
+ cy.contains('Next').click();
+ cy.contains('Submit').click();
+ cy.contains(data.submitSuccess);
+ cy.contains('Goto List').click();
+ cy.url().should('contains', 'routes/list');
+ cy.contains(newName).should('be.visible');
+
+ });
+
+ it('should delete the route', function () {
+ cy.visit('/routes/list');
+ cy.get(selector.name).clear().type(newName);
+ cy.contains('Search').click();
+ cy.contains(newName).siblings().contains('More').click();
+ cy.contains('Delete').click();
+ cy.get(selector.deleteAlert)
+ .should('be.visible')
+ .within(() => {
+ cy.contains('OK').click();
+ });
+ cy.get(selector.notification).should('contain', data.deleteRouteSuccess);
+ cy.get(selector.notificationCloseIcon).click({multiple: true});
+ });
+});
diff --git a/web/src/pages/Route/components/Step1/MetaView.tsx
b/web/src/pages/Route/components/Step1/MetaView.tsx
index 4cbd64a..be4159d 100644
--- a/web/src/pages/Route/components/Step1/MetaView.tsx
+++ b/web/src/pages/Route/components/Step1/MetaView.tsx
@@ -205,8 +205,9 @@ const MetaView: React.FC<RouteModule.Step1PassProps> = ({
disabled, form, isEdit
>
<Select
disabled={disabled}
- onChange={(parmas) => {
- onChange({ action: 'redirectOptionChange', data: parmas });
+ data-cy='route-redirect'
+ onChange={(params) => {
+ onChange({ action: 'redirectOptionChange', data: params });
}}
>
{list.map(item => (
@@ -265,7 +266,7 @@ const MetaView: React.FC<RouteModule.Step1PassProps> = ({
disabled, form, isEdit
</Col>
<Col span={5}>
<Form.Item name="ret_code" rules={[{ required: true }]}>
- <Select disabled={disabled}>
+ <Select disabled={disabled} data-cy='redirect_code'>
<Select.Option value={301}>
{formatMessage({ id:
'page.route.select.option.redirect301' })}
</Select.Option>
@@ -308,6 +309,10 @@ const MetaView: React.FC<RouteModule.Step1PassProps> = ({
disabled, form, isEdit
</Row>
</Form.Item>
<Form.Item noStyle shouldUpdate={(prev, next) => {
+ // route with redirect plugin can be edit without service and upstream
+ if (next.redirectOption === 'customRedirect') {
+ return false;
+ }
if (next.service_id === '') {
const upstream_id = upstreamForm?.getFieldValue('upstream_id')
if (upstream_id === 'None') {
@@ -315,7 +320,6 @@ const MetaView: React.FC<RouteModule.Step1PassProps> = ({
disabled, form, isEdit
message: formatMessage({ id:
'page.route.fields.service_id.invalid' }),
description: formatMessage({ id:
'page.route.fields.service_id.without-upstream' })
})
- form.setFieldsValue({ service_id: prev.service_id })
}
}
return prev.service_id !== next.service_id
