diff --git a/src/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.vue b/src/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.vue index 1f558ce1..cce39eec 100644 --- a/src/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.vue +++ b/src/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.vue @@ -29,13 +29,13 @@ diff --git a/test/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.test.js b/test/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.test.js index 4260184c..4872d9c7 100644 --- a/test/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.test.js +++ b/test/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.test.js @@ -1,29 +1,48 @@ import NetworkOverviewDdosDetection from '@/views/charts2/charts/networkOverview/NetworkOverviewDdosDetection' import { mount } from '@vue/test-utils' import axios from 'axios' -const data = { - attackEventCount: 1200000, - attackerCount: 2687878, - victimCount: 36676767 + +const mockGet = { + data: {"status":200,"code":200,"queryKey":"dec6723e173e8fa2b00917dc597bfb27","success":true,"message":null,"statistics":{"elapsed":0,"rows_read":2,"result_size":58,"result_rows":1},"job":null,"formatType":"json","meta":[{"name":"attack_event_count","type":"long","category":"Metric"},{"name":"attacker_count","type":"long","category":"Metric"},{"name":"victim_count","type":"long","category":"Metric"}],"data":{"resultType":"object","result":[{"attackEventCount":1200000,"attackerCount":2687878,"victimCount":36676767}]},"originalUrl":"http://192.168.44.55:9999?query=SELECT%20COUNT%28*%29%20AS%20attack_event_count%2C%20COUNT%28DISTINCT%28offender_ip%29%29%20AS%20attacker_count%2C%20COUNT%28DISTINCT%28victim_ip%29%29%20AS%20victim_count%20FROM%20security_event%20WHERE%20start_time%20%3E%3D%201675043912%20AND%20start_time%20%3C%201675047512%20AND%20security_type%20%3D%20%27ddos%27&format=json&option=real-time","msg":"OK"} } -describe('views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.vueC测试', () => { - test('攻击、受害、攻击数事件：ddos检测图', () => { + +const timeFilter = { + dateRangeValue: -1, + startTime: 1675043912, + endTime: 1675047512 +} + +describe('views/charts2/charts/networkOverview/NetworkOverviewDdosDetection.vue测试', () => { + test('攻击、受害、攻击数事件：ddos检测图', async () => { require('vue-router').useRoute.mockReturnValue({ query: {} }) - axios.get.mockResolvedValue(data) + // 模拟 axios 返回数据 + axios.get.mockResolvedValue(mockGet) // 加载vue组件，获得实例 const wrapper = mount(NetworkOverviewDdosDetection, { propsData: { - data + timeFilter } }) - setTimeout(() => { - const attackEventCount = wrapper.get('[test-id="attackEventCount"]') - const attackerCount = wrapper.get('[test-id="attackerCount"]') - const victimCount = wrapper.get('[test-id="victimCount"]') + const attackEventCount = wrapper.get('[test-id="attackEventCount"]') + const attackerCount = wrapper.get('[test-id="attackerCount"]') + const victimCount = wrapper.get('[test-id="victimCount"]') + await new Promise(resolve => setTimeout(() => { expect(attackEventCount.text()).toEqual('1.20 M') expect(attackerCount.text()).toEqual('2.69 M') expect(victimCount.text()).toEqual('36.68 M') - }) + resolve() + }, 200)) + }) + test('class 类名', () => { + const wrapper = mount(NetworkOverviewDdosDetection) + + const attackEventCount = wrapper.get('[test-id="attackEventCount"]') + const attackerCount = wrapper.get('[test-id="attackerCount"]') + const victimCount = wrapper.get('[test-id="victimCount"]') + + expect(attackEventCount.classes()).toContain('ddos-event') + expect(attackerCount.classes()).toContain('ddos-detection-type-value-number') + expect(victimCount.classes()).toContain('ddos-detection-type-value-number') }) }) diff --git a/test/views/charts2/charts/npm/NpmEventsHeader.test.js b/test/views/charts2/charts/npm/NpmEventsHeader.test.js new file mode 100644 index 00000000..2accd902 --- /dev/null +++ b/test/views/charts2/charts/npm/NpmEventsHeader.test.js @@ -0,0 +1,70 @@ +import NpmEventsHeader from '@/views/charts2/charts/npm/NpmEventsHeader' +import { mount } from '@vue/test-utils' +import axios from 'axios' + +// 模拟数据 +const chartData = { + data: {"status":200,"code":200,"queryKey":"6480498979f7501d822572ebeb9e9665","success":true,"message":null,"statistics":{"elapsed":0,"rows_read":3,"result_size":167,"result_rows":5},"job":null,"formatType":"json","meta":[{"name":"event_severity","type":"string","category":"Dimension"},{"name":"count","type":"long","category":"Metric"}],"data":{"resultType":"table","result":[{"eventSeverity":"critical","count":3},{"eventSeverity":"high","count":1},{"eventSeverity":"info","count":1},{"eventSeverity":"low","count":1},{"eventSeverity":"medium","count":2}]},"originalUrl":"http://192.168.44.55:9999?query=SELECT%20event_severity%20AS%20event_severity%2C%20COUNT%28*%29%20AS%20count%20FROM%20performance_event%20WHERE%20start_time%20%3E%3D%201675026686%20AND%20end_time%20%3C%201675048286%20GROUP%20BY%20event_severity&format=json&option=real-time","msg":"OK"} +} +// type +const type = 'severity' + +describe('views/charts2/charts/npm/NpmEventsHeader.vue测试', () => { + test('严重等级各等级个数：npm event 严重等级单值', async () => { + require('vue-router').useRoute.mockReturnValue({ query: {} }) + // 模拟 axios 返回数据 + axios.get.mockResolvedValue(chartData) + // 加载vue组件，获得实例 + const wrapper = mount(NpmEventsHeader, { + propsData: { + type + } + }) + // 严重等级 + const severity0 = wrapper.get('[test-id="severity0"]') + const severity1 = wrapper.get('[test-id="severity1"]') + const severity2 = wrapper.get('[test-id="severity2"]') + const severity3 = wrapper.get('[test-id="severity3"]') + const severity4 = wrapper.get('[test-id="severity4"]') + // 各等级个数 + const total0 = wrapper.get('[test-id="total0"]') + const total1 = wrapper.get('[test-id="total1"]') + const total2 = wrapper.get('[test-id="total2"]') + const total3 = wrapper.get('[test-id="total3"]') + const total4 = wrapper.get('[test-id="total4"]') + + // type + expect(wrapper.vm.type).toEqual('severity') + + expect(severity0.text()).toEqual('critical') + expect(severity1.text()).toEqual('high') + expect(severity2.text()).toEqual('medium') + expect(severity3.text()).toEqual('low') + expect(severity4.text()).toEqual('info') + + await new Promise(resolve => setTimeout(() => { + expect(total0.text()).toEqual('3') + expect(total1.text()).toEqual('1') + expect(total2.text()).toEqual('2') + expect(total3.text()).toEqual('1') + expect(total4.text()).toEqual('1') + resolve() + }, 200)) + }) + test('class 严重等级类名', () => { + // 加载vue组件，获得实例 + const wrapper = mount(NpmEventsHeader) + // 动态添加类名 + const icon0 = wrapper.get('[test-id="icon0"]') + const icon1 = wrapper.get('[test-id="icon1"]') + const icon2 = wrapper.get('[test-id="icon2"]') + const icon3 = wrapper.get('[test-id="icon3"]') + const icon4 = wrapper.get('[test-id="icon4"]') + + expect(icon0.classes()).toContain('critical') + expect(icon1.classes()).toContain('high') + expect(icon2.classes()).toContain('medium') + expect(icon3.classes()).toContain('low') + expect(icon4.classes()).toContain('info') + }) +})