From a9747128d0fb4ac7809ca4eea8e9b3656bee228e Mon Sep 17 00:00:00 2001
From: Tharun Rajendran <rajendrantharun@live.com>
Date: Tue, 12 Apr 2022 20:57:12 +0530
Subject: [PATCH] chore(test): rewritten icon components test using rtl (#4764)

---
 .../components/icons/FleetIcon/FleetIcon.tests.jsx |  7 +++++--
 .../icons/OrgLogoIcon/OrgLogoIcon.tests.jsx        | 14 +++++++++-----
 .../icons/PlatformIcon/PlatformIcon.tests.jsx      | 12 +++++++-----
 3 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/frontend/components/icons/FleetIcon/FleetIcon.tests.jsx b/frontend/components/icons/FleetIcon/FleetIcon.tests.jsx
index 155da66780..9c2176d800 100644
--- a/frontend/components/icons/FleetIcon/FleetIcon.tests.jsx
+++ b/frontend/components/icons/FleetIcon/FleetIcon.tests.jsx
@@ -1,10 +1,13 @@
 import React from "react";
-import { mount } from "enzyme";
+import { render } from "@testing-library/react";
 
 import FleetIcon from "./FleetIcon";
 
 describe("FleetIcon - component", () => {
   it("renders", () => {
-    expect(mount(<FleetIcon name="success-check" />)).toBeTruthy();
+    const { container } = render(<FleetIcon name="success-check" />);
+    expect(
+      container.querySelector(".fleeticon-success-check")
+    ).toBeInTheDocument();
   });
 });
diff --git a/frontend/components/icons/OrgLogoIcon/OrgLogoIcon.tests.jsx b/frontend/components/icons/OrgLogoIcon/OrgLogoIcon.tests.jsx
index 3a8ad53bf1..714a92732a 100644
--- a/frontend/components/icons/OrgLogoIcon/OrgLogoIcon.tests.jsx
+++ b/frontend/components/icons/OrgLogoIcon/OrgLogoIcon.tests.jsx
@@ -1,19 +1,23 @@
 import React from "react";
-import { mount } from "enzyme";
+import { render, screen } from "@testing-library/react";
 
 import fleetAvatar from "../../../../assets/images/fleet-avatar-24x24@2x.png";
 import OrgLogoIcon from "./OrgLogoIcon";
 
 describe("OrgLogoIcon - component", () => {
   it("renders the Fleet Logo by default", () => {
-    const component = mount(<OrgLogoIcon />);
+    render(<OrgLogoIcon />);
 
-    expect(component.state("imageSrc")).toEqual(fleetAvatar);
+    // expect(component.state("imageSrc")).toEqual(fleetAvatar);
+    expect(screen.getByRole("img")).toHaveAttribute("src", fleetAvatar);
   });
 
   it("renders the image source when it is valid", () => {
-    const component = mount(<OrgLogoIcon src="/assets/images/avatar.svg" />);
+    render(<OrgLogoIcon src="/assets/images/avatar.svg" />);
 
-    expect(component.state("imageSrc")).toEqual("/assets/images/avatar.svg");
+    expect(screen.getByRole("img")).toHaveAttribute(
+      "src",
+      "/assets/images/avatar.svg"
+    );
   });
 });
diff --git a/frontend/components/icons/PlatformIcon/PlatformIcon.tests.jsx b/frontend/components/icons/PlatformIcon/PlatformIcon.tests.jsx
index 447e8a6c7b..8427b93dfe 100644
--- a/frontend/components/icons/PlatformIcon/PlatformIcon.tests.jsx
+++ b/frontend/components/icons/PlatformIcon/PlatformIcon.tests.jsx
@@ -1,16 +1,18 @@
 import React from "react";
-import { mount } from "enzyme";
+import { render } from "@testing-library/react";
 
 import PlatformIcon from "./PlatformIcon";
 
 describe("PlatformIcon - component", () => {
   it("renders", () => {
-    expect(mount(<PlatformIcon name="linux" />).length).toEqual(1);
+    const { container } = render(<PlatformIcon name="linux" />);
+    expect(container.querySelector(".platform-icon")).toBeInTheDocument();
   });
 
   it("renders text if no icon", () => {
-    const component = mount(<PlatformIcon name="All" />);
-
-    expect(component.find(".fleeticon-single-host").length).toEqual(1);
+    const { container } = render(<PlatformIcon name="All" />);
+    expect(
+      container.querySelector(".fleeticon-single-host")
+    ).toBeInTheDocument();
   });
 });