diff --git a/hermes-console-vue/src/api/inconsistent-group.ts b/hermes-console-vue/src/api/inconsistent-group.ts index 7ee039677b..7f27d1d4f1 100644 --- a/hermes-console-vue/src/api/inconsistent-group.ts +++ b/hermes-console-vue/src/api/inconsistent-group.ts @@ -17,5 +17,5 @@ export interface InconsistentSubscription { export interface InconsistentMedata { datacenter: string; - content: string | undefined; + content?: string; } diff --git a/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupListing.spec.ts b/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupListing.spec.ts index 872b65a9fc..0a6d135874 100644 --- a/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupListing.spec.ts +++ b/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupListing.spec.ts @@ -10,21 +10,32 @@ describe('InconsistentGroupListing', () => { setActivePinia(createPinia()); }); - it('should render inconsistent groups table', async () => { - // given - const group = 'pl.allegro.public.group'; + it.each([ + [null, 1], + ['pl.allegro.public.group', 1], + ['PL.ALLEGRO.PUBLIC.GROUP', 1], + ['public', 1], + ['Public', 1], + ['pl.allegro.internal.group', 0], + ['FOO', 0], + ])( + 'should render inconsistent groups table with filter applied (case-insensitive, filter: %s)', + async (filter: string | null, expectedGroups: number) => { + // given + const group = 'pl.allegro.public.group'; - // when - const { getByText } = render(InconsistentGroupsListing, { - props: { - filter: null, - inconsistentGroups: dummyGroupInconsistency, - }, - }); + // when + const { queryAllByText } = render(InconsistentGroupsListing, { + props: { + filter, + inconsistentGroups: dummyGroupInconsistency, + }, + }); - // then - expect(getByText(group)).toBeVisible(); - }); + // then + expect(queryAllByText(group).length).toBe(expectedGroups); + }, + ); it('should render empty groups table', async () => { //given diff --git a/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupsListing.vue b/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupsListing.vue index 352e2a58a8..0b1f5d846f 100644 --- a/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupsListing.vue +++ b/hermes-console-vue/src/views/admin/consistency/inconsistent-groups-listing/InconsistentGroupsListing.vue @@ -14,7 +14,9 @@ const filteredGroups = computed(() => { return props.inconsistentGroups.filter( - (group) => !props.filter || group.name.includes(props.filter), + (group) => + !props.filter || + group.name.toLowerCase().includes(props.filter.toLowerCase()), ); }); diff --git a/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.spec.ts b/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.spec.ts index 89841f9a02..653549e9e6 100644 --- a/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.spec.ts +++ b/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.spec.ts @@ -25,26 +25,29 @@ describe('ConstraintsListing', () => { }); }); - it('should render inconsistent topics listing with a filter applied', () => { - // given - const props = { - inconsistentTopics: dummyInconsistentTopics, - filter: 'Dummy', - }; + it.each(['dummy', 'Dummy', 'DUMMY'])( + 'should render inconsistent topics listing with a filter applied (case-insensitive, filter: %s)', + (filter: string) => { + // given + const props = { + inconsistentTopics: dummyInconsistentTopics, + filter, + }; - // when - const inconsistentTopic = render(InconsistentTopicsListing, { props }) - .getAllByText(/Dummy/) - .map((inconsistentTopic) => inconsistentTopic.closest('tr')); + // when + const inconsistentTopic = render(InconsistentTopicsListing, { props }) + .getAllByText(/Dummy/) + .map((inconsistentTopic) => inconsistentTopic.closest('tr')); - // then - expect(inconsistentTopic).toHaveLength(1); - expect( - within(inconsistentTopic[0]!).getByText( - 'consistency.inconsistentTopics.actions.delete', - ), - ).toBeVisible(); - }); + // then + expect(inconsistentTopic).toHaveLength(1); + expect( + within(inconsistentTopic[0]!).getByText( + 'consistency.inconsistentTopics.actions.delete', + ), + ).toBeVisible(); + }, + ); it('should render inconsistent topics listing with a filter applied (no results)', () => { // given diff --git a/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.vue b/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.vue index 73ccfaf4fc..704cbd098a 100644 --- a/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.vue +++ b/hermes-console-vue/src/views/admin/consistency/inconsistent-topics-listing/InconsistentTopicsListing.vue @@ -10,7 +10,9 @@ const filteredTopics = computed(() => { return props.inconsistentTopics.filter( - (topic) => !props.filter || topic.includes(props.filter), + (topic) => + !props.filter || + topic.toLowerCase().includes(props.filter.toLowerCase()), ); }); diff --git a/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.spec.ts b/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.spec.ts index 806ef6972f..8042c80f13 100644 --- a/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.spec.ts +++ b/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.spec.ts @@ -10,8 +10,6 @@ describe('ConstraintsListing', () => { // given const props = { constraints: dummyConstraints.topicConstraints, - upsertConstraint: () => {}, - deleteConstraint: () => {}, }; // when @@ -35,8 +33,6 @@ describe('ConstraintsListing', () => { // given const props = { constraints: dummyConstraints.subscriptionConstraints, - upsertConstraint: () => {}, - deleteConstraint: () => {}, }; // when @@ -56,34 +52,33 @@ describe('ConstraintsListing', () => { ); }); - it('should render constraints listing with a filter applied', () => { - // given - const props = { - constraints: dummyConstraints.topicConstraints, - filter: 'pl.group.Topic1', - upsertConstraint: () => {}, - deleteConstraint: () => {}, - }; - - // when - const constraints = render(ConstraintsListing, { props }) - .getAllByText(/pl\.group\.Topic1/) - .map((constraint) => constraint.closest('tr')); - - // then - expect(constraints).toHaveLength(1); - expect( - within(constraints[0]!).getByText(/consumersNumberChip 2/), - ).toBeVisible(); - }); + it.each(['pl.group.Topic1', 'pl.group.topic1', 'PL.GROUP.TOPIC1'])( + 'should render constraints listing with a filter applied (case-insensitive, filter: %s)', + (filter: string) => { + // given + const props = { + constraints: dummyConstraints.topicConstraints, + filter, + }; + + // when + const constraints = render(ConstraintsListing, { props }) + .getAllByText(/pl\.group\.Topic1/) + .map((constraint) => constraint.closest('tr')); + + // then + expect(constraints).toHaveLength(1); + expect( + within(constraints[0]!).getByText(/consumersNumberChip 2/), + ).toBeVisible(); + }, + ); it('should render constraints listing with a filter applied (no results)', () => { // given const props = { constraints: dummyConstraints.topicConstraints, filter: 'pl.group.NoExistingTopic', - upsertConstraint: () => {}, - deleteConstraint: () => {}, }; // when @@ -130,8 +125,6 @@ describe('ConstraintsListing', () => { const props = { constraints: dummyConstraints.topicConstraints, - upsertConstraint: () => {}, - deleteConstraint: () => {}, }; const { queryByText, getByText } = render(ConstraintsListing, { props }); @@ -150,8 +143,6 @@ describe('ConstraintsListing', () => { const props = { constraints: dummyConstraints.subscriptionConstraints, - upsertConstraint: () => {}, - deleteConstraint: () => {}, }; const { queryByText, getByText } = render(ConstraintsListing, { props }); diff --git a/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.vue b/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.vue index b1cfe6f77a..1f438ae147 100644 --- a/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.vue +++ b/hermes-console-vue/src/views/admin/constraints/constraints-listing/ConstraintsListing.vue @@ -18,7 +18,9 @@ const filteredConstraints = computed(() => Object.fromEntries( Object.entries(props.constraints).filter( - ([name]) => !props.filter || name.indexOf(props.filter) !== -1, + ([name]) => + !props.filter || + name.toLowerCase().includes(props.filter.toLowerCase()), ), ), ); diff --git a/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.spec.ts b/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.spec.ts index 94026953f6..3ea064e024 100644 --- a/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.spec.ts +++ b/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.spec.ts @@ -29,21 +29,24 @@ describe('FavoriteSubscriptionsListing', () => { }); }); - it('should render listing with a filter applied', () => { - // given - const props = { - subscriptions: dummySubscriptions, - filter: 'fo', - }; - - // when - const subscriptions = render(FavoriteSubscriptionsListing, { props }) - .getAllByText(/foo/) - .map((subscription) => subscription.closest('tr')); - - // then - expect(subscriptions).toHaveLength(1); - }); + it.each(['fo', 'Fo', 'FO'])( + 'should render listing with a filter applied (case-insensitive, filter: %s)', + (filter: string) => { + // given + const props = { + subscriptions: dummySubscriptions, + filter, + }; + + // when + const subscriptions = render(FavoriteSubscriptionsListing, { props }) + .getAllByText(/foo/) + .map((subscription) => subscription.closest('tr')); + + // then + expect(subscriptions).toHaveLength(1); + }, + ); it('should render listing with a filter applied (no results)', () => { // given diff --git a/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.vue b/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.vue index 07398a0ab1..9dfb9e5024 100644 --- a/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.vue +++ b/hermes-console-vue/src/views/favorite/subscriptions/subscription-listing/FavoriteSubscriptionsListing.vue @@ -18,7 +18,9 @@ const filteredSubscriptions = computed(() => { return (props.subscriptions ?? []).filter( - (subscription) => !props.filter || subscription.includes(props.filter), + (subscription) => + !props.filter || + subscription.toLowerCase().includes(props.filter.toLowerCase()), ); }); diff --git a/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.spec.ts b/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.spec.ts index d9c03e130d..c26bf51b91 100644 --- a/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.spec.ts +++ b/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.spec.ts @@ -27,21 +27,24 @@ describe('FavoriteTopicsListing', () => { }); }); - it('should render listing with a filter applied', () => { - // given - const props = { - topics: dummyTopics, - filter: 'fo', - }; - - // when - const topics = render(FavoriteTopicsListing, { props }) - .getAllByText(/foobarEventV1/) - .map((topic) => topic.closest('tr')); - - // then - expect(topics).toHaveLength(1); - }); + it.each(['fo', 'Fo', 'FO'])( + 'should render listing with a filter applied (case-insensitive, %s)', + (filter: string) => { + // given + const props = { + topics: dummyTopics, + filter, + }; + + // when + const topics = render(FavoriteTopicsListing, { props }) + .getAllByText(/foobarEventV1/) + .map((topic) => topic.closest('tr')); + + // then + expect(topics).toHaveLength(1); + }, + ); it('should render listing with a filter applied (no results)', () => { // given diff --git a/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.vue b/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.vue index 4b04758010..6870854186 100644 --- a/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.vue +++ b/hermes-console-vue/src/views/favorite/topics/topic-listing/FavoriteTopicsListing.vue @@ -17,7 +17,9 @@ const filteredTopics = computed(() => { return (props.topics ?? []).filter( - (topic) => !props.filter || topic.includes(props.filter), + (topic) => + !props.filter || + topic.toLowerCase().includes(props.filter.toLowerCase()), ); }); diff --git a/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.spec.ts b/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.spec.ts index 093ce7c0d0..8d9bb47c3b 100644 --- a/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.spec.ts +++ b/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.spec.ts @@ -21,21 +21,24 @@ describe('GroupTopicsListing', () => { }); }); - it('should render group topics listing with a filter applied', () => { - // given - const props = { - group: dummyGroup, - filter: 'V1', - }; + it.each(['v1', 'V1', 'productevent', 'ProductEvent', 'PRODUCTEVENT'])( + 'should render group topics listing with a filter applied (case-insensitive, filter: %s)', + (filter: string) => { + // given + const props = { + group: dummyGroup, + filter, + }; - // when - const topics = render(GroupTopicsListing, { props }) - .getAllByText(/ProductEventV1/) - .map((topic) => topic.closest('tr')); + // when + const topics = render(GroupTopicsListing, { props }) + .getAllByText(/ProductEventV1/) + .map((topic) => topic.closest('tr')); - // then - expect(topics).toHaveLength(1); - }); + // then + expect(topics).toHaveLength(1); + }, + ); it('should render group topics listing with a filter applied (no results)', () => { // given diff --git a/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.vue b/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.vue index 55445cb056..6ed86677cd 100644 --- a/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.vue +++ b/hermes-console-vue/src/views/group-topics/group-topics-listing/GroupTopicsListing.vue @@ -14,7 +14,9 @@ const filteredTopics = computed(() => { return (props.group?.topics ?? []).filter( - (topic) => !props.filter || topic.includes(props.filter), + (topic) => + !props.filter || + topic.toLowerCase().includes(props.filter.toLowerCase()), ); }); diff --git a/hermes-console-vue/src/views/groups/group-listing/GroupListing.spec.ts b/hermes-console-vue/src/views/groups/group-listing/GroupListing.spec.ts index 9dd1b51157..09add2df22 100644 --- a/hermes-console-vue/src/views/groups/group-listing/GroupListing.spec.ts +++ b/hermes-console-vue/src/views/groups/group-listing/GroupListing.spec.ts @@ -26,23 +26,26 @@ describe('GroupListing', () => { }); }); - it('should render group listing with a filter applied', () => { - // given - const props = { - groups: dummyGroups, - filter: 'pl.allegro.offer', - }; + it.each(['pl.allegro.offer', 'PL.ALLEGRO.OFFER', 'Pl.Allegro.Offer'])( + 'should render group listing with a filter applied (case-insensitive, filter: %s)', + (filter: string) => { + // given + const props = { + groups: dummyGroups, + filter, + }; - // when - const groups = render(GroupListing, { props }) - .getAllByText(/pl\.allegro\.offer/) - .map((group) => group.closest('tr')); + // when + const groups = render(GroupListing, { props }) + .getAllByText(/pl\.allegro\.offer/) + .map((group) => group.closest('tr')); - // then - expect(groups).toHaveLength(2); - expect(within(groups[0]!).getByText(/topicsChip 1/)).toBeInTheDocument(); - expect(within(groups[1]!).getByText(/topicsChip 2/)).toBeInTheDocument(); - }); + // then + expect(groups).toHaveLength(2); + expect(within(groups[0]!).getByText(/topicsChip 1/)).toBeInTheDocument(); + expect(within(groups[1]!).getByText(/topicsChip 2/)).toBeInTheDocument(); + }, + ); it('should render group listing with a filter applied (no results)', () => { // given diff --git a/hermes-console-vue/src/views/groups/group-listing/GroupListing.vue b/hermes-console-vue/src/views/groups/group-listing/GroupListing.vue index 98f3e8f778..c4fe18bd2c 100644 --- a/hermes-console-vue/src/views/groups/group-listing/GroupListing.vue +++ b/hermes-console-vue/src/views/groups/group-listing/GroupListing.vue @@ -14,7 +14,9 @@ const filteredGroups = computed(() => { return (props.groups ?? []).filter( - (group) => !props.filter || group.name.includes(props.filter), + (group) => + !props.filter || + group.name.toLowerCase().includes(props.filter.toLowerCase()), ); }); diff --git a/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.spec.ts b/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.spec.ts index d8f5f7fa8f..4bd8dcfd66 100644 --- a/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.spec.ts +++ b/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.spec.ts @@ -99,4 +99,34 @@ describe('SubscriptionsList', () => { ).toBeInTheDocument(); expect(getByText('subscriptionForm.actions.create')).toBeInTheDocument(); }); + + it.each(['foobar', 'FOOBAR', 'FooBar'])( + 'should render subscription list and apply a filter (case-insensitive, filter: %s)', + async (filter: string) => { + // given + const { getByText, getByLabelText, queryByText } = render( + SubscriptionsList, + { + props, + }, + ); + + // when + await fireEvent.click(getByText('topicView.subscriptions.title (2)')); + + // then + expect(queryByText('foobar-service')).toBeInTheDocument(); + expect(queryByText('bazbar-service')).toBeInTheDocument(); + + // when + await fireEvent.update( + getByLabelText('topicView.subscriptions.search'), + filter, + ); + + // then + expect(queryByText('foobar-service')).toBeInTheDocument(); + expect(queryByText('bazbar-service')).not.toBeInTheDocument(); + }, + ); }); diff --git a/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.vue b/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.vue index d43d615a97..43b4f0b1f2 100644 --- a/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.vue +++ b/hermes-console-vue/src/views/topic/subscriptions-list/SubscriptionsList.vue @@ -25,27 +25,30 @@ const subscriptionItems = computed(() => props.subscriptions + ?.filter((subscription) => + subscription.name.toLowerCase().includes(filter.value.toLowerCase()), + ) ?.map((subscription) => { const currentUrl = window.location.href; - if (subscription.name.toLowerCase().includes(filter.value)) { - return { - name: subscription.name, - color: statusTextColor[subscription.state], - statusText: subscription.state, - href: `${currentUrl}/subscriptions/${subscription.name}`, - }; - } - return null; - }) - .filter(Boolean), + return { + name: subscription.name, + color: statusTextColor[subscription.state], + statusText: subscription.state, + href: `${currentUrl}/subscriptions/${subscription.name}`, + }; + }), ); + const showSubscriptionCreationForm = ref(false); + function showSubscriptionForm() { showSubscriptionCreationForm.value = true; } + function hideSubscriptionForm() { showSubscriptionCreationForm.value = false; } + function pushToSubscription(subscription: string) { router.push({ path: `/ui/groups/${props.groupId}/topics/${props.topicName}/subscriptions/${subscription}`, @@ -111,9 +114,9 @@ > {{ subscription.name }} diff --git a/hermes-console-vue/tsconfig.app.json b/hermes-console-vue/tsconfig.app.json index ef6bcc95a7..0d09815a87 100644 --- a/hermes-console-vue/tsconfig.app.json +++ b/hermes-console-vue/tsconfig.app.json @@ -16,6 +16,7 @@ "types": [ "node", "jsdom", + "jest", "vitest/globals", "@testing-library/jest-dom" ] diff --git a/hermes-console-vue/tsconfig.vitest.json b/hermes-console-vue/tsconfig.vitest.json index 55a23f55b5..a007f270d4 100644 --- a/hermes-console-vue/tsconfig.vitest.json +++ b/hermes-console-vue/tsconfig.vitest.json @@ -7,6 +7,7 @@ "types": [ "node", "jsdom", + "jest", "vitest/globals", "@testing-library/jest-dom" ]