[ISSUE-#3855] Provided a feature to view version comparisons in the configDetails page (#3988)
* add detail previous config history api * modify the previous config history url * modify log description * 详情页面添加“历史对比”按钮,点击可打开对比面板 * 点击“历史对比”按钮,获取上一版本数据 * 在查看历史对比的时候 不显示revert按钮 * append doc info * Add unit tests for ISSUE#3855 * Add the previous updates to main.js and main.css Co-authored-by: 赵延 <1060026287@qq.com>
This commit is contained in:
parent
d78ebbbce1
commit
6df2b229d0
@ -28,9 +28,6 @@ import org.springframework.web.bind.annotation.RequestMapping;
|
|||||||
import org.springframework.web.bind.annotation.RequestParam;
|
import org.springframework.web.bind.annotation.RequestParam;
|
||||||
import org.springframework.web.bind.annotation.RestController;
|
import org.springframework.web.bind.annotation.RestController;
|
||||||
|
|
||||||
import javax.servlet.http.HttpServletRequest;
|
|
||||||
import javax.servlet.http.HttpServletResponse;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* History management controller.
|
* History management controller.
|
||||||
*
|
*
|
||||||
@ -46,11 +43,11 @@ public class HistoryController {
|
|||||||
/**
|
/**
|
||||||
* Query the list history config.
|
* Query the list history config.
|
||||||
*
|
*
|
||||||
* @param dataId dataId string value.
|
* @param dataId dataId string value.
|
||||||
* @param group group string value.
|
* @param group group string value.
|
||||||
* @param tenant tenant string value.
|
* @param tenant tenant string value.
|
||||||
* @param appName appName string value.
|
* @param appName appName string value.
|
||||||
* @param pageNo pageNo string value.
|
* @param pageNo pageNo string value.
|
||||||
* @param pageSize pageSize string value.
|
* @param pageSize pageSize string value.
|
||||||
* @param modelMap modeMap.
|
* @param modelMap modeMap.
|
||||||
* @return
|
* @return
|
||||||
@ -72,12 +69,26 @@ public class HistoryController {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Query the detailed configuration history informations.
|
* Query the detailed configuration history information.
|
||||||
|
*
|
||||||
|
* @param nid history_config_info nid
|
||||||
|
* @return history config info
|
||||||
*/
|
*/
|
||||||
@GetMapping
|
@GetMapping
|
||||||
public ConfigHistoryInfo getConfigHistoryInfo(HttpServletRequest request, HttpServletResponse response,
|
public ConfigHistoryInfo getConfigHistoryInfo(@RequestParam("nid") Long nid) {
|
||||||
@RequestParam("nid") Long nid, ModelMap modelMap) {
|
|
||||||
return persistService.detailConfigHistory(nid);
|
return persistService.detailConfigHistory(nid);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Query previous config history information.
|
||||||
|
*
|
||||||
|
* @param id config_info id
|
||||||
|
* @return history config info
|
||||||
|
* @since 1.4.0
|
||||||
|
*/
|
||||||
|
@GetMapping(value = "/previous")
|
||||||
|
public ConfigHistoryInfo getPreviousConfigHistoryInfo(@RequestParam("id") Long id) {
|
||||||
|
return persistService.detailPreviousConfigHistory(id);
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -1077,6 +1077,15 @@ public interface PersistService {
|
|||||||
*/
|
*/
|
||||||
ConfigHistoryInfo detailConfigHistory(Long nid);
|
ConfigHistoryInfo detailConfigHistory(Long nid);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Get previous config detail.
|
||||||
|
*
|
||||||
|
* @param id id
|
||||||
|
* @return {@link ConfigHistoryInfo}
|
||||||
|
*/
|
||||||
|
ConfigHistoryInfo detailPreviousConfigHistory(Long id);
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* insert tenant info.
|
* insert tenant info.
|
||||||
*
|
*
|
||||||
@ -1229,4 +1238,5 @@ public interface PersistService {
|
|||||||
* @return count by tenantId
|
* @return count by tenantId
|
||||||
*/
|
*/
|
||||||
int tenantInfoCountByTenantId(String tenantId);
|
int tenantInfoCountByTenantId(String tenantId);
|
||||||
|
|
||||||
}
|
}
|
@ -2059,6 +2059,12 @@ public class EmbeddedStoragePersistServiceImpl implements PersistService {
|
|||||||
return databaseOperate.queryOne(sqlFetchRows, new Object[] {nid}, HISTORY_DETAIL_ROW_MAPPER);
|
return databaseOperate.queryOne(sqlFetchRows, new Object[] {nid}, HISTORY_DETAIL_ROW_MAPPER);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Override
|
||||||
|
public ConfigHistoryInfo detailPreviousConfigHistory(Long id) {
|
||||||
|
String sqlFetchRows = "SELECT nid,data_id,group_id,tenant_id,app_name,content,md5,src_user,src_ip,op_type,gmt_create,gmt_modified FROM his_config_info WHERE nid = (select max(nid) from his_config_info where id = ?)";
|
||||||
|
return databaseOperate.queryOne(sqlFetchRows, new Object[] {id}, HISTORY_DETAIL_ROW_MAPPER);
|
||||||
|
}
|
||||||
|
|
||||||
@Override
|
@Override
|
||||||
public void insertTenantInfoAtomic(String kp, String tenantId, String tenantName, String tenantDesc,
|
public void insertTenantInfoAtomic(String kp, String tenantId, String tenantName, String tenantDesc,
|
||||||
String createResoure, final long time) {
|
String createResoure, final long time) {
|
||||||
|
@ -2297,6 +2297,19 @@ public class ExternalStoragePersistServiceImpl implements PersistService {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Override
|
||||||
|
public ConfigHistoryInfo detailPreviousConfigHistory(Long id) {
|
||||||
|
String sqlFetchRows = "SELECT nid,data_id,group_id,tenant_id,app_name,content,md5,src_user,src_ip,op_type,gmt_create,gmt_modified FROM his_config_info WHERE nid = (select max(nid) from his_config_info where id = ?) ";
|
||||||
|
try {
|
||||||
|
ConfigHistoryInfo historyInfo = jt
|
||||||
|
.queryForObject(sqlFetchRows, new Object[] {id}, HISTORY_DETAIL_ROW_MAPPER);
|
||||||
|
return historyInfo;
|
||||||
|
} catch (DataAccessException e) {
|
||||||
|
LogUtil.FATAL_LOG.error("[detail-previous-config-history] error, id:{}", new Object[] {id}, e);
|
||||||
|
throw e;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@Override
|
@Override
|
||||||
public void insertTenantInfoAtomic(String kp, String tenantId, String tenantName, String tenantDesc,
|
public void insertTenantInfoAtomic(String kp, String tenantId, String tenantName, String tenantDesc,
|
||||||
String createResoure, final long time) {
|
String createResoure, final long time) {
|
||||||
|
@ -32,6 +32,9 @@ class DiffEditorDialog extends React.Component {
|
|||||||
|
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
publishConfig: PropTypes.func,
|
publishConfig: PropTypes.func,
|
||||||
|
title: PropTypes.string,
|
||||||
|
currentArea: PropTypes.string,
|
||||||
|
originalArea: PropTypes.string,
|
||||||
};
|
};
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
@ -71,6 +74,7 @@ class DiffEditorDialog extends React.Component {
|
|||||||
highlightDifferences: true,
|
highlightDifferences: true,
|
||||||
connect: 'align',
|
connect: 'align',
|
||||||
collapseIdentical: false,
|
collapseIdentical: false,
|
||||||
|
revertButtons: typeof this.props.publishConfig === 'function',
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -80,19 +84,29 @@ class DiffEditorDialog extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { locale = {} } = this.props;
|
const { locale = {}, title, currentArea, originalArea } = this.props;
|
||||||
|
const publishButton = (
|
||||||
|
<Button type="primary" onClick={this.confirmPub.bind(this)}>
|
||||||
|
{locale.publish}
|
||||||
|
</Button>
|
||||||
|
);
|
||||||
const footer = (
|
const footer = (
|
||||||
<div>
|
<div>
|
||||||
{' '}
|
{' '}
|
||||||
<Button type="primary" onClick={this.confirmPub.bind(this)}>
|
{typeof this.props.publishConfig === 'function' ? (
|
||||||
{locale.publish}
|
publishButton
|
||||||
</Button>
|
) : (
|
||||||
|
<Button type="primary" onClick={this.closeDialog.bind(this)}>
|
||||||
|
{locale.back}
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
console.log(footer);
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Dialog
|
<Dialog
|
||||||
title={locale.contents}
|
title={title}
|
||||||
style={{ width: '80%' }}
|
style={{ width: '80%' }}
|
||||||
visible={this.state.dialogvisible}
|
visible={this.state.dialogvisible}
|
||||||
footer={footer}
|
footer={footer}
|
||||||
@ -101,8 +115,8 @@ class DiffEditorDialog extends React.Component {
|
|||||||
<div style={{ height: 400 }}>
|
<div style={{ height: 400 }}>
|
||||||
<div>
|
<div>
|
||||||
<Row>
|
<Row>
|
||||||
<Col style={{ textAlign: 'center' }}>{locale.currentArea}</Col>
|
<Col style={{ textAlign: 'center' }}>{currentArea}</Col>
|
||||||
<Col style={{ textAlign: 'center' }}>{locale.originalValue}</Col>
|
<Col style={{ textAlign: 'center' }}>{originalArea}</Col>
|
||||||
</Row>
|
</Row>
|
||||||
</div>
|
</div>
|
||||||
<div style={{ clear: 'both', height: 480 }} ref={this.diffeditor} />
|
<div style={{ clear: 'both', height: 480 }} ref={this.diffeditor} />
|
||||||
|
@ -378,9 +378,7 @@ const I18N_CONF = {
|
|||||||
},
|
},
|
||||||
DiffEditorDialog: {
|
DiffEditorDialog: {
|
||||||
publish: 'Publish',
|
publish: 'Publish',
|
||||||
contents: 'Content Comparison',
|
back: 'Back',
|
||||||
currentArea: 'Current Value',
|
|
||||||
originalValue: 'Original Value',
|
|
||||||
},
|
},
|
||||||
ConfigEditor: {
|
ConfigEditor: {
|
||||||
official: 'Official',
|
official: 'Official',
|
||||||
@ -411,6 +409,9 @@ const I18N_CONF = {
|
|||||||
publish: 'Publish',
|
publish: 'Publish',
|
||||||
back: 'Back',
|
back: 'Back',
|
||||||
codeValErrorPrompt: 'Configuration information may have syntax errors. Are you sure to submit?',
|
codeValErrorPrompt: 'Configuration information may have syntax errors. Are you sure to submit?',
|
||||||
|
dialogTitle: 'Content Comparison',
|
||||||
|
dialogCurrentArea: 'Current Value',
|
||||||
|
dialogOriginalArea: 'Original Value',
|
||||||
},
|
},
|
||||||
EditorNameSpace: {
|
EditorNameSpace: {
|
||||||
notice: 'Notice',
|
notice: 'Notice',
|
||||||
@ -498,6 +499,9 @@ const I18N_CONF = {
|
|||||||
betaRelease: 'Beta Publish:',
|
betaRelease: 'Beta Publish:',
|
||||||
configuration: 'Configuration Content:',
|
configuration: 'Configuration Content:',
|
||||||
back: 'Back',
|
back: 'Back',
|
||||||
|
versionComparison: 'Version Comparison',
|
||||||
|
dialogCurrentArea: 'Current Version',
|
||||||
|
dialogOriginalArea: 'Previous Version',
|
||||||
},
|
},
|
||||||
ConfigRollback: {
|
ConfigRollback: {
|
||||||
rollBack: 'Roll Back',
|
rollBack: 'Roll Back',
|
||||||
|
@ -376,9 +376,7 @@ const I18N_CONF = {
|
|||||||
},
|
},
|
||||||
DiffEditorDialog: {
|
DiffEditorDialog: {
|
||||||
publish: '确认发布',
|
publish: '确认发布',
|
||||||
contents: '内容比较',
|
back: '返回',
|
||||||
currentArea: '当前值',
|
|
||||||
originalValue: '原始值',
|
|
||||||
},
|
},
|
||||||
ConfigEditor: {
|
ConfigEditor: {
|
||||||
official: '正式',
|
official: '正式',
|
||||||
@ -409,6 +407,9 @@ const I18N_CONF = {
|
|||||||
publish: '发布',
|
publish: '发布',
|
||||||
back: '返回',
|
back: '返回',
|
||||||
codeValErrorPrompt: '配置信息可能有语法错误, 确定提交吗?',
|
codeValErrorPrompt: '配置信息可能有语法错误, 确定提交吗?',
|
||||||
|
dialogTitle: '内容比较',
|
||||||
|
dialogCurrentArea: '当前值',
|
||||||
|
dialogOriginalArea: '原始值',
|
||||||
},
|
},
|
||||||
EditorNameSpace: {
|
EditorNameSpace: {
|
||||||
notice: '提示',
|
notice: '提示',
|
||||||
@ -495,6 +496,9 @@ const I18N_CONF = {
|
|||||||
betaRelease: 'Beta发布:',
|
betaRelease: 'Beta发布:',
|
||||||
configuration: '配置内容:',
|
configuration: '配置内容:',
|
||||||
back: '返回',
|
back: '返回',
|
||||||
|
versionComparison: '版本对比',
|
||||||
|
dialogCurrentArea: '当前版本',
|
||||||
|
dialogOriginalArea: '上一版本',
|
||||||
},
|
},
|
||||||
ConfigRollback: {
|
ConfigRollback: {
|
||||||
rollBack: '回滚配置',
|
rollBack: '回滚配置',
|
||||||
|
@ -15,15 +15,27 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Button, ConfigProvider, Dialog, Field, Form, Input, Loading, Tab } from '@alifd/next';
|
import {
|
||||||
|
Button,
|
||||||
|
ConfigProvider,
|
||||||
|
Dialog,
|
||||||
|
Field,
|
||||||
|
Form,
|
||||||
|
Input,
|
||||||
|
Loading,
|
||||||
|
Tab,
|
||||||
|
Grid,
|
||||||
|
} from '@alifd/next';
|
||||||
import { getParams, request } from '../../../globalLib';
|
import { getParams, request } from '../../../globalLib';
|
||||||
import { generateUrl } from '../../../utils/nacosutil';
|
import { generateUrl } from '../../../utils/nacosutil';
|
||||||
|
import DiffEditorDialog from '../../../components/DiffEditorDialog';
|
||||||
|
|
||||||
import './index.scss';
|
import './index.scss';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
const TabPane = Tab.Item;
|
const TabPane = Tab.Item;
|
||||||
const FormItem = Form.Item;
|
const FormItem = Form.Item;
|
||||||
|
const { Row, Col } = Grid;
|
||||||
|
|
||||||
@ConfigProvider.config
|
@ConfigProvider.config
|
||||||
class ConfigDetail extends React.Component {
|
class ConfigDetail extends React.Component {
|
||||||
@ -56,6 +68,7 @@ class ConfigDetail extends React.Component {
|
|||||||
this.searchGroup = getParams('searchGroup') || '';
|
this.searchGroup = getParams('searchGroup') || '';
|
||||||
this.pageSize = getParams('pageSize');
|
this.pageSize = getParams('pageSize');
|
||||||
this.pageNo = getParams('pageNo');
|
this.pageNo = getParams('pageNo');
|
||||||
|
this.diffEditorDialog = React.createRef();
|
||||||
// this.params = window.location.hash.split('?')[1]||'';
|
// this.params = window.location.hash.split('?')[1]||'';
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -188,6 +201,32 @@ class ConfigDetail extends React.Component {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
openDiff() {
|
||||||
|
let self = this;
|
||||||
|
const { locale = {} } = this.props;
|
||||||
|
let leftvalue = this.monacoEditor.getValue();
|
||||||
|
let url = `v1/cs/history/previous?id=${this.valueMap.normal.id}`;
|
||||||
|
request({
|
||||||
|
url,
|
||||||
|
beforeSend() {
|
||||||
|
self.openLoading();
|
||||||
|
},
|
||||||
|
success(result) {
|
||||||
|
if (result != null) {
|
||||||
|
let rightvalue = result.content;
|
||||||
|
leftvalue = leftvalue.replace(/\r\n/g, '\n').replace(/\n/g, '\r\n');
|
||||||
|
rightvalue = rightvalue.replace(/\r\n/g, '\n').replace(/\n/g, '\r\n');
|
||||||
|
self.diffEditorDialog.current.getInstance().openDialog(leftvalue, rightvalue);
|
||||||
|
} else {
|
||||||
|
Dialog.alert({ title: locale.error, content: result.message });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
complete() {
|
||||||
|
self.closeLoading();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { locale = {} } = this.props;
|
const { locale = {} } = this.props;
|
||||||
const { init } = this.field;
|
const { init } = this.field;
|
||||||
@ -276,12 +315,23 @@ class ConfigDetail extends React.Component {
|
|||||||
<FormItem label={locale.configuration} required {...formItemLayout}>
|
<FormItem label={locale.configuration} required {...formItemLayout}>
|
||||||
<div style={{ clear: 'both', height: 300 }} id="container" />
|
<div style={{ clear: 'both', height: 300 }} id="container" />
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label={' '} {...formItemLayout}>
|
</Form>
|
||||||
<Button type={'primary'} onClick={this.goList.bind(this)}>
|
<Row>
|
||||||
|
<Col span="24" className="button-list">
|
||||||
|
<Button size="large" type="primary" onClick={this.openDiff.bind(this)}>
|
||||||
|
{locale.versionComparison}
|
||||||
|
</Button>{' '}
|
||||||
|
<Button size="large" type="normal" onClick={this.goList.bind(this)}>
|
||||||
{locale.back}
|
{locale.back}
|
||||||
</Button>
|
</Button>
|
||||||
</FormItem>
|
</Col>
|
||||||
</Form>
|
</Row>
|
||||||
|
<DiffEditorDialog
|
||||||
|
ref={this.diffEditorDialog}
|
||||||
|
title={locale.versionComparison}
|
||||||
|
currentArea={locale.dialogCurrentArea}
|
||||||
|
originalArea={locale.dialogOriginalArea}
|
||||||
|
/>
|
||||||
</Loading>
|
</Loading>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -13,3 +13,10 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
.button-list {
|
||||||
|
text-align: right;
|
||||||
|
button {
|
||||||
|
margin-left: 1em;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
@ -605,6 +605,9 @@ class ConfigEditor extends React.Component {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
}}
|
}}
|
||||||
|
title={locale.dialogTitle}
|
||||||
|
currentArea={locale.dialogCurrentArea}
|
||||||
|
originalArea={locale.dialogOriginalArea}
|
||||||
/>
|
/>
|
||||||
<SuccessDialog ref={this.successDialog} />
|
<SuccessDialog ref={this.successDialog} />
|
||||||
</Loading>
|
</Loading>
|
||||||
|
@ -0,0 +1,428 @@
|
|||||||
|
/*
|
||||||
|
* Copyright 1999-2018 Alibaba Group Holding Ltd.
|
||||||
|
*
|
||||||
|
* Licensed 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.
|
||||||
|
*/
|
||||||
|
|
||||||
|
const fs = require('fs');
|
||||||
|
const path = require('path');
|
||||||
|
const chai = require('chai');
|
||||||
|
const should = chai.should();
|
||||||
|
const JWebDriver = require('jwebdriver');
|
||||||
|
chai.use(JWebDriver.chaiSupportChainPromise);
|
||||||
|
const resemble = require('resemblejs-node');
|
||||||
|
resemble.outputSettings({
|
||||||
|
errorType: 'flatDifferenceIntensity',
|
||||||
|
});
|
||||||
|
|
||||||
|
const rootPath = getRootPath();
|
||||||
|
|
||||||
|
module.exports = function() {
|
||||||
|
let driver, testVars;
|
||||||
|
|
||||||
|
before(function() {
|
||||||
|
let self = this;
|
||||||
|
driver = self.driver;
|
||||||
|
testVars = self.testVars;
|
||||||
|
});
|
||||||
|
|
||||||
|
it('url: http://localhost:8000', async function() {
|
||||||
|
await driver.url(_(`http://localhost:8000`));
|
||||||
|
});
|
||||||
|
|
||||||
|
it('waitBody: ', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(500)
|
||||||
|
.wait('body', 30000)
|
||||||
|
.html()
|
||||||
|
.then(function(code) {
|
||||||
|
isPageError(code).should.be.false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: #username, 126, 37, 0', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('#username', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(126, 37)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('sendKeys: nacos{TAB}nacos{ENTER}', async function() {
|
||||||
|
await driver.sendKeys('nacos{TAB}nacos{ENTER}');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: 详情 ( #root tr.first > td[role="gridcell"].last > div.next-table-cell-wrapper > div > a:nth-child(1), 11, 3, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait(
|
||||||
|
'#root tr.first > td[role="gridcell"].last > div.next-table-cell-wrapper > div > a:nth-child(1)',
|
||||||
|
30000
|
||||||
|
)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(11, 3)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: 版本对比 ( //span[text()="版本对比"], 41, 0, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('//span[text()="版本对比"]', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(41, 0)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: i.next-icon-close, 1, 2, 0', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('i.next-icon-close', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(1, 2)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: 返回 ( #root button.next-btn-normal, 36, 9, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('#root button.next-btn-normal', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(36, 9)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: 详情 ( #root tr.first > td[role="gridcell"].last > div.next-table-cell-wrapper > div > a:nth-child(1), 10, 2, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait(
|
||||||
|
'#root tr.first > td[role="gridcell"].last > div.next-table-cell-wrapper > div > a:nth-child(1)',
|
||||||
|
30000
|
||||||
|
)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(10, 2)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: 版本对比 ( //span[text()="版本对比"], 20, -1, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('//span[text()="版本对比"]', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(20, -1)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: i.next-icon-close, 5, 5, 0', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('i.next-icon-close', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(5, 5)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: En ( //span[text()="En"], 13, 13, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('//span[text()="En"]', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(13, 13)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: Version Comparison ( #root button.next-btn-primary > span.next-btn-helper, 67, 4, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('#root button.next-btn-primary > span.next-btn-helper', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(67, 4)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: Back ( button.next-medium, 11, 21, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('button.next-medium', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(11, 21)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: Version Comparison ( #root button.next-btn-primary > span.next-btn-helper, 128, 0, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('#root button.next-btn-primary > span.next-btn-helper', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(128, 0)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: i.next-icon-close, 7, 9, 0', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('i.next-icon-close', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(7, 9)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: Back ( //span[text()="Back"], 11, -1, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('//span[text()="Back"]', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(11, -1)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: Details ( #root tr.first > td[role="gridcell"].last > div.next-table-cell-wrapper > div > a:nth-child(1), 25, 8, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait(
|
||||||
|
'#root tr.first > td[role="gridcell"].last > div.next-table-cell-wrapper > div > a:nth-child(1)',
|
||||||
|
30000
|
||||||
|
)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(25, 8)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('click: Version Comparison ( #root button.next-btn-primary > span.next-btn-helper, 104, 3, 0 )', async function() {
|
||||||
|
await driver
|
||||||
|
.sleep(300)
|
||||||
|
.wait('#root button.next-btn-primary > span.next-btn-helper', 30000)
|
||||||
|
.sleep(300)
|
||||||
|
.mouseMove(104, 3)
|
||||||
|
.click(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
function _(str) {
|
||||||
|
if (typeof str === 'string') {
|
||||||
|
return str.replace(/\{\{(.+?)\}\}/g, function(all, key) {
|
||||||
|
return testVars[key] || '';
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
return str;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (module.parent && /mocha\.js/.test(module.parent.id)) {
|
||||||
|
runThisSpec();
|
||||||
|
}
|
||||||
|
|
||||||
|
function runThisSpec() {
|
||||||
|
// read config
|
||||||
|
let webdriver = process.env['webdriver'] || '';
|
||||||
|
let proxy = process.env['wdproxy'] || '';
|
||||||
|
let config = require(rootPath + '/config.json');
|
||||||
|
let webdriverConfig = Object.assign({}, config.webdriver);
|
||||||
|
let host = webdriverConfig.host;
|
||||||
|
let port = webdriverConfig.port || 4444;
|
||||||
|
let group = webdriverConfig.group || 'default';
|
||||||
|
let match = webdriver.match(/([^\:]+)(?:\:(\d+))?/);
|
||||||
|
if (match) {
|
||||||
|
host = match[1] || host;
|
||||||
|
port = match[2] || port;
|
||||||
|
}
|
||||||
|
let testVars = config.vars;
|
||||||
|
let browsers = webdriverConfig.browsers;
|
||||||
|
browsers = browsers.replace(/^\s+|\s+$/g, '');
|
||||||
|
delete webdriverConfig.host;
|
||||||
|
delete webdriverConfig.port;
|
||||||
|
delete webdriverConfig.group;
|
||||||
|
delete webdriverConfig.browsers;
|
||||||
|
|
||||||
|
// read hosts
|
||||||
|
let hostsPath = rootPath + '/hosts';
|
||||||
|
let hosts = '';
|
||||||
|
if (fs.existsSync(hostsPath)) {
|
||||||
|
hosts = fs.readFileSync(hostsPath).toString();
|
||||||
|
}
|
||||||
|
let specName = path
|
||||||
|
.relative(rootPath, __filename)
|
||||||
|
.replace(/\\/g, '/')
|
||||||
|
.replace(/\.js$/, '');
|
||||||
|
|
||||||
|
browsers.split(/\s*,\s*/).forEach(function(browserName) {
|
||||||
|
let caseName = specName + ' : ' + browserName;
|
||||||
|
|
||||||
|
let browserInfo = browserName.split(' ');
|
||||||
|
browserName = browserInfo[0];
|
||||||
|
let browserVersion = browserInfo[1];
|
||||||
|
|
||||||
|
describe(caseName, function() {
|
||||||
|
this.timeout(600000);
|
||||||
|
this.slow(1000);
|
||||||
|
|
||||||
|
let driver;
|
||||||
|
before(function() {
|
||||||
|
let self = this;
|
||||||
|
let driver = new JWebDriver({
|
||||||
|
host: host,
|
||||||
|
port: port,
|
||||||
|
});
|
||||||
|
let sessionConfig = Object.assign({}, webdriverConfig, {
|
||||||
|
group: group,
|
||||||
|
browserName: browserName,
|
||||||
|
version: browserVersion,
|
||||||
|
'ie.ensureCleanSession': true,
|
||||||
|
});
|
||||||
|
if (proxy) {
|
||||||
|
sessionConfig.proxy = {
|
||||||
|
proxyType: 'manual',
|
||||||
|
httpProxy: proxy,
|
||||||
|
sslProxy: proxy,
|
||||||
|
};
|
||||||
|
} else if (hosts) {
|
||||||
|
sessionConfig.hosts = hosts;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
self.driver = driver
|
||||||
|
.session(sessionConfig)
|
||||||
|
.windowSize(1024, 768)
|
||||||
|
.config({
|
||||||
|
pageloadTimeout: 30000, // page onload timeout
|
||||||
|
scriptTimeout: 5000, // sync script timeout
|
||||||
|
asyncScriptTimeout: 10000, // async script timeout
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e);
|
||||||
|
}
|
||||||
|
|
||||||
|
self.testVars = testVars;
|
||||||
|
let casePath = path.dirname(caseName);
|
||||||
|
if (config.reporter && config.reporter.distDir) {
|
||||||
|
self.screenshotPath = config.reporter.distDir + '/reports/screenshots/' + casePath;
|
||||||
|
self.diffbasePath = config.reporter.distDir + '/reports/diffbase/' + casePath;
|
||||||
|
} else {
|
||||||
|
self.screenshotPath = rootPath + '/reports/screenshots/' + casePath;
|
||||||
|
self.diffbasePath = rootPath + '/reports/diffbase/' + casePath;
|
||||||
|
}
|
||||||
|
self.caseName = caseName.replace(/.*\//g, '').replace(/\s*[:\.\:\-\s]\s*/g, '_');
|
||||||
|
mkdirs(self.screenshotPath);
|
||||||
|
mkdirs(self.diffbasePath);
|
||||||
|
self.stepId = 0;
|
||||||
|
return self.driver;
|
||||||
|
});
|
||||||
|
|
||||||
|
module.exports();
|
||||||
|
|
||||||
|
beforeEach(function() {
|
||||||
|
let self = this;
|
||||||
|
self.stepId++;
|
||||||
|
if (self.skipAll) {
|
||||||
|
self.skip();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
afterEach(async function() {
|
||||||
|
let self = this;
|
||||||
|
let currentTest = self.currentTest;
|
||||||
|
let title = currentTest.title;
|
||||||
|
if (
|
||||||
|
currentTest.state === 'failed' &&
|
||||||
|
/^(url|waitBody|switchWindow|switchFrame):/.test(title)
|
||||||
|
) {
|
||||||
|
self.skipAll = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
(config.screenshots && config.screenshots.captureAll && !/^(closeWindow):/.test(title)) ||
|
||||||
|
currentTest.state === 'failed'
|
||||||
|
) {
|
||||||
|
const casePath = path.dirname(caseName);
|
||||||
|
const filepath = `${self.screenshotPath}/${self.caseName}_${self.stepId}`;
|
||||||
|
const relativeFilePath = `./screenshots/${casePath}/${self.caseName}_${self.stepId}`;
|
||||||
|
let driver = self.driver;
|
||||||
|
try {
|
||||||
|
// catch error when get alert msg
|
||||||
|
await driver.getScreenshot(filepath + '.png');
|
||||||
|
let url = await driver.url();
|
||||||
|
let html = await driver.source();
|
||||||
|
html = '<!--url: ' + url + ' -->\n' + html;
|
||||||
|
fs.writeFileSync(filepath + '.html', html);
|
||||||
|
let cookies = await driver.cookies();
|
||||||
|
fs.writeFileSync(filepath + '.cookie', JSON.stringify(cookies));
|
||||||
|
appendToContext(self, relativeFilePath + '.png');
|
||||||
|
} catch (e) {}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
after(function() {
|
||||||
|
return this.driver.close();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function getRootPath() {
|
||||||
|
let rootPath = path.resolve(__dirname);
|
||||||
|
while (rootPath) {
|
||||||
|
if (fs.existsSync(rootPath + '/config.json')) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
rootPath = rootPath.substring(0, rootPath.lastIndexOf(path.sep));
|
||||||
|
}
|
||||||
|
return rootPath;
|
||||||
|
}
|
||||||
|
|
||||||
|
function mkdirs(dirname) {
|
||||||
|
if (fs.existsSync(dirname)) {
|
||||||
|
return true;
|
||||||
|
} else {
|
||||||
|
if (mkdirs(path.dirname(dirname))) {
|
||||||
|
fs.mkdirSync(dirname);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function callSpec(name) {
|
||||||
|
try {
|
||||||
|
require(rootPath + '/' + name)();
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e);
|
||||||
|
process.exit(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function isPageError(code) {
|
||||||
|
return (
|
||||||
|
code == '' ||
|
||||||
|
/ jscontent="errorCode" jstcache="\d+"|diagnoseConnectionAndRefresh|dnserror_unavailable_header|id="reportCertificateErrorRetry"|400 Bad Request|403 Forbidden|404 Not Found|500 Internal Server Error|502 Bad Gateway|503 Service Temporarily Unavailable|504 Gateway Time-out/i.test(
|
||||||
|
code
|
||||||
|
)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function appendToContext(mocha, content) {
|
||||||
|
try {
|
||||||
|
const test = mocha.currentTest || mocha.test;
|
||||||
|
|
||||||
|
if (!test.context) {
|
||||||
|
test.context = content;
|
||||||
|
} else if (Array.isArray(test.context)) {
|
||||||
|
test.context.push(content);
|
||||||
|
} else {
|
||||||
|
test.context = [test.context];
|
||||||
|
test.context.push(content);
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.log('error', e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function catchError(error) {}
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user