richard pushed to branch tor-browser-115.8.0esr-13.5-1 at The Tor Project / Applications / Tor Browser

Commits: 0697c148 by Henry Wilkes at 2024-02-22T15:13:53+00:00 fixup! Bug 31286: Implementation of bridge, proxy, and firewall settings in about:preferences#connection

Bug 42425: Move the accessible name of the emoji cells from the cell to its image child.

NVDA only reads the text content of a cell when navigating a "table".

Also, change the "table" in the user provide dialog to use the role "cell" rather than "gridcell" (the later is only meant for the "grid" role).

The "Emoji" description is incorporated into the "alt" of the image instead. Before the description was not read out when doing screen reader table navigation with either Orca or NVDA.

- - - - - f2e7749d by Henry Wilkes at 2024-02-22T15:13:54+00:00 fixup! Tor Browser strings

Bug 42425: Move the bridge emoji accessible name into the image.

- - - - -

5 changed files:

- browser/components/torpreferences/content/bridgemoji/BridgeEmoji.js - browser/components/torpreferences/content/connectionPane.js - browser/components/torpreferences/content/provideBridgeDialog.js - browser/components/torpreferences/content/provideBridgeDialog.xhtml - browser/locales/en-US/browser/tor-browser.ftl

Changes:

===================================== browser/components/torpreferences/content/bridgemoji/BridgeEmoji.js ===================================== @@ -119,7 +119,7 @@ doc.defaultView.console.error(`No emoji for index ${this.#index}`); emojiName = unknownString; } - doc.l10n.setAttributes(this, "tor-bridges-emoji-cell", { + doc.l10n.setAttributes(this.#img, "tor-bridges-emoji-image", { emojiName, }); }

===================================== browser/components/torpreferences/content/connectionPane.js ===================================== @@ -253,19 +253,11 @@ const gBridgeGrid = { */ _rowTemplate: null,

- /** - * @typedef {object} EmojiCell - * - * @property {Element} cell - The grid cell element. - * @property {Element} img - The grid cell icon. - * @property {Element} index - The emoji index. - */ /** * @typedef {object} BridgeGridRow * * @property {Element} element - The row element. * @property {Element} optionsButton - The options button. - * @property {EmojiCell[]} emojis - The emoji cells. * @property {Element} menu - The options menupopup. * @property {Element} statusEl - The bridge status element. * @property {Element} statusText - The status text.

===================================== browser/components/torpreferences/content/provideBridgeDialog.js ===================================== @@ -469,7 +469,7 @@ const gProvideBridgeDialog = { for (const cell of BridgeEmoji.createForAddress(bridgeLine)) { // Each emoji is its own cell, we rely on the fact that createForAddress // always returns four elements. - cell.setAttribute("role", "gridcell"); + cell.setAttribute("role", "cell"); cell.classList.add("tor-bridges-grid-cell", "tor-bridges-emoji-cell"); emojiBlock.append(cell); }

===================================== browser/components/torpreferences/content/provideBridgeDialog.xhtml ===================================== @@ -75,13 +75,13 @@ <html:div class="tor-bridges-grid-row" role="row"> <html:span class="tor-bridges-type-cell tor-bridges-grid-cell" - role="gridcell" + role="cell" ></html:span> <html:span class="tor-bridges-emojis-block" role="none"></html:span> <html:span class="tor-bridges-grid-end-block" role="none"> <html:span class="tor-bridges-address-cell tor-bridges-grid-cell" - role="gridcell" + role="cell" > <html:span class="tor-bridges-address-cell-text"></html:span> </html:span>

===================================== browser/locales/en-US/browser/tor-browser.ftl ===================================== @@ -84,12 +84,11 @@ tor-bridges-built-in-status-connected = Connected tor-bridges-type-prefix = { $type } bridge: # Shown at the start of a Tor bridge line, when the transport type is unknown (or "vanilla"). tor-bridges-type-prefix-generic = Tor bridge: -# The name and accessible description for a bridge emoji cell. Each bridge address can be hashed into four emojis shown to the user (bridgemoji feature). This cell corresponds to a *single* such emoji. The "title" should just be emojiName. The "aria-description" should give screen reader users enough of a hint that the cell contains a single emoji. +# Used for an image of a bridge emoji. Each bridge address can be hashed into four emojis shown to the user (bridgemoji feature). This string corresponds to a *single* such emoji. The "title" should just be emojiName. The "alt" should let screen readers know that the image is of a *single* emoji, as well as its name. # $emojiName (String) - The name of the emoji, already localized. -# E.g. with Orca screen reader in en-US this would read "unicorn. Row 2 Column 2. Emoji". -tor-bridges-emoji-cell = +tor-bridges-emoji-image = + .alt = Emoji: { $emojiName } .title = { $emojiName } - .aria-description = Emoji # The emoji name to show on hover when a bridge emoji's name is unknown. tor-bridges-emoji-unknown = Unknown # Shown when the bridge has been used for the most recent Tor circuit, i.e. the most recent bridge we have connected to.

View it on GitLab: https://gitlab.torproject.org/tpo/applications/tor-browser/-/compare/4b5aa8f...