WIP: add few test for ProposalSettingsSection.test.jsx

web/src/components/storage/ProposalSettingsSection.test.jsx

@@ -54,6 +54,34 @@ const vda = {
   partitionTable: { type: "gpt", partitions: [] }
 };
 
+const md0 = {
+  sid: "62",
+  type: "md",
+  level: "raid0",
+  uuid: "12345:abcde",
+  members: ["/dev/vdb"],
+  active: true,
+  name: "/dev/md0",
+  size: 2048,
+  systems : [],
+  udevIds: [],
+  udevPaths: []
+};
+
+const md1 = {
+  sid: "63",
+  type: "md",
+  level: "raid0",
+  uuid: "12345:abcde",
+  members: ["/dev/vdc"],
+  active: true,
+  name: "/dev/md1",
+  size: 4096,
+  systems : [],
+  udevIds: [],
+  udevPaths: []
+};
+
 beforeEach(() => {
   props = {};
 });
@@ -189,7 +217,9 @@ describe("LVM field", () => {
 
   describe("if LVM is set to true", () => {
     beforeEach(() => {
-      props.settings = { lvm: true };
+      props.availableDevices = [vda, md0, md1];
+      // TODO: what happens if systemDevices is not set or an empty array?
+      props.settings = { bootDevice: "/dev/vda", lvm: true, systemVGDevices: [] };
       props.onChange = jest.fn();
     });
 
@@ -200,6 +230,12 @@ describe("LVM field", () => {
       expect(checkbox).toBeChecked();
     });
 
+    it("renders a button for changing the LVM settings", () => {
+      plainRender(<ProposalSettingsSection {...props} />);
+
+      screen.getByRole("button", { name: /LVM settings/ });
+    });
+
     it("changes the selection on click", async () => {
       const { user } = plainRender(<ProposalSettingsSection {...props} />);
 
@@ -209,6 +245,86 @@ describe("LVM field", () => {
       expect(checkbox).not.toBeChecked();
       expect(props.onChange).toHaveBeenCalled();
     });
+
+    describe("and user clicks on LVM settings", () => {
+      // TODO: rethink if next example is that useful considering that other
+      // examples has to wait until the dialog is open too.
+      it("opens the LVM settings dialog", async() => {
+        const { user } = plainRender(<ProposalSettingsSection {...props} />);
+        const settingsButton = screen.getByRole("button", { name: /LVM settings/ });
+
+        await user.click(settingsButton);
+
+        const popup = await screen.findByRole("dialog");
+        screen.getByText("System Volume Group");
+      });
+
+      it("allows set the installation device as system volume group", async () => {
+        const { user } = plainRender(<ProposalSettingsSection {...props} />);
+        const settingsButton = screen.getByRole("button", { name: /LVM settings/ });
+
+        await user.click(settingsButton);
+
+        const popup = await screen.findByRole("dialog");
+        screen.getByText("System Volume Group");
+
+        const bootDeviceOption = screen.getByRole("button", { name: "Installation device"})
+        const customDevicesOption = screen.getByRole("button", { name: "Custom devices"})
+        const acceptButton = screen.getByRole("button", { name: "Accept"})
+
+        await user.click(customDevicesOption);
+        await user.click(bootDeviceOption);
+        await user.click(acceptButton);
+
+        expect(props.onChange).toHaveBeenCalledWith(
+          expect.objectContaining({ systemVGDevices: [] })
+        );
+      });
+
+      it("allows customize the system volume group", async () => {
+        const { user } = plainRender(<ProposalSettingsSection {...props} />);
+        const settingsButton = screen.getByRole("button", { name: /LVM settings/ });
+
+        await user.click(settingsButton);
+
+        const popup = await screen.findByRole("dialog");
+        screen.getByText("System Volume Group");
+
+        const customDevicesOption = screen.getByRole("button", { name: "Custom devices"})
+        const acceptButton = screen.getByRole("button", { name: "Accept"})
+
+        await user.click(customDevicesOption);
+
+        const vdaOption = screen.getByRole("option", { name: /vda/ })
+        const md0Option = screen.getByRole("option", { name: /md0/ })
+        const md1Option = screen.getByRole("option", { name: /md1/ })
+
+        // unselect the boot devices
+        await user.click(vdaOption);
+
+        await user.click(md0Option);
+        await user.click(md1Option);
+
+        await user.click(acceptButton);
+
+        expect(props.onChange).toHaveBeenCalledWith(
+          expect.objectContaining({ systemVGDevices: ["/dev/md0", "/dev/md1"] })
+        );
+      });
+
+      it("allows selecting between following installation device or using custom devices", async() => {
+        const { user } = plainRender(<ProposalSettingsSection {...props} />);
+        const settingsButton = screen.getByRole("button", { name: /LVM settings/ });
+
+        await user.click(settingsButton);
+
+        const popup = await screen.findByRole("dialog");
+        screen.getByText("System Volume Group");
+
+        const bootDeviceOption = screen.getByRole("button", { name: "Installation device"})
+        const customDevicesOption = screen.getByRole("button", { name: "Custom devices"})
+      });
+    });
   });
 
   describe("if LVM is set to false", () => {