From 12d9280e196e13489dd87ec5c5fee3bf85f5f0bc Mon Sep 17 00:00:00 2001 From: Martin Pitt Date: Tue, 24 Oct 2023 11:16:08 +0200 Subject: [PATCH 1/5] storaged: Fix nesting in StopProcessesMessage dialog A `` must not appear inside of a `

`, make them siblings instead. --- pkg/storaged/dialog.jsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/pkg/storaged/dialog.jsx b/pkg/storaged/dialog.jsx index 927a5db28151..b0564a21a173 100644 --- a/pkg/storaged/dialog.jsx +++ b/pkg/storaged/dialog.jsx @@ -1257,7 +1257,8 @@ export const StopProcessesMessage = ({ mount_point, users }) => { return (

{ process_rows.length > 0 - ?

{fmt_to_fragments(_("The mount point $0 is in use by these processes:"), {mount_point})} + ? <> +

{fmt_to_fragments(_("The mount point $0 is in use by these processes:"), {mount_point})}

{ ] } rows={process_rows} /> -

+ : null } { process_rows.length > 0 && service_rows.length > 0 @@ -1276,7 +1277,8 @@ export const StopProcessesMessage = ({ mount_point, users }) => { : null } { service_rows.length > 0 - ?

{fmt_to_fragments(_("The mount point $0 is in use by these services:"), {mount_point})} + ? <> +

{fmt_to_fragments(_("The mount point $0 is in use by these services:"), {mount_point})}

{ ] } rows={service_rows} /> -

+ : null }
); From cb62e2903ea73ddf54ca992b8f29bd3d83222e80 Mon Sep 17 00:00:00 2001 From: Martin Pitt Date: Wed, 25 Oct 2023 06:26:23 +0200 Subject: [PATCH 2/5] storaged: Fix DOM nesting in UsersPopover A `` block element must not appear inside a `

`, make them siblings instead. --- pkg/storaged/dialog.jsx | 12 ++++++------ test/verify/check-storage-used | 2 +- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/pkg/storaged/dialog.jsx b/pkg/storaged/dialog.jsx index b0564a21a173..cc1cf29d2aad 100644 --- a/pkg/storaged/dialog.jsx +++ b/pkg/storaged/dialog.jsx @@ -1107,13 +1107,13 @@ const UsersPopover = ({ users }) => { bodyContent={ <> { services.length > 0 - ?

- {_("Services using the location")} + ? <> +

{_("Services using the location")}

{ services.slice(0, max).map((u, i) => {u.unit.replace(/\.service$/, "")}) } { services.length > max ? ... : null } -

+ : null } { services.length > 0 && processes.length > 0 @@ -1121,13 +1121,13 @@ const UsersPopover = ({ users }) => { : null } { processes.length > 0 - ?

- {_("Processes using the location")} + ? <> +

{_("Processes using the location")}

{ processes.slice(0, max).map((u, i) => {u.comm} (user: {u.user}, pid: {u.pid})) } { processes.length > max ? ... : null } -

+ : null } }> diff --git a/test/verify/check-storage-used b/test/verify/check-storage-used index b6780724ea1d..0b2e0ee85c64 100755 --- a/test/verify/check-storage-used +++ b/test/verify/check-storage-used @@ -68,7 +68,7 @@ ExecStart=/usr/bin/sleep infinity b.wait_in_text(".pf-v5-c-popover", str(sleep_pid)) b.wait_in_text(".pf-v5-c-popover", "keep-mnt-busy") b.assert_pixels(".pf-v5-c-popover", "popover", - mock={".pf-v5-c-popover__body p:nth-of-type(2) li": "process (user: root, pid: 1234)"}, + mock={".pf-v5-c-popover__body ul:nth-of-type(2) li": "process (user: root, pid: 1234)"}, scroll_into_view="#dialog button:contains(Currently in use)") b.click(".pf-v5-c-popover button") b.assert_pixels('#dialog', "format", wait_after_layout_change=True) From 27c5e7ffe220d8636ef611d6a6285e1d44fd4877 Mon Sep 17 00:00:00 2001 From: Martin Pitt Date: Tue, 24 Oct 2023 12:00:55 +0200 Subject: [PATCH 3/5] storaged: Fix nested Form RemovePassphraseField is already in a `
`, so don't wrap the checkbox into a second one. --- pkg/storaged/crypto-keyslots.jsx | 30 ++++++++++++++---------------- 1 file changed, 14 insertions(+), 16 deletions(-) diff --git a/pkg/storaged/crypto-keyslots.jsx b/pkg/storaged/crypto-keyslots.jsx index f33d3fc1c267..45106488ca2c 100644 --- a/pkg/storaged/crypto-keyslots.jsx +++ b/pkg/storaged/crypto-keyslots.jsx @@ -23,7 +23,7 @@ import React from "react"; import { Card, CardBody, CardHeader, CardTitle } from '@patternfly/react-core/dist/esm/components/Card/index.js'; import { Checkbox } from "@patternfly/react-core/dist/esm/components/Checkbox/index.js"; import { ClipboardCopy } from "@patternfly/react-core/dist/esm/components/ClipboardCopy/index.js"; -import { Form, FormGroup } from "@patternfly/react-core/dist/esm/components/Form/index.js"; +import { FormGroup } from "@patternfly/react-core/dist/esm/components/Form/index.js"; import { DataList, DataListCell, DataListItem, DataListItemCells, DataListItemRow } from "@patternfly/react-core/dist/esm/components/DataList/index.js"; import { Text, TextContent, TextList, TextListItem, TextVariants } from "@patternfly/react-core/dist/esm/components/Text/index.js"; import { TextInput as TextInputPF } from "@patternfly/react-core/dist/esm/components/TextInput/index.js"; @@ -692,21 +692,19 @@ const RemovePassphraseField = (tag, key, dev) => { return (

{ fmt_to_fragments(_("Passphrase removal may prevent unlocking $0."), {dev}) }

- - change(checked ? "" : false)} - body={val === false - ?

- {_("Removing a passphrase without confirmation of another passphrase may prevent unlocking or key management, if other passphrases are forgotten or lost.")} -

- : - change(value)} /> - - } - /> - + change(checked ? "" : false)} + body={val === false + ?

+ {_("Removing a passphrase without confirmation of another passphrase may prevent unlocking or key management, if other passphrases are forgotten or lost.")} +

+ : + change(value)} /> + + } + /> ); } From 5d835e531d072e7c0b8dbb2785c493d3402de9d9 Mon Sep 17 00:00:00 2001 From: Martin Pitt Date: Tue, 24 Oct 2023 12:21:37 +0200 Subject: [PATCH 4/5] storaged: Fix nesting in tang key verification dialog A ClipboardCopy is a block element (`
`) and thus cannot be put into a `

`. Make them silblings. To retain the current layout, turn the text into a simple span, so that the text and the ClipboardCopy still appear side by side. --- pkg/storaged/crypto-keyslots.jsx | 16 +++++++--------- 1 file changed, 7 insertions(+), 9 deletions(-) diff --git a/pkg/storaged/crypto-keyslots.jsx b/pkg/storaged/crypto-keyslots.jsx index 45106488ca2c..b2d1e8c3f67a 100644 --- a/pkg/storaged/crypto-keyslots.jsx +++ b/pkg/storaged/crypto-keyslots.jsx @@ -622,15 +622,13 @@ export const TangKeyVerification = ({ url, adv }) => { {_("Check the key hash with the Tang server.")} {_("How to check")} - - {_("In a terminal, run: ")} - - {cmd} - - + {_("In a terminal, run: ")} + + {cmd} + {_("Check that the SHA-256 or SHA-1 hash from the command matches this dialog.")} From c71e15215f91df9e544ebdf8f907a9b656fd7b36 Mon Sep 17 00:00:00 2001 From: Martin Pitt Date: Fri, 20 Oct 2023 11:54:08 +0200 Subject: [PATCH 5/5] test: Fail on React DOM nesting errors Most errors were fixed recently. The remaining ones on the Storage page conflict with the ongoing page redesign, and may well already be fixed by it. Ignore them specifically for now. This will prevent introducing new DOM nesting errors in the future. --- test/common/testlib.py | 2 -- test/verify/check-storage-luks | 3 +++ test/verify/check-storage-lvm2 | 6 ++++++ 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/test/common/testlib.py b/test/common/testlib.py index 8fb8dea58345..a98d6b5091af 100644 --- a/test/common/testlib.py +++ b/test/common/testlib.py @@ -1701,8 +1701,6 @@ def login_and_go(self, path: Optional[str] = None, user: Optional[str] = None, h # List of allowed console.error() messages during tests; these match substrings default_allowed_console_errors = [ - # HACK: Fix these ASAP, these are major bugs - "Warning: validateDOMNesting.*cannot appear as a", # HACK: These should be fixed, but debugging these is not trivial, and the impact is very low "Warning: .* setState.*on an unmounted component", "Warning: Can't perform a React state update on an unmounted component", diff --git a/test/verify/check-storage-luks b/test/verify/check-storage-luks index 594b09f6cd36..cceda5d43902 100755 --- a/test/verify/check-storage-luks +++ b/test/verify/check-storage-luks @@ -193,6 +193,9 @@ class TestStorageLuks(storagelib.StorageCase): b.logout() testlib.wait(lambda: m.execute("(loginctl list-users | grep admin) || true") == "") + # FIXME: race condition after unmounting; hard to investigate, re-check after storage redesign + self.allow_browser_errors("validateDOMNesting.*cannot appear as a child.*

 ul") + def testNoFsys(self): m = self.machine b = self.browser diff --git a/test/verify/check-storage-lvm2 b/test/verify/check-storage-lvm2 index f0d5cafa5cda..75da748797ac 100755 --- a/test/verify/check-storage-lvm2 +++ b/test/verify/check-storage-lvm2 @@ -251,6 +251,9 @@ class TestStorageLvm2(storagelib.StorageCase): b.wait_not_in_text("#devices", "vgroup1") self.assertEqual(m.execute(f"grep {mount_point_thin} /etc/fstab || true"), "") + # FIXME: Grow/Shrink buttons are in a dd > div > dd without dl wrapper + self.allow_browser_errors("validateDOMNesting.*cannot appear as a descendant.*
dd") + def testUnpartitionedSpace(self): m = self.machine b = self.browser @@ -334,6 +337,9 @@ class TestStorageLvm2(storagelib.StorageCase): self.content_row_wait_in_col(1, 1, "lvol0") b.wait_not_in_text("#storage-detail", "snap0") + # FIXME: Grow/Shrink buttons are in a dd > div > dd without dl wrapper + self.allow_browser_errors("validateDOMNesting.*cannot appear as a descendant.*
dd") + if __name__ == '__main__': testlib.test_main()