test(Collapse): add visual tests

packages/orbit-components/src/Collapse/Collapse.ct-story.tsx

@@ -19,9 +19,15 @@ export default function CollapseStory() {
       >
         <p>Collapsed content</p>
       </Collapse>
-      <Collapse label="Expanded" initialExpanded>
+      <Collapse label="Initial expanded" initialExpanded>
+        <p>Initial expanded content</p>
+      </Collapse>
+      <Collapse label="Expanded" expanded>
         <p>Expanded content</p>
       </Collapse>
+      <Collapse label="Collapsed">
+        <p>Content</p>
+      </Collapse>
     </>
   );
 }

packages/orbit-components/src/Collapse/Collapse.ct.tsx

@@ -4,9 +4,19 @@ import { test, expect } from "@playwright/experimental-ct-react";
 import CollapseStory from "./Collapse.ct-story";
 
 test.describe("visual Collapse", () => {
-  test("Collapse", async ({ mount }) => {
+  test("Default collapse", async ({ mount }) => {
     const component = await mount(<CollapseStory />);
 
     await expect(component).toHaveScreenshot();
   });
+
+  test("First Collapse opens on label click and last Collapse opens on arrow button click", async ({
+    mount,
+  }) => {
+    const component = await mount(<CollapseStory />);
+
+    await component.getByRole("button").first().click();
+    await component.getByRole("button").last().click();
+    await expect(component).toHaveScreenshot();
+  });
 });