109 lines
25 KiB
JavaScript
109 lines
25 KiB
JavaScript
|
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 = {
|
|||
|
|
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"],["1675388988","17836499.52"],["1675389024","0"],["1675389060","22368492"],["1675389096","12570182.88"],["1675389132","0"],["1675389168","19977345.36"],["1675389204","0"],["1675389240","7747381.76"],["1675389276","29050230.64"],["1675389312","0"],["1675389348","5834855.3
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const mockGet1 = {
|
|||
|
|
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"}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
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}]
|
|||
|
|
const linkInfo = JSON.stringify(cnLinkInfo)
|
|||
|
|
|
|||
|
|
const query1 = {"t":"1675395023486","thirdPanel":"15","thirdMenu":"Link ID: Hundredgige7","panelName":"Link ID: Hundredgige7","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"}
|
|||
|
|
|
|||
|
|
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获取数据
|
|||
|
|
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))
|
|||
|
|
})
|
|||
|
|
})
|