diff --git a/web/package/cockpit-agama.changes b/web/package/cockpit-agama.changes index d8ddc43df9..d6817fe86c 100644 --- a/web/package/cockpit-agama.changes +++ b/web/package/cockpit-agama.changes @@ -1,3 +1,10 @@ +------------------------------------------------------------------- +Mon Apr 15 10:52:14 UTC 2024 - David Diaz + +- Stop using `` tag because "its exposure continues to be + inconsistent across browsers and assistive technologies" + (gh#openSUSE/agama#1149). + ------------------------------------------------------------------- Mon Apr 15 07:14:35 UTC 2024 - David Diaz diff --git a/web/src/components/core/InstallationFinished.jsx b/web/src/components/core/InstallationFinished.jsx index 98fb3d8732..908428d30a 100644 --- a/web/src/components/core/InstallationFinished.jsx +++ b/web/src/components/core/InstallationFinished.jsx @@ -49,12 +49,9 @@ const TpmHint = () => { onToggle={() => setIsExpanded(!isExpanded)} toggleText={isExpanded ? _("Hide details") : _("See more details")} > - TPM to automatically open encrypted devices will take place during the first boot of the new system. For that to work, the machine needs to boot directly to the new boot loader.") - }} - /> + {_("The final step to configure the TPM to automatically open encrypted devices will \ +take place during the first boot of the new system. For that to work, the machine needs to boot \ +directly to the new boot loader.")} diff --git a/web/src/components/overview/StorageSection.jsx b/web/src/components/overview/StorageSection.jsx index 272a8eeac3..024e975932 100644 --- a/web/src/components/overview/StorageSection.jsx +++ b/web/src/components/overview/StorageSection.jsx @@ -60,8 +60,7 @@ const ProposalSummary = ({ proposal }) => { if (result.settings.target === "NEW_LVM_VG") { // TRANSLATORS: Part of the message describing where the system will be installed. - // Do not translate 'abbr' and 'title', they are part of the HTML markup. - const vg = _("LVM volume group"); + const vg = _("Logical Volume Manager (LVM) volume group"); const pvDevices = result.settings.targetPVDevices; const fullMsg = (policy, num_pvs) => { switch (policy) { @@ -110,7 +109,7 @@ const ProposalSummary = ({ proposal }) => { return ( - { label(pvDevices[0]) } + {label(pvDevices[0])} ); diff --git a/web/src/components/storage/EncryptionField.jsx b/web/src/components/storage/EncryptionField.jsx index ae3844af8a..2246eed04a 100644 --- a/web/src/components/storage/EncryptionField.jsx +++ b/web/src/components/storage/EncryptionField.jsx @@ -36,7 +36,7 @@ import EncryptionSettingsDialog from "~/components/storage/EncryptionSettingsDia // Field texts at root level to avoid redefinitions every time the component // is rendered. const LABEL = _("Encryption"); -const DESCRIPTION = _("Full disk encryption allows to protect the information stored at \ +const DESCRIPTION = _("Full Disk Encryption (FDE) allows to protect the information stored at \ the device, including data, programs, and system files."); const VALUES = { loading: , diff --git a/web/src/components/storage/EncryptionSettingsDialog.jsx b/web/src/components/storage/EncryptionSettingsDialog.jsx index 1597a13993..ea3818ac34 100644 --- a/web/src/components/storage/EncryptionSettingsDialog.jsx +++ b/web/src/components/storage/EncryptionSettingsDialog.jsx @@ -34,15 +34,15 @@ import { EncryptionMethods } from "~/client/storage"; */ const DIALOG_TITLE = _("Encryption"); -const DIALOG_DESCRIPTION = _("Full disk encryption allows to protect the information stored at \ -the device, including data, programs, and system files."); -const TPM_LABEL = _("Use the TPM to decrypt automatically on each boot"); +const DIALOG_DESCRIPTION = _("Full Disk Encryption (FDE) allows to protect the information stored \ +at the device, including data, programs, and system files."); +// TRANSLATORS: "Trusted Platform Module" is the name of the technology and TPM its abbreviation +const TPM_LABEL = _("Use the Trusted Platform Module (TPM) to decrypt automatically on each boot"); // TRANSLATORS: The word 'directly' is key here. For example, booting to the installer media and then choosing // 'Boot from Hard Disk' from there will not work. Keep it sort (this is a hint in a form) but keep it clear. -// Do not translate 'abbr' and 'title', they are part of the HTML markup. const TPM_EXPLANATION = _("The password will not be needed to boot and access the data if the \ -TPM can verify the integrity of the system. \ -TPM sealing requires the new system to be booted directly on its first run."); +TPM can verify the integrity of the system. TPM sealing requires the new system to be booted \ +directly on its first run."); /** * Renders a dialog that allows the user change encryption settings diff --git a/web/src/components/storage/EncryptionSettingsDialog.test.jsx b/web/src/components/storage/EncryptionSettingsDialog.test.jsx index 9dcf0eb66b..fc76319ca6 100644 --- a/web/src/components/storage/EncryptionSettingsDialog.test.jsx +++ b/web/src/components/storage/EncryptionSettingsDialog.test.jsx @@ -54,7 +54,7 @@ describe("EncryptionSettingsDialog", () => { const switchField = screen.getByRole("switch", { name: "Encrypt the system" }); const passwordInput = screen.getByLabelText("Password"); const confirmationInput = screen.getByLabelText("Password confirmation"); - const tpmCheckbox = screen.getByRole("checkbox", { name: /Use the TPM/ }); + const tpmCheckbox = screen.getByRole("checkbox", { name: /Use.*TPM/ }); const acceptButton = screen.getByRole("button", { name: "Accept" }); expect(switchField).not.toBeChecked(); @@ -85,7 +85,7 @@ describe("EncryptionSettingsDialog", () => { const passwordInput = screen.getByLabelText("Password"); const confirmationInput = screen.getByLabelText("Password confirmation"); const acceptButton = screen.getByRole("button", { name: "Accept" }); - const tpmCheckbox = screen.getByRole("checkbox", { name: /Use the TPM/ }); + const tpmCheckbox = screen.getByRole("checkbox", { name: /Use.*TPM/ }); await user.clear(passwordInput); await user.type(passwordInput, "9876"); @@ -118,8 +118,8 @@ describe("EncryptionSettingsDialog", () => { it("allows to stop using it", async () => { const { user } = plainRender(); - const tpmCheckbox = screen.queryByRole("checkbox", { name: /Use the TPM/ }); - const acceptButton = screen.queryByRole("button", { name: "Accept" }); + const tpmCheckbox = screen.getByRole("checkbox", { name: /Use.*TPM/ }); + const acceptButton = screen.getByRole("button", { name: "Accept" }); expect(tpmCheckbox).toBeChecked(); await user.click(tpmCheckbox); expect(tpmCheckbox).not.toBeChecked(); @@ -137,7 +137,7 @@ describe("EncryptionSettingsDialog", () => { it("does not render the TPM checkbox", () => { plainRender(); - expect(screen.queryByRole("checkbox", { name: /Use the TPM/ })).toBeNull(); + expect(screen.queryByRole("checkbox", { name: /Use.*TPM/ })).toBeNull(); }); }); diff --git a/web/src/components/storage/InstallationDeviceField.jsx b/web/src/components/storage/InstallationDeviceField.jsx index a0ef5c6e35..2913d24d7b 100644 --- a/web/src/components/storage/InstallationDeviceField.jsx +++ b/web/src/components/storage/InstallationDeviceField.jsx @@ -35,6 +35,10 @@ import { sprintf } from "sprintf-js"; * @typedef {import ("~/client/storage").StorageDevice} StorageDevice */ +const LABEL = _("Installation device"); +// TRANSLATORS: The storage "Installation device" field's description. +const DESCRIPTION = _("Select the main disk or LVM Volume Group for installation."); + /** * Generates the target value. * @function @@ -58,23 +62,6 @@ const targetValue = (target, targetDevice, targetPVDevices) => { return _("No device selected yet"); }; -/** - * Field description. - * @function - * - * @returns {React.ReactElement} - */ -const renderDescription = () => ( - LVM \ -Volume Group for installation.") - }} - /> -); - const StorageTechSelector = () => { return ( @@ -128,9 +115,9 @@ export default function InstallationDeviceField({ return ( {_("Prepare more devices by configuring advanced")} diff --git a/web/src/components/storage/ProposalResultSection.jsx b/web/src/components/storage/ProposalResultSection.jsx index b3a74a13c7..984573fe98 100644 --- a/web/src/components/storage/ProposalResultSection.jsx +++ b/web/src/components/storage/ProposalResultSection.jsx @@ -140,7 +140,7 @@ const DevicesTreeTable = ({ devicesManager }) => { }; const renderPTableType = (item) => { - // TODO: Create a map for partition table types and use an here. + // TODO: Create a map for partition table types. const type = item.partitionTable?.type; if (type) return {type.toUpperCase()}; };