From ad2c7dd1e8ff171eab00b81406304507fc1241d5 Mon Sep 17 00:00:00 2001
From: Sebastian Malton <sebastian@malton.name>
Date: Mon, 30 May 2022 10:56:12 -0400
Subject: [PATCH] Fix tests, remove custom testid prop

Signed-off-by: Sebastian Malton <sebastian@malton.name>
---
 package.json                                                | 3 +++
 src/jest-after-env.setup.ts                                 | 5 +++++
 .../variants/__tests__/__snapshots__/ceph-fs.test.tsx.snap  | 6 +++---
 .../details/volumes/variants/__tests__/ceph-fs.test.tsx     | 6 +++---
 .../+workloads-pods/details/volumes/variants/ceph-fs.tsx    | 2 +-
 src/renderer/components/drawer/drawer-item.tsx              | 4 +---
 6 files changed, 16 insertions(+), 10 deletions(-)
 create mode 100644 src/jest-after-env.setup.ts

diff --git a/package.json b/package.json
index 610ee7d886..9b4896ae81 100644
--- a/package.json
+++ b/package.json
@@ -72,6 +72,9 @@
       "<rootDir>/src/jest.setup.ts",
       "jest-canvas-mock"
     ],
+    "setupFilesAfterEnv": [
+      "<rootDir>/src/jest-after-env.setup.ts"
+    ],
     "globals": {
       "ts-jest": {
         "isolatedModules": true
diff --git a/src/jest-after-env.setup.ts b/src/jest-after-env.setup.ts
new file mode 100644
index 0000000000..b9ee36c4cf
--- /dev/null
+++ b/src/jest-after-env.setup.ts
@@ -0,0 +1,5 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import "@testing-library/jest-dom/extend-expect";
diff --git a/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/__snapshots__/ceph-fs.test.tsx.snap b/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/__snapshots__/ceph-fs.test.tsx.snap
index 56eea3f7c3..627b2fb1a3 100644
--- a/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/__snapshots__/ceph-fs.test.tsx.snap
+++ b/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/__snapshots__/ceph-fs.test.tsx.snap
@@ -60,6 +60,7 @@ exports[`<CephFs /> should render 'false' for Readonly when false is provided 1`
   </div>
   <div
     class="DrawerItem"
+    data-testid="cephfs-readonly"
   >
     <span
       class="name"
@@ -68,7 +69,6 @@ exports[`<CephFs /> should render 'false' for Readonly when false is provided 1`
     </span>
     <span
       class="value"
-      data-testid="cephfs-readonly"
     >
       false
     </span>
@@ -136,6 +136,7 @@ exports[`<CephFs /> should render 'false' for Readonly when not provided 1`] = `
   </div>
   <div
     class="DrawerItem"
+    data-testid="cephfs-readonly"
   >
     <span
       class="name"
@@ -144,7 +145,6 @@ exports[`<CephFs /> should render 'false' for Readonly when not provided 1`] = `
     </span>
     <span
       class="value"
-      data-testid="cephfs-readonly"
     >
       false
     </span>
@@ -212,6 +212,7 @@ exports[`<CephFs /> should render 'true' for Readonly when true is provided 1`]
   </div>
   <div
     class="DrawerItem"
+    data-testid="cephfs-readonly"
   >
     <span
       class="name"
@@ -220,7 +221,6 @@ exports[`<CephFs /> should render 'true' for Readonly when true is provided 1`]
     </span>
     <span
       class="value"
-      data-testid="cephfs-readonly"
     >
       true
     </span>
diff --git a/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/ceph-fs.test.tsx b/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/ceph-fs.test.tsx
index ce3ef3c1b5..5555332328 100644
--- a/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/ceph-fs.test.tsx
+++ b/src/renderer/components/+workloads-pods/details/volumes/variants/__tests__/ceph-fs.test.tsx
@@ -41,7 +41,7 @@ describe("<CephFs />", () => {
     ));
 
     expect(result.container).toMatchSnapshot();
-    expect(result.getByTestId("cephfs-readonly").innerHTML).toBe("false");
+    expect(result.getByTestId("cephfs-readonly")).toHaveTextContent("false");
   });
 
   it("should render 'false' for Readonly when false is provided", () => {
@@ -76,7 +76,7 @@ describe("<CephFs />", () => {
     ));
 
     expect(result.container).toMatchSnapshot();
-    expect(result.getByTestId("cephfs-readonly").innerHTML).toBe("false");
+    expect(result.getByTestId("cephfs-readonly")).toHaveTextContent("false");
   });
 
   it("should render 'true' for Readonly when true is provided", () => {
@@ -111,6 +111,6 @@ describe("<CephFs />", () => {
     ));
 
     expect(result.container).toMatchSnapshot();
-    expect(result.getByTestId("cephfs-readonly").innerHTML).toBe("true");
+    expect(result.getByTestId("cephfs-readonly")).toHaveTextContent("true");
   });
 });
diff --git a/src/renderer/components/+workloads-pods/details/volumes/variants/ceph-fs.tsx b/src/renderer/components/+workloads-pods/details/volumes/variants/ceph-fs.tsx
index 4367269eb4..a723f7be92 100644
--- a/src/renderer/components/+workloads-pods/details/volumes/variants/ceph-fs.tsx
+++ b/src/renderer/components/+workloads-pods/details/volumes/variants/ceph-fs.tsx
@@ -39,7 +39,7 @@ export const CephFs: VolumeVariantComponent<"cephfs"> = (
             </DrawerItem>
           )
       }
-      <DrawerItem name="Readonly" valueTestId="cephfs-readonly">
+      <DrawerItem name="Readonly" data-testid="cephfs-readonly">
         {readOnly.toString()}
       </DrawerItem>
     </>
diff --git a/src/renderer/components/drawer/drawer-item.tsx b/src/renderer/components/drawer/drawer-item.tsx
index 68d1b350a4..737749f783 100644
--- a/src/renderer/components/drawer/drawer-item.tsx
+++ b/src/renderer/components/drawer/drawer-item.tsx
@@ -13,7 +13,6 @@ export interface DrawerItemProps extends React.HTMLAttributes<HTMLDivElement> {
   labelsOnly?: boolean;
   hidden?: boolean;
   renderBoolean?: boolean; // show "true" or "false" for all of the children elements are "typeof boolean"
-  valueTestId?: string;
 }
 
 export function DrawerItem({
@@ -24,7 +23,6 @@ export function DrawerItem({
   hidden = false,
   className,
   renderBoolean,
-  valueTestId,
   ...elemProps
 }: DrawerItemProps) {
   if (hidden) {
@@ -38,7 +36,7 @@ export function DrawerItem({
       title={title}
     >
       <span className="name">{name}</span>
-      <span className="value" data-testid={valueTestId}>{displayBooleans(renderBoolean, children)}</span>
+      <span className="value">{displayBooleans(renderBoolean, children)}</span>
     </div>
   );
 }