test: replacing toMatchInlineSnapshot within component/ui/__tests__/*…

… files
kawalcovid19 · Aug 14, 2021 · 7e51141 · 7e51141
1 parent f9ef60c
commit 7e51141
Showing 1 changed file with 4 additions and 20 deletions.
diff --git a/components/ui/__tests__/button.test.tsx b/components/ui/__tests__/button.test.tsx
@@ -85,18 +85,9 @@ describe("Button", () => {
 
   describe("SecondaryButton", () => {
     it("renders correctly", () => {
-      const { container } = render(
-        <SecondaryButton>test button</SecondaryButton>,
-      );
+      render(<SecondaryButton>test button</SecondaryButton>);
 
-      expect(container.firstChild).toMatchInlineSnapshot(`
-        <button
-          class="inline-flex flex-row px-4 py-2 text-sm rounded-md items-center justify-center border border-transparent font-medium focus:outline-none focus:ring-2 focus:ring-offset-2 text-blue-700 bg-blue-100 hover:bg-blue-200 focus:ring-blue-500 disabled:cursor-not-allowed disabled:opacity-75"
-          type="button"
-        >
-          test button
-        </button>
-      `);
+      expect(screen.getByText("test button")).toBeInTheDocument();
     });
 
     it("renders with correct colors", () => {
@@ -161,16 +152,9 @@ describe("Button", () => {
 
   describe("OutlineButton", () => {
     it("renders correctly", () => {
-      const { container } = render(<OutlineButton>test button</OutlineButton>);
+      render(<OutlineButton>test button</OutlineButton>);
 
-      expect(container.firstChild).toMatchInlineSnapshot(`
-        <button
-          class="inline-flex flex-row px-4 py-2 text-sm rounded-md items-center justify-center border border-transparent font-medium shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 text-blue-500 border-blue-500 hover:bg-blue-100 focus:ring-blue-500 disabled:cursor-not-allowed disabled:opacity-75"
-          type="button"
-        >
-          test button
-        </button>
-      `);
+      expect(screen.getByText("test button")).toBeInTheDocument();
     });
 
     it("renders with correct colors", () => {