fix: Fix formatting of custom resource sidebar items

- The titles should better handle being line wrapped

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 d51ccb5dd5
commit 86dcbb10c0
3 files changed
+41 -25

No files matched your search

@@ -3025,19 +3025,19 @@ exports[`cluster - custom resources in sidebar when custom resource exists when
class="SidebarItem"
data-is-active-test="false"
data-parent-id-test="sidebar-item-custom-resources"
data-testid="sidebar-item-custom-resource-group-some-group"
data-testid="sidebar-item-custom-resource-group-some.group.com"
>
<a
class="navItem"
data-testid="link-for-sidebar-item-custom-resource-group-some-group"
data-testid="link-for-sidebar-item-custom-resource-group-some.group.com"
href="/"
>
<span>
some-group
some​.group​.com
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-custom-resource-group-some-group"
data-testid="expand-icon-for-sidebar-item-custom-resource-group-some.group.com"
>
<span
class="icon"
@@ -3533,19 +3533,19 @@ exports[`cluster - custom resources in sidebar when custom resource exists when
class="SidebarItem"
data-is-active-test="false"
data-parent-id-test="sidebar-item-custom-resources"
data-testid="sidebar-item-custom-resource-group-some-group"
data-testid="sidebar-item-custom-resource-group-some.group.com"
>
<a
class="navItem"
data-testid="link-for-sidebar-item-custom-resource-group-some-group"
data-testid="link-for-sidebar-item-custom-resource-group-some.group.com"
href="/"
>
<span>
some-group
some​.group​.com
</span>
<i
class="Icon expandIcon material focusable"
data-testid="expand-icon-for-sidebar-item-custom-resource-group-some-group"
data-testid="expand-icon-for-sidebar-item-custom-resource-group-some.group.com"
>
<span
class="icon"
@@ -3561,16 +3561,16 @@ exports[`cluster - custom resources in sidebar when custom resource exists when
<div
class="SidebarItem"
data-is-active-test="false"
data-parent-id-test="sidebar-item-custom-resource-group-some-group"
data-testid="sidebar-item-custom-resource-group-some-group/some-resources"
data-parent-id-test="sidebar-item-custom-resource-group-some.group.com"
data-testid="sidebar-item-custom-resource-group-some.group.com/some-resources"
>
<a
class="navItem"
data-testid="link-for-sidebar-item-custom-resource-group-some-group/some-resources"
data-testid="link-for-sidebar-item-custom-resource-group-some.group.com/some-resources"
href="/"
>
<span>
SomeResource
Some Resource
</span>
</a>
</div>
@@ -32,7 +32,7 @@ describe("cluster - custom resources in sidebar", () => {
resourceVersion: "1",
},
spec: {
group: "some-group",
group: "some.group.com",
scope: "Cluster",
names: {
kind: "SomeResource",
@@ -92,7 +92,7 @@ describe("cluster - custom resources in sidebar", () => {
beforeEach(() => {
builder.allowKubeResource({
apiName: "some-resources",
group: "some-group",
group: "some.group.com",
});
});
@@ -109,7 +109,7 @@ describe("cluster - custom resources in sidebar", () => {
});
it("does not show SomeResources sidebar", () => {
expect(result.queryByTestId("sidebar-item-custom-resource-group-some-group")).not.toBeInTheDocument();
expect(result.queryByTestId("sidebar-item-custom-resource-group-some.group.com")).not.toBeInTheDocument();
});
it("does not show Custom Resources Definitions sidebar", () => {
@@ -133,8 +133,8 @@ describe("cluster - custom resources in sidebar", () => {
expect(result.getByTestId("expand-icon-for-sidebar-item-custom-resources")).toBeInTheDocument();
});
it("shows some-group group sidebar item", () => {
expect(result.getByTestId("sidebar-item-custom-resource-group-some-group")).toBeInTheDocument();
it("shows some.group.com group sidebar item", () => {
expect(result.getByTestId("sidebar-item-custom-resource-group-some.group.com")).toBeInTheDocument();
});
it("does not show Custom Resources Definitions sidebar", () => {
@@ -143,19 +143,29 @@ describe("cluster - custom resources in sidebar", () => {
describe("when custom resources group sidebar item is expanded", () => {
beforeEach(() => {
result.getByTestId("expand-icon-for-sidebar-item-custom-resource-group-some-group").click();
result.getByTestId("expand-icon-for-sidebar-item-custom-resource-group-some.group.com").click();
});
it("renders", () => {
expect(result.container).toMatchSnapshot();
});
it("shows some-group group sidebar item", () => {
expect(result.getByTestId("sidebar-item-custom-resource-group-some-group")).toBeInTheDocument();
it("shows some.group.com group sidebar item", () => {
expect(result.getByTestId("sidebar-item-custom-resource-group-some.group.com")).toBeInTheDocument();
});
it("formats the some.group.com sidebar item title correctly", () => {
expect(result.getByTestId("link-for-sidebar-item-custom-resource-group-some.group.com").firstChild).toHaveTextContent("some\u200b.group\u200b.com", {
normalizeWhitespace: false,
});
});
it("shows some-resources group sidebar item", () => {
expect(result.getByTestId("sidebar-item-custom-resource-group-some-group/some-resources")).toBeInTheDocument();
expect(result.getByTestId("sidebar-item-custom-resource-group-some.group.com/some-resources")).toBeInTheDocument();
});
it("formats the some-resources sidebar item title correctly", () => {
expect(result.getByTestId("sidebar-item-custom-resource-group-some.group.com/some-resources")).toHaveTextContent("Some Resource");
});
});
});
@@ -182,7 +192,7 @@ describe("cluster - custom resources in sidebar", () => {
});
it("does not show SomeResources sidebar", () => {
expect(result.queryByTestId("sidebar-item-custom-resource-group-some-group")).not.toBeInTheDocument();
expect(result.queryByTestId("sidebar-item-custom-resource-group-some.group.com")).not.toBeInTheDocument();
});
it("does not show Custom Resources Definitions sidebar", () => {
@@ -207,7 +217,7 @@ describe("cluster - custom resources in sidebar", () => {
});
it("does not show SomeResources sidebar", () => {
expect(result.queryByTestId("sidebar-item-custom-resource-group-some-group")).not.toBeInTheDocument();
expect(result.queryByTestId("sidebar-item-custom-resource-group-some.group.com")).not.toBeInTheDocument();
});
it("shows Custom Resources Definitions sidebar", () => {