chore: Fixup tests snapshots to match new testid behaviour

- Move order-of-sidebar-items to the new package
- Fix the extension sidebar item registrator

Signed-off-by: Sebastian Malton <sebastian@malton.name>
This commit is contained in:
Sebastian Malton authored and Gabriel Accettola committed 2023-05-23 10:46:02 +02:00
1 parent 81293304a7
commit e6bef1a168
35 files changed
+1409 -16774

No files matched your search

@@ -8,7 +8,7 @@ import { extensionRegistratorInjectionToken } from "../../../extensions/extensio
import { sidebarItemInjectionToken } from "@k8slens/cluster-sidebar";
import { computed } from "mobx";
import routesInjectable from "../../routes/routes.injectable";
import { matches, noop } from "lodash/fp";
import { matches } from "lodash/fp";
import routeIsActiveInjectable from "../../routes/route-is-active.injectable";
import { navigateToRouteInjectionToken } from "../../../common/front-end-routing/navigate-to-route-injection-token";
import { getExtensionRoutePath } from "../../routes/for-extension";
@@ -23,66 +23,55 @@ const extensionSidebarItemRegistratorInjectable = getInjectable({
const navigateToRoute = di.inject(navigateToRouteInjectionToken);
const routes = di.inject(routesInjectable);
const extensionShouldBeEnabledForClusterFrame = di.inject(extensionShouldBeEnabledForClusterFrameInjectable, extension);
const extensionRoutes = computed(() => routes.get().filter(matches({ extension })));
return computed(() => {
const extensionRoutes = routes.get().filter(matches({ extension }));
return computed(() => extension.clusterPageMenus.map((registration) => {
const {
components,
title,
orderNumber = 9999,
parentId: rawParentId,
visible,
id: rawId,
target,
} = registration;
const id = rawId
? `sidebar-item-${extension.sanitizedExtensionId}-${rawId}`
: `sidebar-item-${extension.sanitizedExtensionId}`;
const parentId = rawParentId
? `sidebar-item-${extension.sanitizedExtensionId}-${rawParentId}`
: null;
const targetRoutePath = getExtensionRoutePath(extension, target?.pageId);
const targetRoute = computed(() => extensionRoutes.get().find(matches({ path: targetRoutePath })));
return extension.clusterPageMenus.map((registration) => {
const targetRoutePath = getExtensionRoutePath(
extension,
registration.target?.pageId,
);
return getInjectable({
id,
instantiate: () => ({
orderNumber,
parentId,
isVisible: computed(() => extensionShouldBeEnabledForClusterFrame.value.get() && (visible?.get() ?? true)),
title,
getIcon: () => (components.Icon && <components.Icon />),
onClick: () => {
const route = targetRoute.get();
const targetRoute = extensionRoutes.find(
matches({ path: targetRoutePath }),
);
if (route) {
navigateToRoute(route);
}
},
isActive: computed(() => {
const route = targetRoute.get();
const isVisible = computed(() => {
if (!extensionShouldBeEnabledForClusterFrame.value.get()) {
return false;
}
if (!route) {
return false;
}
if (!registration.visible) {
return true;
}
return registration.visible.get();
});
const id = registration.id ?
`${extension.sanitizedExtensionId}-${registration.id}`
: extension.sanitizedExtensionId;
return getInjectable({
id: `sidebar-item-${id}`,
instantiate: () => ({
orderNumber: registration.orderNumber ?? 9999,
parentId: registration.parentId
? `${extension.sanitizedExtensionId}-${registration.parentId}`
: null,
isVisible,
title: registration.title,
getIcon: registration.components.Icon
? () => <registration.components.Icon />
: undefined,
...(targetRoute
? {
onClick: () => navigateToRoute(targetRoute),
isActive: di.inject(
routeIsActiveInjectable,
targetRoute,
),
}
: { onClick: noop }),
return di.inject(routeIsActiveInjectable, route).get();
}),
injectionToken: sidebarItemInjectionToken,
});
}),
injectionToken: sidebarItemInjectionToken,
});
});
}));
},
injectionToken: extensionRegistratorInjectionToken,
@@ -82,7 +82,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
<a
aria-current="page"
class="navItem active"
data-testid="sidebar-item-link-for-cluster-overview"
data-testid="link-for-sidebar-item-cluster-overview"
href="/"
>
<i
@@ -104,7 +104,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-nodes"
data-testid="link-for-sidebar-item-nodes"
href="/"
>
<i
@@ -126,7 +126,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-workloads"
data-testid="link-for-sidebar-item-workloads"
href="/"
>
<i
@@ -141,6 +141,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-workloads"
>
<span
class="icon"
@@ -151,31 +152,6 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-config"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-config"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="list"
>
list
</span>
</i>
<span>
Config
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
@@ -183,7 +159,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-network"
data-testid="link-for-sidebar-item-network"
href="/"
>
<i
@@ -201,6 +177,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-network"
>
<span
class="icon"
@@ -211,31 +188,6 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-storage"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-storage"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="storage"
>
storage
</span>
</i>
<span>
Storage
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
@@ -243,7 +195,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-namespaces"
data-testid="link-for-sidebar-item-namespaces"
href="/"
>
<i
@@ -268,7 +220,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-helm"
data-testid="link-for-sidebar-item-helm"
href="/"
>
<i
@@ -283,66 +235,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</span>
<i
class="Icon expandIcon material focusable"
>
<span
class="icon"
data-icon-name="keyboard_arrow_down"
>
keyboard_arrow_down
</span>
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-user-management"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-user-management"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="security"
>
security
</span>
</i>
<span>
Access Control
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-custom-resources"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-custom-resources"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="extension"
>
extension
</span>
</i>
<span>
Custom Resources
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-helm"
>
<span
class="icon"
@@ -586,7 +479,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
<a
aria-current="page"
class="navItem active"
data-testid="sidebar-item-link-for-cluster-overview"
data-testid="link-for-sidebar-item-cluster-overview"
href="/"
>
<i
@@ -608,7 +501,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-nodes"
data-testid="link-for-sidebar-item-nodes"
href="/"
>
<i
@@ -630,7 +523,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-workloads"
data-testid="link-for-sidebar-item-workloads"
href="/"
>
<i
@@ -645,6 +538,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-workloads"
>
<span
class="icon"
@@ -655,31 +549,6 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-config"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-config"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="list"
>
list
</span>
</i>
<span>
Config
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
@@ -687,7 +556,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-network"
data-testid="link-for-sidebar-item-network"
href="/"
>
<i
@@ -705,6 +574,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-network"
>
<span
class="icon"
@@ -715,31 +585,6 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-storage"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-storage"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="storage"
>
storage
</span>
</i>
<span>
Storage
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
@@ -747,7 +592,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-namespaces"
data-testid="link-for-sidebar-item-namespaces"
href="/"
>
<i
@@ -772,7 +617,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
>
<a
class="navItem"
data-testid="sidebar-item-link-for-helm"
data-testid="link-for-sidebar-item-helm"
href="/"
>
<i
@@ -787,66 +632,7 @@ exports[`<ClusterFrame /> given cluster with list nodes and namespaces permissio
</span>
<i
class="Icon expandIcon material focusable"
>
<span
class="icon"
data-icon-name="keyboard_arrow_down"
>
keyboard_arrow_down
</span>
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-user-management"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-user-management"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="security"
>
security
</span>
</i>
<span>
Access Control
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-custom-resources"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-custom-resources"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="extension"
>
extension
</span>
</i>
<span>
Custom Resources
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-helm"
>
<span
class="icon"
@@ -1097,7 +883,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
<a
aria-current="page"
class="navItem active"
data-testid="sidebar-item-link-for-workloads"
data-testid="link-for-sidebar-item-workloads"
href="/"
>
<i
@@ -1112,6 +898,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-workloads"
>
<span
class="icon"
@@ -1122,31 +909,6 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-config"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-config"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="list"
>
list
</span>
</i>
<span>
Config
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
@@ -1154,7 +916,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
>
<a
class="navItem"
data-testid="sidebar-item-link-for-network"
data-testid="link-for-sidebar-item-network"
href="/"
>
<i
@@ -1172,6 +934,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-network"
>
<span
class="icon"
@@ -1182,31 +945,6 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-storage"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-storage"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="storage"
>
storage
</span>
</i>
<span>
Storage
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
@@ -1214,7 +952,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
>
<a
class="navItem"
data-testid="sidebar-item-link-for-namespaces"
data-testid="link-for-sidebar-item-namespaces"
href="/"
>
<i
@@ -1239,7 +977,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
>
<a
class="navItem"
data-testid="sidebar-item-link-for-helm"
data-testid="link-for-sidebar-item-helm"
href="/"
>
<i
@@ -1254,66 +992,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
</span>
<i
class="Icon expandIcon material focusable"
>
<span
class="icon"
data-icon-name="keyboard_arrow_down"
>
keyboard_arrow_down
</span>
</i>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-user-management"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-user-management"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="security"
>
security
</span>
</i>
<span>
Access Control
</span>
</a>
</div>
<div
class="SidebarItem"
data-is-active-test="false"
data-testid="sidebar-item-custom-resources"
>
<a
class="navItem"
data-testid="sidebar-item-link-for-custom-resources"
href="/"
>
<i
class="Icon material focusable"
>
<span
class="icon"
data-icon-name="extension"
>
extension
</span>
</i>
<span>
Custom Resources
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-helm"
>
<span
class="icon"
@@ -1343,7 +1022,7 @@ exports[`<ClusterFrame /> given cluster without list nodes, but with namespaces
<div
class="Tab flex gaps align-center active"
data-is-active-test="true"
data-testid="tab-link-for-overview"
data-testid="tab-link-for-sidebar-item-workloads-overview"
role="tab"
tabindex="0"
>
@@ -14,13 +14,10 @@ const routeIsActiveInjectable = getInjectable({
instantiate: (di, route: Route<unknown>) => {
const currentPath = di.inject(currentPathInjectable);
return computed(
() =>
!!matchPath(currentPath.get(), {
path: route.path,
exact: true,
}),
);
return computed(() => !!matchPath(currentPath.get(), {
path: route.path,
exact: true,
}));
},
lifecycle: lifecycleEnum.keyedSingleton({