@ukic/web-components 2.4.0 → 2.5.0

package/dist/collection/components/ic-accordion/test/basic/ic-accordion.spec.js

@@ -0,0 +1,346 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { Accordion } from "../../ic-accordion";
+describe("ic-accordion snapshots", () => {
+  it("should match default snapshot", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `
+      <ic-accordion heading="Accordion 1">
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>
+      `,
+    });
+    expect(page.root).toMatchSnapshot("renders as default");
+  });
+  it("should match light snapshot", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `
+      <ic-accordion heading="Accordion 1">
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+    });
+    expect(page.root).toMatchSnapshot("renders as light");
+  });
+  it("should match with icon snapshot", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `
+      <ic-accordion heading="Accordion 1">
+        <svg
+          slot="icon"
+          width="20"
+          height="1em"
+          viewBox="0 0 512 512"
+          fill="currentColor"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z"
+          />
+        </svg>
+        <ic-typography variant="body">
+          This is an example of the main body text
+        </ic-typography>
+      </ic-accordion>`,
+    });
+    expect(page.root).toMatchSnapshot("renders with icon");
+  });
+  it("should render with slot", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `
+      <ic-accordion heading="Accordion 1" size="small">
+        <slot>This is an example of the main body text.</slot>
+      </ic-accordion>`,
+    });
+    expect(page.root).toMatchSnapshot("renders small accordion");
+  });
+  it("should match small snapshot", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `
+      <ic-accordion heading="Accordion 1" size="small">
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+    });
+    expect(page.root).toMatchSnapshot("renders small accordion");
+  });
+  it("should match large snapshot", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `
+      <ic-accordion size="large" heading="Accordion 1">
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+    });
+    expect(page.root).toMatchSnapshot("renders large accordion");
+  });
+  it("should render with a heading slot when supplied", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `  
+      <ic-accordion>
+        <slot name="heading"/></slot>
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+    });
+    expect(page.root).toMatchSnapshot("renders with heading slot");
+  });
+  it("should render in a disabled state", async () => {
+    const page = await newSpecPage({
+      components: [Accordion],
+      html: `
+      <ic-accordion heading="Accordion 1" disabled>
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+    });
+    expect(page.root).toMatchSnapshot("disabled");
+  });
+  describe("ic-accordion component", () => {
+    it("it should test the toggleExpanded function", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1">
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      expect(page.root.expanded).toBe(false);
+      await page.rootInstance.toggleExpanded();
+      await page.waitForChanges();
+      expect(page.root.expanded).toBe(true);
+    });
+    it("tests id number is added to accordion", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1">
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      const eventSpy = jest.fn();
+      const accordionId = page.root.id;
+      page.root.addEventListener("accordionClicked", eventSpy);
+      await page.waitForChanges();
+      await page.rootInstance.toggleExpanded();
+      await page.waitForChanges();
+      expect(eventSpy).toHaveBeenCalledWith(expect.objectContaining({
+        detail: expect.objectContaining({
+          id: accordionId,
+        }),
+      }));
+    });
+    it("it should test the disabled function", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1" disabled>
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      expect(page.root.disabled).toBe(true);
+    });
+    it("it should add transition styling to the element", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1" disabled>
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      const div = document.createElement("div");
+      page.rootInstance.setAccordionAnimation(div, "300", "height", "ease-out");
+      expect(div.style.transitionDuration).toBe("300ms");
+      expect(div.style.transitionProperty).toBe("height");
+      expect(div.style.transitionDelay).toBe("ease-out");
+    });
+    it("it should call setAccordionAnimation if scroll height > 0 and expanded = true", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1" expanded>
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      const spySetAccordionAnimation = jest.spyOn(page.rootInstance, "setAccordionAnimation");
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      Object.defineProperty(page.rootInstance.expandedContentEl, "scrollHeight", { configurable: true, value: 500 });
+      page.rootInstance.animateExpandedContent();
+      expect(spySetAccordionAnimation).toHaveBeenCalled();
+    });
+    it("it should call setAccordionAnimation if scroll height = '500' and expanded = 'false'", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1" >
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      const spySetAccordionAnimation = jest.spyOn(page.rootInstance, "setAccordionAnimation");
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      Object.defineProperty(page.rootInstance.expandedContentEl, "scrollHeight", { configurable: true, value: 500 });
+      page.rootInstance.animateExpandedContent();
+      expect(spySetAccordionAnimation).toHaveBeenCalled();
+    });
+    it("should set height and .expanded-content-opened on expanded content", async () => {
+      const transitionEvent = {
+        propertyName: "height",
+      };
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1" >
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      page.rootInstance.expandedContentEl.clientHeight = 50;
+      await page.rootInstance.setExpandedContentStyle(transitionEvent, page.rootInstance.expandedContentEl);
+      expect(page.rootInstance.expandedContentEl.className.split(" ")).toContain("expanded-content-opened");
+      expect(page.rootInstance.expandedContentEl.style.height).toBe("auto");
+    });
+    it("should not set height and .expanded-content-opened on expanded content", async () => {
+      const transitionEvent = {
+        propertyName: "height",
+      };
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+      <ic-accordion heading="Accordion 1" >
+        <ic-typography variant="body">
+          This is an example of the main body text.
+        </ic-typography>
+      </ic-accordion>`,
+      });
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      page.rootInstance.expandedContentEl.clientHeight = 0;
+      await page.rootInstance.setExpandedContentStyle(transitionEvent, page.rootInstance.expandedContentEl);
+      expect(page.rootInstance.expandedContentEl.className.split(" ")).not.toContain("expanded-content-opened");
+      expect(page.rootInstance.expandedContentEl.style.height).toBe("");
+      await page.rootInstance.disconnectedCallback();
+    });
+    it("should set visibility on expanded content to hidden", async () => {
+      const transitionEvent = {
+        propertyName: "height",
+      };
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+        <ic-accordion heading="Accordion 1" >
+          <ic-typography variant="body">
+            This is an example of the main body text.
+          </ic-typography>
+        </ic-accordion>`,
+      });
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      page.rootInstance.expandedContentEl.clientHeight = 0;
+      await page.rootInstance.hideExpandedContent(transitionEvent, page.rootInstance.expandedContentEl);
+      expect(page.rootInstance.expandedContentEl.style.getPropertyValue("--ic-expanded-content-visiblity")).toBe("hidden");
+    });
+    it("should set visibility to undefined if client height is greater than 0", async () => {
+      const transitionEvent = {
+        propertyName: "height",
+      };
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+        <ic-accordion heading="Accordion 1" >
+          <ic-typography variant="body">
+            This is an example of the main body text.
+          </ic-typography>
+        </ic-accordion>`,
+      });
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      page.rootInstance.expandedContentEl.clientHeight = 50;
+      await page.rootInstance.hideExpandedContent(transitionEvent, page.rootInstance.expandedContentEl);
+      expect(page.rootInstance.expandedContentEl.style.getPropertyValue("--ic-expanded-content-visiblity")).toBe("");
+    });
+    it("should call 'setFocus' when accordion can be focused", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+        <ic-accordion heading="Accordion 1" >
+          <ic-typography variant="body">
+            This is an example of the main body text.
+          </ic-typography>
+        </ic-accordion>`,
+      });
+      //Can't expect anything in this test - this is to increase code coverage only
+      await page.rootInstance.setFocus().toHaveBeenCalled;
+    });
+    it("should call setExpandedContentStyle when transitionend in animateExpandedContent and expanded is true", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+        <ic-accordion heading="Accordion 1" >
+          <ic-typography variant="body">
+            This is an example of the main body text.
+          </ic-typography>
+        </ic-accordion>`,
+      });
+      const setExpandedContentStyleSpy = jest.spyOn(page.rootInstance, "setExpandedContentStyle");
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      page.rootInstance.expandedContentEl.scrollHeight = 50;
+      page.rootInstance.expanded = true;
+      await page.rootInstance.animateExpandedContent();
+      const event = new Event("transitionend");
+      page.rootInstance.expandedContentEl.dispatchEvent(event);
+      expect(setExpandedContentStyleSpy).toHaveBeenCalled();
+    });
+    it("should call hideExpandedContent when transitionend in animateExpandedContent and expanded is false", async () => {
+      const page = await newSpecPage({
+        components: [Accordion],
+        html: `
+        <ic-accordion heading="Accordion 1" >
+          <ic-typography variant="body">
+            This is an example of the main body text.
+          </ic-typography>
+        </ic-accordion>`,
+      });
+      const hideExpandedContentSpy = jest.spyOn(page.rootInstance, "hideExpandedContent");
+      const accordionExpanded = page.root.shadowRoot.querySelector(".expanded-content");
+      page.rootInstance.expandedContentEl = accordionExpanded;
+      page.rootInstance.expandedContentEl.scrollHeight = 50;
+      page.rootInstance.expanded = false;
+      await page.rootInstance.animateExpandedContent();
+      const event = new Event("transitionend");
+      page.rootInstance.expandedContentEl.dispatchEvent(event);
+      expect(hideExpandedContentSpy).toHaveBeenCalled();
+    });
+  });
+});
+//# sourceMappingURL=ic-accordion.spec.js.map

package/dist/collection/components/ic-accordion/test/basic/ic-accordion.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-accordion.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-accordion/test/basic/ic-accordion.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { Accordion } from \"../../ic-accordion\";\n\ndescribe(\"ic-accordion snapshots\", () => {\n  it(\"should match default snapshot\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `\n      <ic-accordion heading=\"Accordion 1\">\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>\n      `,\n    });\n    expect(page.root).toMatchSnapshot(\"renders as default\");\n  });\n\n  it(\"should match light snapshot\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `\n      <ic-accordion heading=\"Accordion 1\">\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n    });\n    expect(page.root).toMatchSnapshot(\"renders as light\");\n  });\n\n  it(\"should match with icon snapshot\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `\n      <ic-accordion heading=\"Accordion 1\">\n        <svg\n          slot=\"icon\"\n          width=\"20\"\n          height=\"1em\"\n          viewBox=\"0 0 512 512\"\n          fill=\"currentColor\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            d=\"M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z\"\n          />\n        </svg>\n        <ic-typography variant=\"body\">\n          This is an example of the main body text\n        </ic-typography>\n      </ic-accordion>`,\n    });\n    expect(page.root).toMatchSnapshot(\"renders with icon\");\n  });\n\n  it(\"should render with slot\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `\n      <ic-accordion heading=\"Accordion 1\" size=\"small\">\n        <slot>This is an example of the main body text.</slot>\n      </ic-accordion>`,\n    });\n    expect(page.root).toMatchSnapshot(\"renders small accordion\");\n  });\n\n  it(\"should match small snapshot\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `\n      <ic-accordion heading=\"Accordion 1\" size=\"small\">\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n    });\n    expect(page.root).toMatchSnapshot(\"renders small accordion\");\n  });\n\n  it(\"should match large snapshot\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `\n      <ic-accordion size=\"large\" heading=\"Accordion 1\">\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n    });\n    expect(page.root).toMatchSnapshot(\"renders large accordion\");\n  });\n\n  it(\"should render with a heading slot when supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `  \n      <ic-accordion>\n        <slot name=\"heading\"/></slot>\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n    });\n    expect(page.root).toMatchSnapshot(\"renders with heading slot\");\n  });\n\n  it(\"should render in a disabled state\", async () => {\n    const page = await newSpecPage({\n      components: [Accordion],\n      html: `\n      <ic-accordion heading=\"Accordion 1\" disabled>\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n    });\n    expect(page.root).toMatchSnapshot(\"disabled\");\n  });\n\n  describe(\"ic-accordion component\", () => {\n    it(\"it should test the toggleExpanded function\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\">\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n\n      expect(page.root.expanded).toBe(false);\n      await page.rootInstance.toggleExpanded();\n      await page.waitForChanges();\n      expect(page.root.expanded).toBe(true);\n    });\n\n    it(\"tests id number is added to accordion\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\">\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n      const eventSpy = jest.fn();\n\n      const accordionId = page.root.id;\n      page.root.addEventListener(\"accordionClicked\", eventSpy);\n      await page.waitForChanges();\n      await page.rootInstance.toggleExpanded();\n      await page.waitForChanges();\n\n      expect(eventSpy).toHaveBeenCalledWith(\n        expect.objectContaining({\n          detail: expect.objectContaining({\n            id: accordionId,\n          }),\n        })\n      );\n    });\n\n    it(\"it should test the disabled function\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\" disabled>\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n      expect(page.root.disabled).toBe(true);\n    });\n\n    it(\"it should add transition styling to the element\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\" disabled>\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n      const div = document.createElement(\"div\");\n      page.rootInstance.setAccordionAnimation(div, \"300\", \"height\", \"ease-out\");\n      expect(div.style.transitionDuration).toBe(\"300ms\");\n      expect(div.style.transitionProperty).toBe(\"height\");\n      expect(div.style.transitionDelay).toBe(\"ease-out\");\n    });\n\n    it(\"it should call setAccordionAnimation if scroll height > 0 and expanded = true\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\" expanded>\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n\n      const spySetAccordionAnimation = jest.spyOn(\n        page.rootInstance,\n        \"setAccordionAnimation\"\n      );\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n      Object.defineProperty(\n        page.rootInstance.expandedContentEl,\n        \"scrollHeight\",\n        { configurable: true, value: 500 }\n      );\n      page.rootInstance.animateExpandedContent();\n\n      expect(spySetAccordionAnimation).toHaveBeenCalled();\n    });\n\n    it(\"it should call setAccordionAnimation if scroll height = '500' and expanded = 'false'\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\" >\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n      const spySetAccordionAnimation = jest.spyOn(\n        page.rootInstance,\n        \"setAccordionAnimation\"\n      );\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n\n      Object.defineProperty(\n        page.rootInstance.expandedContentEl,\n        \"scrollHeight\",\n        { configurable: true, value: 500 }\n      );\n      page.rootInstance.animateExpandedContent();\n      expect(spySetAccordionAnimation).toHaveBeenCalled();\n    });\n\n    it(\"should set height and .expanded-content-opened on expanded content\", async () => {\n      const transitionEvent = {\n        propertyName: \"height\",\n      } as TransitionEvent;\n\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\" >\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n      page.rootInstance.expandedContentEl.clientHeight = 50;\n\n      await page.rootInstance.setExpandedContentStyle(\n        transitionEvent,\n        page.rootInstance.expandedContentEl\n      );\n\n      expect(\n        page.rootInstance.expandedContentEl.className.split(\" \")\n      ).toContain(\"expanded-content-opened\");\n      expect(page.rootInstance.expandedContentEl.style.height).toBe(\"auto\");\n    });\n\n    it(\"should not set height and .expanded-content-opened on expanded content\", async () => {\n      const transitionEvent = {\n        propertyName: \"height\",\n      } as TransitionEvent;\n\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n      <ic-accordion heading=\"Accordion 1\" >\n        <ic-typography variant=\"body\">\n          This is an example of the main body text.\n        </ic-typography>\n      </ic-accordion>`,\n      });\n\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n      page.rootInstance.expandedContentEl.clientHeight = 0;\n\n      await page.rootInstance.setExpandedContentStyle(\n        transitionEvent,\n        page.rootInstance.expandedContentEl\n      );\n\n      expect(\n        page.rootInstance.expandedContentEl.className.split(\" \")\n      ).not.toContain(\"expanded-content-opened\");\n      expect(page.rootInstance.expandedContentEl.style.height).toBe(\"\");\n\n      await page.rootInstance.disconnectedCallback();\n    });\n\n    it(\"should set visibility on expanded content to hidden\", async () => {\n      const transitionEvent = {\n        propertyName: \"height\",\n      } as TransitionEvent;\n\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n        <ic-accordion heading=\"Accordion 1\" >\n          <ic-typography variant=\"body\">\n            This is an example of the main body text.\n          </ic-typography>\n        </ic-accordion>`,\n      });\n\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n      page.rootInstance.expandedContentEl.clientHeight = 0;\n\n      await page.rootInstance.hideExpandedContent(\n        transitionEvent,\n        page.rootInstance.expandedContentEl\n      );\n\n      expect(\n        (\n          page.rootInstance.expandedContentEl as HTMLDivElement\n        ).style.getPropertyValue(\"--ic-expanded-content-visiblity\")\n      ).toBe(\"hidden\");\n    });\n\n    it(\"should set visibility to undefined if client height is greater than 0\", async () => {\n      const transitionEvent = {\n        propertyName: \"height\",\n      } as TransitionEvent;\n\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n        <ic-accordion heading=\"Accordion 1\" >\n          <ic-typography variant=\"body\">\n            This is an example of the main body text.\n          </ic-typography>\n        </ic-accordion>`,\n      });\n\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n      page.rootInstance.expandedContentEl.clientHeight = 50;\n\n      await page.rootInstance.hideExpandedContent(\n        transitionEvent,\n        page.rootInstance.expandedContentEl\n      );\n\n      expect(\n        (\n          page.rootInstance.expandedContentEl as HTMLDivElement\n        ).style.getPropertyValue(\"--ic-expanded-content-visiblity\")\n      ).toBe(\"\");\n    });\n\n    it(\"should call 'setFocus' when accordion can be focused\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n        <ic-accordion heading=\"Accordion 1\" >\n          <ic-typography variant=\"body\">\n            This is an example of the main body text.\n          </ic-typography>\n        </ic-accordion>`,\n      });\n\n      //Can't expect anything in this test - this is to increase code coverage only\n      await page.rootInstance.setFocus().toHaveBeenCalled;\n    });\n\n    it(\"should call setExpandedContentStyle when transitionend in animateExpandedContent and expanded is true\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n        <ic-accordion heading=\"Accordion 1\" >\n          <ic-typography variant=\"body\">\n            This is an example of the main body text.\n          </ic-typography>\n        </ic-accordion>`,\n      });\n\n      const setExpandedContentStyleSpy = jest.spyOn(\n        page.rootInstance,\n        \"setExpandedContentStyle\"\n      );\n\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n      page.rootInstance.expandedContentEl.scrollHeight = 50;\n      page.rootInstance.expanded = true;\n\n      await page.rootInstance.animateExpandedContent();\n\n      const event = new Event(\"transitionend\");\n      page.rootInstance.expandedContentEl.dispatchEvent(event);\n\n      expect(setExpandedContentStyleSpy).toHaveBeenCalled();\n    });\n\n    it(\"should call hideExpandedContent when transitionend in animateExpandedContent and expanded is false\", async () => {\n      const page = await newSpecPage({\n        components: [Accordion],\n        html: `\n        <ic-accordion heading=\"Accordion 1\" >\n          <ic-typography variant=\"body\">\n            This is an example of the main body text.\n          </ic-typography>\n        </ic-accordion>`,\n      });\n\n      const hideExpandedContentSpy = jest.spyOn(\n        page.rootInstance,\n        \"hideExpandedContent\"\n      );\n\n      const accordionExpanded =\n        page.root.shadowRoot.querySelector(\".expanded-content\");\n      page.rootInstance.expandedContentEl = accordionExpanded;\n      page.rootInstance.expandedContentEl.scrollHeight = 50;\n      page.rootInstance.expanded = false;\n\n      await page.rootInstance.animateExpandedContent();\n\n      const event = new Event(\"transitionend\");\n      page.rootInstance.expandedContentEl.dispatchEvent(event);\n\n      expect(hideExpandedContentSpy).toHaveBeenCalled();\n    });\n  });\n});\n"]}