CEC-1230 Datascope opens iframe dashboard (#174)

* CEC-1230 Datascope opens iframe dashboard

* Clean up

src/components/Controls/CarUpdateStatusProgress/CarUpdateStatusProgress.test.jsx

@@ -4,6 +4,7 @@ import { render, waitFor } from "@testing-library/react";
 import CarUpdateStatusProgress from "../CarUpdateStatusProgress";
 import useStyles from "../../useStyles";
 import s from "./Statuses";
+import addSnapshotSerializer from "../../../utils/snapshot";
 
 const TestWrapper = ({ status }) => {
   const classes = useStyles();
@@ -17,6 +18,10 @@ const renderCarUpdateStatusProgress = async (status) => {
 };
 
 describe("CarUpdateStatusProgress", () => {
+  beforeAll(() => {
+    addSnapshotSerializer(expect);
+  });
+
   const tests = [
     {
       name: "manifest_received",

src/components/Controls/CarUpdateStatusTable/CarUpdateStatusTable.test.jsx

@@ -7,6 +7,7 @@ import { CarUpdatesProvider } from "../../Contexts/CarUpdatesContext";
 import CarUpdateStatusTable from "../CarUpdateStatusTable";
 import { StatusProvider } from "../../Contexts/StatusContext";
 import { TEST_AUTH_OBJECT } from "../../../utils/testing";
+import addSnapshotSerializer from "../../../utils/snapshot";
 
 const renderCarUpdateStatusTable = async () => {
   const { container } = render(
@@ -22,17 +23,7 @@ const renderCarUpdateStatusTable = async () => {
 
 describe("CarUpdateStatusTable", () => {
   beforeAll(() => {
-    expect.addSnapshotSerializer({
-      test: function (val) {
-        return val && typeof val === "string" && val.indexOf("mui-") >= 0;
-      },
-      print: function (val) {
-        let str = val;
-        str = str.replace(/mui-\d*/g, "mui-00000");
-
-        return `"${str}"`;
-      },
-    });
+    addSnapshotSerializer(expect);
   });
 
   it("Render", async () => {

src/components/Controls/CarUpdateStatusTable/__snapshots__/CarUpdateStatusTable.test.jsx.snap

@@ -194,7 +194,7 @@ exports[`CarUpdateStatusTable Render 1`] = `
               />
               <p
                 class="MuiTypography-root MuiTablePagination-caption MuiTypography-body2 MuiTypography-colorInherit"
-                id="mui-00000"
+                id="mui-0"
               >
                 Rows per page:
               </p>
@@ -204,7 +204,7 @@ exports[`CarUpdateStatusTable Render 1`] = `
                 <select
                   aria-label="rows per page"
                   class="MuiSelect-root MuiSelect-select MuiTablePagination-select MuiInputBase-input"
-                  id="mui-00000"
+                  id="mui-0"
                 >
                   <option
                     class="MuiTablePagination-menuItem"

src/components/Controls/DownloadFileLink/index.test.jsx

@@ -2,11 +2,13 @@ import React from "react";
 import { render, waitFor } from "@testing-library/react";
 
 import DownloadFileLink from ".";
+import addSnapshotSerializer from "../../../utils/snapshot";
 
 describe("DownloadFileLink", () => {
   beforeAll(() => {
     global.URL.createObjectURL = jest.fn();
     global.URL.revokeObjectURL = jest.fn();
+    addSnapshotSerializer(expect);
   });
 
   it("Render", async () => {

src/components/Controls/ResponsiveIFrame/index.jsx

@@ -1,20 +1,15 @@
 import React from "react";
 
 const ResponsiveIFrame = (props) => {
-  const { classes, src, title } = props;
+  const { classes, src, title, fullscreen } = props;
+  const container = fullscreen
+    ? classes.iframeResponsive
+    : classes.embeddedWrapper;
 
   return (
-    <div className={classes.embeddedWrapper}>
+    <div className={container}>
       <iframe
-        style={{
-          position: "absolute",
-          top: 0,
-          left: 0,
-          bottom: 0,
-          right: 0,
-          width: "100%",
-          height: "100%",
-        }}
+        className={classes.iframeResponsive}
         title={title}
         src={src}
         frameBorder="0"

src/components/Controls/TabPanel/index.test.jsx

@@ -1,7 +1,7 @@
 import { render, waitFor } from "@testing-library/react";
 
-import TabPanel from "./index"
-
+import TabPanel from "./index";
+import addSnapshotSerializer from "../../../utils/snapshot";
 
 const renderTabPanel = async () => {
   const { container } = render(
@@ -9,11 +9,15 @@ const renderTabPanel = async () => {
       <div>Test</div>
     </TabPanel>
   );
-  await waitFor(() => { });
+  await waitFor(() => {});
   return container;
 };
 
 describe("TabPanel", () => {
+  beforeAll(() => {
+    addSnapshotSerializer(expect);
+  });
+
   it("Render", async () => {
     const container = await renderTabPanel();
     expect(container).toMatchSnapshot();