diff --git a/features/mesh/dataplanes/DataplaneDetailsBuiltinGateway.feature b/features/mesh/dataplanes/DataplaneDetailsBuiltinGateway.feature new file mode 100644 index 0000000000..4ddb4b7138 --- /dev/null +++ b/features/mesh/dataplanes/DataplaneDetailsBuiltinGateway.feature @@ -0,0 +1,90 @@ +Feature: Dataplane details for built-in gateway + Background: + Given the CSS selectors + | Alias | Selector | + | detail-view | [data-testid='data-plane-detail-tabs-view'] | + | policies-view | [data-testid='data-plane-policies-view'] | + | overview-tab | #data-plane-detail-view-tab a | + | policies-tab | #data-plane-policies-view-tab a | + | warnings | [data-testid='dataplane-warnings'] | + | details | [data-testid='dataplane-details'] | + | gateway | [data-testid='dataplane-gateway'] | + | inbounds | [data-testid='dataplane-inbounds'] | + | route-item | [data-testid='builtin-gateway-dataplane-policies'] .accordion-item | + | route-item-button | $route-item:nth-child(1) [data-testid='accordion-item-button'] | + And the environment + """ + KUMA_SUBSCRIPTION_COUNT: 2 + KUMA_DATAPLANEINBOUND_COUNT: 0 + KUMA_MODE: global + """ + And the URL "/meshes/default/dataplanes/dataplane-gateway_builtin-1/_overview" responds with + """ + body: + mesh: default + dataplane: + networking: + address: 193.107.134.106 + gateway: + type: BUILTIN + tags: + kuma.io/protocol: http + kuma.io/zone: zone-1 + inbound: !!js/undefined + dataplaneInsight: + subscriptions: + - controlPlaneInstanceId: 'dpp-1-cp-instance-id' + connectTime: 2021-02-17T07:33:36.412683Z + disconnectTime: 2021-02-17T07:33:36.412683Z + - controlPlaneInstanceId: 'dpp-1-cp-instance-id' + connectTime: 2021-02-17T07:33:36.412683Z + disconnectTime: !!js/undefined + version: + kumaDp: + version: 1.0.8 + kumaCpCompatible: true + envoy: + kumaDpCompatible: true + """ + + When I visit the "/meshes/default/data-planes/dataplane-gateway_builtin-1/overview" URL + + Scenario: Overview tab has expected content + Then the page title contains "dataplane-gateway_builtin-1" + And the "$detail-view" element contains "dataplane-gateway_builtin-1" + And the "$warnings" element doesn't exist + And the "$details" element contains "online" + And the "$gateway" element contains "193.107.134.106" + And the "$gateway" element contains "kuma.io/protocol:http" + And the "$gateway" element contains "kuma.io/zone:zone-1" + And the "$inbounds" element doesn't exist + + Scenario: Policies tab has expected content + Given the URL "/meshes/default/dataplanes/dataplane-gateway_builtin-1/policies" responds with + """ + body: + listeners: + - hosts: + - routes: + - destinations: + - tags: + kuma.io/service: demo-app_kuma-demo_svc_5000 + policies: + CircuitBreaker: + name: circuit-breaker-1 + policies: + TrafficLog: + name: traffic-log-1 + TrafficTrace: + name: traffic-trace-1 + """ + + When I click the "$policies-tab" element + + Then the "$policies-view" element contains "traffic-log-1" + And the "$policies-view" element contains "traffic-trace-1" + + When I click the "$route-item-button" element + + Then the "$policies-view" element contains "circuit-breaker-1" + And the "$policies-view" element contains "demo-app_kuma-demo_svc_5000" diff --git a/features/mesh/dataplanes/DataplaneDetailsDelegatedGateway.feature b/features/mesh/dataplanes/DataplaneDetailsDelegatedGateway.feature new file mode 100644 index 0000000000..7d28402b0a --- /dev/null +++ b/features/mesh/dataplanes/DataplaneDetailsDelegatedGateway.feature @@ -0,0 +1,93 @@ +Feature: Dataplane details for delegated gateway + Background: + Given the CSS selectors + | Alias | Selector | + | detail-view | [data-testid='data-plane-detail-tabs-view'] | + | policies-view | [data-testid='data-plane-policies-view'] | + | overview-tab | #data-plane-detail-view-tab a | + | policies-tab | #data-plane-policies-view-tab a | + | warnings | [data-testid='dataplane-warnings'] | + | details | [data-testid='dataplane-details'] | + | gateway | [data-testid='dataplane-gateway'] | + | inbounds | [data-testid='dataplane-inbounds'] | + | policy-item | [data-testid='policy-list'] .accordion-item | + | policy-item-button | $policy-item:nth-child(1) [data-testid='accordion-item-button'] | + | rule-item | [data-testid='rule-list'] .accordion-item | + | rule-item-button | $rule-item:nth-child(1) [data-testid='accordion-item-button'] | + And the environment + """ + KUMA_SUBSCRIPTION_COUNT: 2 + KUMA_DATAPLANEINBOUND_COUNT: 0 + KUMA_MODE: global + """ + And the URL "/meshes/default/dataplanes/dataplane-gateway_delegated-1/_overview" responds with + """ + body: + mesh: default + dataplane: + networking: + address: 193.107.134.106 + gateway: + type: DELEGATED + tags: + kuma.io/protocol: http + kuma.io/zone: zone-1 + inbound: !!js/undefined + dataplaneInsight: + subscriptions: + - controlPlaneInstanceId: 'dpp-1-cp-instance-id' + connectTime: 2021-02-17T07:33:36.412683Z + disconnectTime: 2021-02-17T07:33:36.412683Z + - controlPlaneInstanceId: 'dpp-1-cp-instance-id' + connectTime: 2021-02-17T07:33:36.412683Z + disconnectTime: !!js/undefined + version: + kumaDp: + version: 1.0.8 + kumaCpCompatible: true + envoy: + kumaDpCompatible: true + """ + + When I visit the "/meshes/default/data-planes/dataplane-gateway_delegated-1/overview" URL + + Scenario: Overview tab has expected content + Then the page title contains "dataplane-gateway_delegated-1" + And the "$detail-view" element contains "dataplane-gateway_delegated-1" + And the "$warnings" element doesn't exist + And the "$details" element contains "online" + And the "$gateway" element contains "193.107.134.106" + And the "$gateway" element contains "kuma.io/protocol:http" + And the "$gateway" element contains "kuma.io/zone:zone-1" + And the "$inbounds" element doesn't exist + + Scenario: Policies tab has expected content + Given the URL "/meshes/default/dataplanes/dataplane-gateway_delegated-1/policies" responds with + """ + body: + items: + - matchedPolicies: + FaultInjection: + - sources: + - match: + kuma.io/service: service-a + """ + And the URL "/meshes/default/dataplanes/dataplane-gateway_delegated-1/rules" responds with + """ + body: + items: + - name: '' + - name: demo-app_kuma-demo_svc_5000 + service: demo-app_kuma-demo_svc_5000 + tags: + kuma.io/service: demo-app_kuma-demo_svc_5000 + """ + + When I click the "$policies-tab" element + And I click the "$policy-item-button" element + + Then the "$policies-view" element contains "kuma.io/service:service-a" + + When I click the "$rule-item-button" element + + Then the "$policies-view" element contains "kuma.io/service:demo-app_kuma-demo_svc_5000" diff --git a/features/mesh/dataplanes/DataplaneDetailsStandardProxy.feature b/features/mesh/dataplanes/DataplaneDetailsStandardProxy.feature new file mode 100644 index 0000000000..ab571ca0e8 --- /dev/null +++ b/features/mesh/dataplanes/DataplaneDetailsStandardProxy.feature @@ -0,0 +1,155 @@ +Feature: Dataplane details for standard Data Plane Proxy + Background: + Given the CSS selectors + | Alias | Selector | + | detail-view | [data-testid='data-plane-detail-tabs-view'] | + | policies-view | [data-testid='data-plane-policies-view'] | + | clusters-view | [data-testid='data-plane-clusters-view'] | + | overview-tab | #data-plane-detail-view-tab a | + | policies-tab | #data-plane-policies-view-tab a | + | clusters-tab | #data-plane-clusters-view-tab a | + | warnings | [data-testid='dataplane-warnings'] | + | details | [data-testid='dataplane-details'] | + | gateway | [data-testid='dataplane-gateway'] | + | inbounds | [data-testid='dataplane-inbounds'] | + | subscriptions | [data-testid='dataplane-subscriptions'] | + | status-cds | [data-testid='subscription-status-cds'] | + | status-eds | [data-testid='subscription-status-eds'] | + | status-lds | [data-testid='subscription-status-lds'] | + | status-rds | [data-testid='subscription-status-rds'] | + | policy-item | [data-testid='policy-list'] .accordion-item | + | policy-item-button | $policy-item:nth-child(1) [data-testid='accordion-item-button'] | + | rule-item | [data-testid='rule-list'] .accordion-item | + | rule-item-button | $rule-item:nth-child(1) [data-testid='accordion-item-button'] | + And the environment + """ + KUMA_SUBSCRIPTION_COUNT: 2 + KUMA_DATAPLANEINBOUND_COUNT: 1 + KUMA_MODE: global + """ + And the URL "/meshes/default/dataplanes/dpp-1-name-of-dataplane/_overview" responds with + """ + body: + mesh: default + dataplane: + networking: + address: 193.107.134.106 + gateway: !!js/undefined + inbound: + - health: + ready: true + port: 1328 + serviceAddress: 44.167.201.218 + servicePort: 62098 + tags: + kuma.io/protocol: http + kuma.io/zone: zone-1 + dataplaneInsight: + subscriptions: + - controlPlaneInstanceId: 'dpp-1-cp-instance-id' + connectTime: 2021-02-17T07:33:36.412683Z + disconnectTime: 2021-02-17T07:33:36.412683Z + version: + kumaDp: + version: 1.0.7 + kumaCpCompatible: false + envoy: + kumaDpCompatible: false + - controlPlaneInstanceId: 'dpp-1-cp-instance-id' + connectTime: 2021-02-17T07:33:36.412683Z + disconnectTime: !!js/undefined + status: + total: + responsesSent: '12' + responsesAcknowledged: '10' + cds: + responsesSent: '2' + responsesAcknowledged: '1' + eds: + responsesSent: '4' + responsesAcknowledged: '3' + lds: + responsesSent: '6' + responsesAcknowledged: '6' + rds: {} + version: + kumaDp: + version: 1.0.8 + kumaCpCompatible: true + envoy: + kumaDpCompatible: true + """ + + When I visit the "/meshes/default/data-planes/dpp-1-name-of-dataplane/overview" URL + + Scenario: Overview tab has expected content + Then the page title contains "dpp-1-name-of-dataplane" + And the "$detail-view" element contains "dpp-1-name-of-dataplane" + And the "$warnings" element doesn't exist + And the "$details" element contains "online" + And the "$gateway" element doesn't exist + And the "$inbounds" element contains "healthy" + And the "$inbounds" element contains "193.107.134.106:1328" + And the "$inbounds" element contains "44.167.201.218:62098" + And the "$inbounds" element contains "kuma.io/protocol:http" + And the "$inbounds" element contains "kuma.io/zone:zone-1" + And the "$subscriptions" element contains "Connected: Feb 17, 2021, 7:33 AM" + And the "$subscriptions" element contains "CP instance ID: dpp-1-cp-instance-id" + + When I click the ".accordion-item:nth-child(1) [data-testid='accordion-item-button']" element + + Then the "$status-cds" element contains "CDS" + And the "$status-cds" element contains "1" + And the "$status-cds" element contains "2" + And the "$status-eds" element contains "EDS" + And the "$status-eds" element contains "3" + And the "$status-eds" element contains "4" + And the "$status-lds" element contains "LDS" + And the "$status-lds" element contains "6" + And the "$status-rds" element contains "RDS" + And the "$status-rds" element contains "0" + + Scenario: Policies tab has expected content + Given the URL "/meshes/default/dataplanes/dpp-1-name-of-dataplane/policies" responds with + """ + body: + items: + - matchedPolicies: + FaultInjection: + - sources: + - match: + kuma.io/service: service-a + """ + And the URL "/meshes/default/dataplanes/dpp-1-name-of-dataplane/rules" responds with + """ + body: + items: + - name: '' + - name: demo-app_kuma-demo_svc_5000 + service: demo-app_kuma-demo_svc_5000 + tags: + kuma.io/service: demo-app_kuma-demo_svc_5000 + """ + + When I click the "$policies-tab" element + And I click the "$policy-item-button" element + + Then the "$policies-view" element contains "kuma.io/service:service-a" + + When I click the "$rule-item-button" element + + Then the "$policies-view" element contains "kuma.io/service:demo-app_kuma-demo_svc_5000" + + Scenario: Clusters tab has expected content + Given the URL "/meshes/default/dataplanes/dpp-1-name-of-dataplane/clusters" responds with + """ + body: + access_log_sink::observability_name::access_log_sink + access_log_sink::default_priority::max_connections::1024 + access_log_sink::default_priority::max_pending_requests::1024 + access_log_sink::default_priority::max_requests::1024 + """ + + When I click the "$clusters-tab" element + + Then the "$clusters-view" element contains "access_log_sink::observability_name::access_log_sink" diff --git a/features/mesh/dataplanes/DetailViewContent.feature b/features/mesh/dataplanes/DetailViewContent.feature deleted file mode 100644 index c432d1d4ca..0000000000 --- a/features/mesh/dataplanes/DetailViewContent.feature +++ /dev/null @@ -1,124 +0,0 @@ -Feature: Data Plane Proxies: Detail view content - Background: - Given the CSS selectors - | Alias | Selector | - | detail-view | [data-testid='data-plane-detail-tabs-view'] | - | warnings | [data-testid='data-plane-warnings'] | - | overview-tab | #data-plane-detail-view-tab a | - | overview-content | [data-testid='data-plane-detail-view'] | - | status-cds | $overview-content [data-testid='subscription-status-cds'] | - | status-eds | $overview-content [data-testid='subscription-status-eds'] | - | status-lds | $overview-content [data-testid='subscription-status-lds'] | - | status-rds | $overview-content [data-testid='subscription-status-rds'] | - | policies-tab | #data-plane-policies-view-tab a | - | policies-content | [data-testid='data-plane-policies-view'] | - | policy-list | [data-testid='policy-list'] | - | policy-list-item | $policy-list .accordion-item:nth-child(1) [data-testid='accordion-item-button'] | - | policy-list-item-button | $policy-list-item [data-testid='accordion-item-button'] | - | rule-list | [data-testid='rule-list'] | - | rule-list-item | $rule-list .accordion-item:nth-child(1) [data-testid='accordion-item-button'] | - | rule-list-item-button | $rule-list-item [data-testid='accordion-item-button'] | - | clusters-tab | #data-plane-clusters-view-tab a | - | clusters-content | [data-testid='data-plane-clusters-view'] | - And the environment - """ - KUMA_SUBSCRIPTION_COUNT: 2 - KUMA_DATAPLANEINBOUND_COUNT: 1 - KUMA_MODE: global - """ - And the URL "/meshes/default/dataplanes/dpp-1-name-of-dataplane/_overview" responds with - """ - body: - mesh: default - dataplane: - networking: - inbound: - - health: - ready: true - tags: - kuma.io/protocol: http - kuma.io/zone: zone-1 - dataplaneInsight: - subscriptions: - - controlPlaneInstanceId: 'dpp-1-cp-instance-id' - connectTime: 2021-02-17T07:33:36.412683Z - disconnectTime: 2021-02-17T07:33:36.412683Z - version: - kumaDp: - version: 1.0.7 - kumaCpCompatible: false - envoy: - kumaDpCompatible: false - - controlPlaneInstanceId: 'dpp-1-cp-instance-id' - connectTime: 2021-02-17T07:33:36.412683Z - disconnectTime: !!js/undefined - status: - total: - responsesSent: '12' - responsesAcknowledged: '10' - cds: - responsesSent: '2' - responsesAcknowledged: '1' - eds: - responsesSent: '4' - responsesAcknowledged: '3' - lds: - responsesSent: '6' - responsesAcknowledged: '6' - rds: {} - version: - kumaDp: - version: 1.0.8 - kumaCpCompatible: true - envoy: - kumaDpCompatible: true - """ - When I visit the "/meshes/default/data-planes/dpp-1-name-of-dataplane/overview" URL - - Scenario: Data Plane Proxy detail view has expected content - Then the page title contains "dpp-1-name-of-dataplane" - And the "$detail-view" element contains "dpp-1-name-of-dataplane" - - And the "$overview-content" element contains "online" - And the "$overview-content" element contains "kuma.io/protocol:http" - And the "$overview-content" element contains "kumaDp:1.0.8" - And the "$warnings" element doesn't exist - - Then the "$overview-content" element contains "Connected: Feb 17, 2021, 7:33 AM" - Then the "$overview-content" element contains "CP instance ID: dpp-1-cp-instance-id" - - When I click the ".accordion-item:nth-child(1) [data-testid='accordion-item-button']" element - - And the "$status-cds" element contains "CDS" - And the "$status-cds" element contains "1" - And the "$status-cds" element contains "2" - - And the "$status-eds" element contains "EDS" - And the "$status-eds" element contains "3" - And the "$status-eds" element contains "4" - - And the "$status-lds" element contains "LDS" - And the "$status-lds" element contains "6" - - And the "$status-rds" element contains "RDS" - And the "$status-rds" element contains "0" - - Scenario: Policies tab - When I click the "$policies-tab" element - And I click the "$policy-list-item" element - Then the "$policies-content" element contains "kuma.io/service:service-a" - - When I click the "$rule-list-item" element - Then the "$policies-content" element contains "kuma.io/service:demo-app_kuma-demo_svc_5000" - - Scenario: Envoy data - Given the URL "/meshes/default/dataplanes/dpp-1-name-of-dataplane/clusters" responds with - """ - body: - access_log_sink::observability_name::access_log_sink - access_log_sink::default_priority::max_connections::1024 - access_log_sink::default_priority::max_pending_requests::1024 - access_log_sink::default_priority::max_requests::1024 - """ - When I click the "$clusters-tab" element - Then the "$clusters-content" element contains "access_log_sink::observability_name::access_log_sink" diff --git a/src/app/common/TagList.vue b/src/app/common/TagList.vue index a1aaf58f3c..01d04dfdef 100644 --- a/src/app/common/TagList.vue +++ b/src/app/common/TagList.vue @@ -1,41 +1,34 @@ - - diff --git a/src/app/data-planes/components/DataPlaneSummary.vue b/src/app/data-planes/components/DataPlaneSummary.vue index 4fa5bd418f..f21c756622 100644 --- a/src/app/data-planes/components/DataPlaneSummary.vue +++ b/src/app/data-planes/components/DataPlaneSummary.vue @@ -24,40 +24,6 @@ - - - - - - - - - - - - - - - - - +
+

{{ t('data-planes.routes.item.gateway') }}

+ +
+
+ + + + + + + + + + + +
+
+
+ +
+

{{ t('data-planes.routes.item.inbounds') }}

+ +
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
@@ -100,9 +146,10 @@ import { computed } from 'vue' import DefinitionCard from '@/app/common/DefinitionCard.vue' import StatusBadge from '@/app/common/StatusBadge.vue' import TagList from '@/app/common/TagList.vue' +import TextWithCopyButton from '@/app/common/TextWithCopyButton.vue' import type { DataPlaneOverview } from '@/types/index.d' import { useI18n } from '@/utilities' -import { dpTags, getStatusAndReason, getVersions } from '@/utilities/dataplane' +import { getStatusAndReason } from '@/utilities/dataplane' const { t, formatIsoDate } = useI18n() @@ -111,8 +158,6 @@ const props = defineProps<{ }>() const statusWithReason = computed(() => getStatusAndReason(props.dataplaneOverview.dataplane, props.dataplaneOverview.dataplaneInsight)) -const dataPlaneTags = computed(() => dpTags(props.dataplaneOverview.dataplane)) -const dataPlaneVersions = computed(() => getVersions(props.dataplaneOverview.dataplaneInsight)) const lastUpdatedTime = computed(() => { const subscriptions = props.dataplaneOverview.dataplaneInsight?.subscriptions ?? [] @@ -137,4 +182,10 @@ const lastUpdatedTime = computed(() => { display: flex; align-items: center; } + +.inbound-list>*+* { + margin-block-start: $kui-space-60; + border-top: $kui-border-width-10 solid $kui-color-border; + padding-block-start: $kui-space-60; +} diff --git a/src/app/data-planes/components/PolicyTypeEntryList.spec.ts b/src/app/data-planes/components/PolicyTypeEntryList.spec.ts index 9d1392b690..5bba91c5b0 100644 --- a/src/app/data-planes/components/PolicyTypeEntryList.spec.ts +++ b/src/app/data-planes/components/PolicyTypeEntryList.spec.ts @@ -1,5 +1,5 @@ import { flushPromises, mount } from '@vue/test-utils' -import { describe, expect, test } from 'vitest' +import { beforeAll, describe, expect, test, vi } from 'vitest' import PolicyTypeEntryList from './PolicyTypeEntryList.vue' import { createPolicyTypeEntries } from '@/test-data/createPolicyTypeEntries' @@ -12,10 +12,26 @@ function renderComponent(props = {}) { policyTypeEntries, ...props, }, + global: { + stubs: { + RouterLink: { + template: '', + }, + }, + }, }) } describe('PolicyTypeEntryList', () => { + beforeAll(() => { + const ResizeObserverMock = vi.fn(() => ({ + observe: vi.fn(), + unobserve: vi.fn(), + disconnect: vi.fn(), + })) + vi.stubGlobal('ResizeObserver', ResizeObserverMock) + }) + test('works', async () => { const wrapper = renderComponent() diff --git a/src/app/data-planes/locales/en-us/index.yaml b/src/app/data-planes/locales/en-us/index.yaml index 059954a9f1..6475f78e02 100644 --- a/src/app/data-planes/locales/en-us/index.yaml +++ b/src/app/data-planes/locales/en-us/index.yaml @@ -17,9 +17,14 @@ data-planes: data-plane-clusters-view: 'Clusters' data-plane-config-view: 'YAML' overview: 'Overview' + gateway: 'Gateway' + inbounds: 'Inbounds' last_updated: 'Last updated' certificate_info: 'Certificate info' no_certificate: 'No certificate' + health: + ready: 'healthy' + not_ready: 'unhealthy' mtls: title: 'TLS' expiration_time: diff --git a/src/app/data-planes/views/DataPlaneDetailView.vue b/src/app/data-planes/views/DataPlaneDetailView.vue index 02d1572f9c..3f8bff05c9 100644 --- a/src/app/data-planes/views/DataPlaneDetailView.vue +++ b/src/app/data-planes/views/DataPlaneDetailView.vue @@ -8,13 +8,12 @@ v-if="warnings.length > 0" #notifications > -