2023-02-03 16:09:32 +08:00
|
|
|
|
import LinkTrafficLine from '@/views/charts2/charts/linkMonitor/LinkTrafficLine'
|
|
|
|
|
|
import { mount } from '@vue/test-utils'
|
|
|
|
|
|
import axios from 'axios'
|
|
|
|
|
|
|
|
|
|
|
|
const timeFilter = {
|
|
|
|
|
|
dateRangeValue: -1,
|
|
|
|
|
|
startTime: 1673244000,
|
|
|
|
|
|
endTime: 1673247600
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const mockGet = {
|
2023-02-17 15:28:43 +08:00
|
|
|
|
data: { status: 200, code: 200, queryKey: '87649896d5b7547a0128eb47c2d40853', success: true, message: null, statistics: { elapsed: 4, rows_read: 1033063, bytes_read: 8618120, result_size: 13807, result_rows: 101 }, job: null, formatType: 'json', meta: [{ name: 'stat_time', type: 'long', category: 'Dimension' }, { name: 'egress_bytes', type: 'long', category: 'Metric' }, { name: 'ingress_bytes', type: 'long', category: 'Metric' }, { name: 'egress_pkt', type: 'long', category: 'Metric' }, { name: 'ingress_pkt', type: 'long', category: 'Metric' }, { name: 'bytes_total', type: 'long', category: 'Metric' }, { name: 'packets_total', type: 'long', category: 'Metric' }], data: { resultType: 'object', result: [{ type: 'bytes', ingressBitsRate: { values: [['1675388124', '0'], ['1675388160', '4253144'], ['1675388196', '470709.36'], ['1675388232', '0'], ['1675388268', '148192.24'], ['1675388304', '0'], ['1675388340', '577072.48'], ['1675388376', '160431.12'], ['1675388412', '0'], ['1675388448', '1639602.64'], ['1675388484', '0'], ['1675388520', '2074017.36'], ['1675388556', '798924.64'], ['1675388592', '0'], ['1675388628', '884606'], ['1675388664', '0'], ['1675388700', '1373220.48'], ['1675388736', '21305.36'], ['1675388772', '0'], ['1675388808', '1398940.24'], ['1675388844', '0'], ['1675388880', '4474519.52'], ['1675388916', '383473.12'], ['1675388952', '0'], ['1675388988', '582813.36'], ['1675389024', '0'], ['1675389060', '3545078.24'], ['1675389096', '766672'], ['1675389132', '0'], ['1675389168', '2877694'], ['1675389204', '0'], ['1675389240', '2195562.48'], ['1675389276', '2268681.12'], ['1675389312', '0'], ['1675389348', '1438248.88'], ['1675389384', '0'], ['1675389420', '88914.24'], ['1675389456', '363776.24'], ['1675389492', '0'], ['1675389528', '103931.36'], ['1675389564', '0'], ['1675389600', '930861.12'], ['1675389636', '473982.48'], ['1675389672', '0'], ['1675389708', '210004.88'], ['1675389744', '0'], ['1675389780', '764367.52'], ['1675389816', '236745.52'], ['1675389852', '0'], ['1675389888', '199598'], ['1675389924', '0'], ['1675389960', '385563.36'], ['1675389996', '353556.64'], ['1675390032', '0'], ['1675390068', '380246.48'], ['1675390104', '0'], ['1675390140', '456284'], ['1675390176', '2560143.76'], ['1675390212', '0'], ['1675390248', '3806779.36'], ['1675390284', '0'], ['1675390320', '382829.52'], ['1675390356', '225432.48'], ['1675390392', '0'], ['1675390428', '1024283.52'], ['1675390464', '0'], ['1675390500', '494194.88'], ['1675390536', '718094.88'], ['1675390572', '0'], ['1675390608', '373146.64'], ['1675390644', '0'], ['1675390680', '101628.64'], ['1675390716', '977218'], ['1675390752', '0'], ['1675390788', '7263452.48'], ['1675390824', '0'], ['1675390860', '2613115.76'], ['1675390896', '2987862'], ['1675390932', '0'], ['1675390968', '1376989.36'], ['1675391004', '0'], ['1675391040', '2245663.12'], ['1675391076', '602240.64'], ['1675391112', '0'], ['1675391148', '437569.12'], ['1675391184', '0'], ['1675391220', '115680.88'], ['1675391256', '42582.24'], ['1675391292', '0'], ['1675391328', '42002'], ['1675391364', '0'], ['1675391400', '720716'], ['1675391436', '5382.88'], ['1675391472', '0'], ['1675391508', '169074.64'], ['1675391544', '0'], ['1675391580', '1214277.76'], ['1675391616', '1523679.76'], ['1675391652', '0'], ['1675391688', '6382256'], ['1675391724', '0']], analysis: { avg: '756870.4', max: '7263452.48', min: '0', p95: '3545078.24' } }, totalBitsRate: { values: [['1675388124', '0'], ['1675388160', '17581092.48'], ['1675388196', '9918148.64'], ['1675388232', '0'], ['1675388268', '13213336.64'], ['1675388304', '0'], ['1675388340', '41123655.76'], ['1675388376', '14569548.64'], ['1675388412', '0'], ['1675388448', '39157977.52'], ['1675388484', '0'], ['1675388520', '15875735.76'], ['1675388556', '10885102.24'], ['1675388592', '0'], ['1675388628', '8943487.12'], ['1675388664', '0'], ['1675388700', '18985121.76'], ['1675388736', '7659627.36'], ['1675388772', '0'], ['1675388808', '9288266.88'], ['1675388844', '0'], ['1675388880', '15999674.24'], ['1675388916', '16802700.48'], ['1675388952', '0'], ['167
|
2023-02-03 16:09:32 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
const mockGet1 = {
|
2023-02-17 15:28:43 +08:00
|
|
|
|
data: { status: 200, code: 200, queryKey: 'a54916e7f363fd065dfaa44ad23d31b5', success: true, message: null, statistics: { elapsed: 4, rows_read: 10518, bytes_read: 1062318, result_size: 186, result_rows: 1 }, job: null, formatType: 'json', meta: [{ name: 'total_bytes', type: 'long', category: 'Metric' }, { name: 'total_packets', type: 'long', category: 'Metric' }, { name: 'establish_latency_ms', type: 'double', category: 'Metric' }, { name: 'http_response_latency', type: 'double', category: 'Metric' }, { name: 'ssl_con_latency', type: 'double', category: 'Metric' }, { name: 'tcp_lostlen_percent', type: 'double', category: 'Metric' }, { name: 'pkt_retrans_percent', type: 'double', category: 'Metric' }], data: { resultType: 'table', result: [{ totalBytes: '4426409159', totalBitsRate: 9836464.8, totalPackets: '3324302', establishLatencyMs: 92.9489, httpResponseLatency: 154.2884, sslConLatency: 0, tcpLostlenPercent: 0.0069, pktRetransPercent: 0.0165 }] }, originalUrl: 'http://192.168.44.55:9999?query=SELECT%20SUM%28IF%28%20common_egress_link_id%20%3D%201792%2C%20traffic_outbound_byte%2C%200%29%20%2B%20IF%28%20common_ingress_link_id%20%3D%201793%2C%20traffic_inbound_byte%2C%200%29%29%20as%20total_bytes%2CSUM%28IF%28%20common_egress_link_id%20%3D%201792%2C%20traffic_outbound_pkt%2C%200%29%20%2B%20IF%28%20common_ingress_link_id%20%3D%201793%2C%20traffic_inbound_pkt%2C%200%29%29%20AS%20total_packets%2CROUND%28AVG%28avg_establish_latency_ms%29%2C%204%29%20AS%20establish_latency_ms%2CROUND%28AVG%28avg_http_response_latency_ms%29%2C%204%29%20AS%20http_response_latency%2CROUND%28AVG%28avg_ssl_con_latency_ms%29%2C%204%29%20AS%20ssl_con_latency%2CROUND%28AVG%28tcp_lostlen_ratio%29%2C%204%29%20AS%20tcp_lostlen_percent%2CROUND%28AVG%28pkt_retrans_ratio%29%2C%204%29%20AS%20pkt_retrans_percent%20FROM%20metric_link%20WHERE%20stat_time%20%3E%3D%201675403646%20AND%20stat_time%20%3C%201675407246%20&format=json&option=real-time', msg: 'OK' }
|
2023-02-03 16:09:32 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2023-02-17 15:28:43 +08:00
|
|
|
|
const cnLinkInfo = [{ originalLinkId: '256', linkId: 'Hundredgige1', direction: 'egress', nextHop: '西安', bandwidth: 100000000000 }, { originalLinkId: '257', linkId: 'Hundredgige1', direction: 'ingress', nextHop: '西安', bandwidth: 100000000000 }, { originalLinkId: '512', linkId: 'Hundredgige2', direction: 'egress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '513', linkId: 'Hundredgige2', direction: 'ingress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '768', linkId: 'Hundredgige3', direction: 'egress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '769', linkId: 'Hundredgige3', direction: 'ingress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '1024', linkId: 'Hundredgige4', direction: 'egress', nextHop: '西宁', bandwidth: 100000000000 }, { originalLinkId: '1025', linkId: 'Hundredgige4', direction: 'ingress', nextHop: '西宁', bandwidth: 100000000000 }, { originalLinkId: '1280', linkId: 'Hundredgige5', direction: 'egress', nextHop: '西安', bandwidth: 100000000000 }, { originalLinkId: '1281', linkId: 'Hundredgige5', direction: 'ingress', nextHop: '西安', bandwidth: 100000000000 }, { originalLinkId: '1536', linkId: 'Hundredgige6', direction: 'egress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '1537', linkId: 'Hundredgige6', direction: 'ingress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '1792', linkId: 'Hundredgige7', direction: 'egress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '1793', linkId: 'Hundredgige7', direction: 'ingress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '2048', linkId: 'Hundredgige8', direction: 'egress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '2049', linkId: 'Hundredgige8', direction: 'ingress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '2304', linkId: 'Hundredgige9', direction: 'egress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '2305', linkId: 'Hundredgige9', direction: 'ingress', nextHop: '太原', bandwidth: 100000000000 }, { originalLinkId: '2816', linkId: 'Hundredgige10', direction: 'egress', nextHop: '西安', bandwidth: 100000000000 }, { originalLinkId: '2817', linkId: 'Hundredgige10', direction: 'ingress', nextHop: '西安', bandwidth: 100000000000 }]
|
2023-02-03 16:09:32 +08:00
|
|
|
|
const linkInfo = JSON.stringify(cnLinkInfo)
|
|
|
|
|
|
|
2023-02-17 15:28:43 +08:00
|
|
|
|
const query1 = { t: '1675395023486', thirdPanel: '15', thirdMenu: 'Link ID: Hundredgige10', panelName: 'Link ID: Hundredgige10', queryCondition: 'common_egress_link_id = 1792 or common_ingress_link_id = 1793', curTab: 'ip', startTime: 1675391498, endTime: 1675395098, range: 60 }
|
|
|
|
|
|
const query2 = { t: '1675409029937', thirdPanel: '15', thirdMenu: 'Link ID: Hundredgige10', panelName: 'Link ID: Hundredgige10', queryCondition: 'common_egress_link_id = 2816 or common_ingress_link_id = 2817', curTab: 'ip', startTime: 1675388605, endTime: 1675410205, range: 360, lineMetric: 'Bits/s' }
|
|
|
|
|
|
const query3 = { t: '1675409029937', thirdPanel: '15', thirdMenu: 'Link ID: Hundredgige10', panelName: 'Link ID: Hundredgige10', queryCondition: 'common_egress_link_id = 2816 or common_ingress_link_id = 2817', curTab: 'ip', startTime: 1675388605, endTime: 1675410205, range: 360, lineMetric: 'Packets/s' }
|
2023-02-03 16:09:32 +08:00
|
|
|
|
|
|
|
|
|
|
let wrapper = null
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 进行axios请求，并挂载vue实例
|
|
|
|
|
|
* 模拟localStorage获取数据
|
|
|
|
|
|
* @param query
|
|
|
|
|
|
*/
|
|
|
|
|
|
function axiosPostAndMounted (query) {
|
|
|
|
|
|
require('vue-router').useRoute.mockReturnValue({ query: query })
|
|
|
|
|
|
// 模拟 axios 数据
|
|
|
|
|
|
axios.get.mockImplementation(url => {
|
|
|
|
|
|
switch (url) {
|
|
|
|
|
|
case '/interface/link/overview/drilldown/totalTrafficAnalysis':
|
|
|
|
|
|
return Promise.resolve(mockGet)
|
|
|
|
|
|
case '/interface/link/overview/drilldown/networkAnalysis':
|
|
|
|
|
|
return Promise.resolve(mockGet1)
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
// 模拟localStorage获取数据
|
2023-02-17 15:28:43 +08:00
|
|
|
|
// eslint-disable-next-line no-proto
|
2023-02-03 16:09:32 +08:00
|
|
|
|
jest.spyOn(localStorage.__proto__, 'getItem').mockImplementation(key => linkInfo)
|
|
|
|
|
|
// 加载vue组件，获得实例
|
|
|
|
|
|
wrapper = mount(LinkTrafficLine, {
|
|
|
|
|
|
propsData: {
|
|
|
|
|
|
timeFilter
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
describe('views/charts2/charts/linkMonitor/LinkTrafficLine.vue测试', () => {
|
|
|
|
|
|
test('左侧列表信息：link下钻折线图 ', async () => {
|
|
|
|
|
|
axiosPostAndMounted(query1)
|
|
|
|
|
|
await new Promise(resolve => setTimeout(() => {
|
|
|
|
|
|
const textNode0 = wrapper.get('[test-id="line-tabContent"]')
|
|
|
|
|
|
const textNode1 = wrapper.get('[test-id="line-percent"]')
|
|
|
|
|
|
const textNode2 = wrapper.get('[test-id="line-score"]')
|
|
|
|
|
|
const textNode3 = wrapper.get('[test-id="line-tcp"]')
|
|
|
|
|
|
const textNode4 = wrapper.get('[test-id="line-http"]')
|
|
|
|
|
|
const textNode5 = wrapper.get('[test-id="line-ssl"]')
|
|
|
|
|
|
const textNode6 = wrapper.get('[test-id="line-packetLoss"]')
|
|
|
|
|
|
const textNode7 = wrapper.get('[test-id="line-packetRetrans"]')
|
|
|
|
|
|
|
|
|
|
|
|
expect(textNode0.text()).toEqual('756.87Kbps')
|
|
|
|
|
|
expect(textNode1.text()).toEqual('0%')
|
|
|
|
|
|
expect(textNode2.text()).toEqual('5')
|
|
|
|
|
|
expect(textNode3.text()).toEqual('92ms')
|
|
|
|
|
|
expect(textNode4.text()).toEqual('154ms')
|
|
|
|
|
|
expect(textNode5.text()).toEqual('0ms')
|
|
|
|
|
|
expect(textNode6.text()).toEqual('0.69%')
|
|
|
|
|
|
expect(textNode7.text()).toEqual('1.65%')
|
|
|
|
|
|
resolve()
|
|
|
|
|
|
}, 200))
|
|
|
|
|
|
})
|
|
|
|
|
|
test('Metric=Bits/s, tab点击第二个高亮：link下钻折线图 ', async () => {
|
|
|
|
|
|
axiosPostAndMounted(query2)
|
|
|
|
|
|
|
|
|
|
|
|
const textNode3 = await wrapper.get('[test-id="tab-1"]')
|
|
|
|
|
|
await textNode3.trigger('click')
|
|
|
|
|
|
expect(textNode3.classes()).toContain('is-active')
|
|
|
|
|
|
|
|
|
|
|
|
const textNode0 = await wrapper.get('[test-id="tabContent0"]')
|
|
|
|
|
|
const textNode1 = await wrapper.get('[test-id="tabContent1"]')
|
|
|
|
|
|
const textNode2 = await wrapper.get('[test-id="tabContent2"]')
|
|
|
|
|
|
|
|
|
|
|
|
await new Promise(resolve => setTimeout(() => {
|
|
|
|
|
|
expect(textNode0.text()).toEqual('756.87Kbps')
|
|
|
|
|
|
expect(textNode1.text()).toEqual('10.58Mbps')
|
|
|
|
|
|
expect(textNode2.text()).toEqual('9.82Mbps')
|
|
|
|
|
|
resolve()
|
|
|
|
|
|
}, 200))
|
|
|
|
|
|
})
|
|
|
|
|
|
test('Metric=Packets/s：link下钻折线图 ', async () => {
|
|
|
|
|
|
axiosPostAndMounted(query3)
|
|
|
|
|
|
const textNode0 = await wrapper.get('[test-id="tabContent0"]')
|
|
|
|
|
|
const textNode1 = await wrapper.get('[test-id="tabContent1"]')
|
|
|
|
|
|
const textNode2 = await wrapper.get('[test-id="tabContent2"]')
|
|
|
|
|
|
|
|
|
|
|
|
await new Promise(resolve => setTimeout(() => {
|
|
|
|
|
|
expect(textNode0.text()).toEqual('72.72packets/s')
|
|
|
|
|
|
expect(textNode1.text()).toEqual('904.03packets/s')
|
|
|
|
|
|
expect(textNode2.text()).toEqual('976.75packets/s')
|
|
|
|
|
|
resolve()
|
|
|
|
|
|
}, 200))
|
|
|
|
|
|
})
|
|
|
|
|
|
})
|
