Skip to content

fix: associate transform preview with its visible label - #1787

Open
sridharkalaibala wants to merge 1 commit into
josdejong:developfrom
sridharkalaibala:fix/transform-preview-label
Open

sridharkalaibala wants to merge 1 commit into
josdejong:developfrom
sridharkalaibala:fix/transform-preview-label

Conversation

@sridharkalaibala

Copy link
Copy Markdown

Fixes #1573.

The Transform dialog renders "Preview" as an unassociated div, leaving its read-only textarea without an accessible name. Wrap the existing translated text in a native label targeting the preview. Allow label activation through the dialog's click handler so clicking "Preview" focuses the textarea, while preserving the existing layout.

Validation:

  • Added DOM regression tests for English and French label association, uncancelled label activation, and unchanged read-only preview output. The association assertion failed on the original source.
  • npm run build-and-test passes: build, all 71 tests, and StandardJS lint.
  • Verified the built editor in Chromium: the accessibility tree names the textarea "Preview", and clicking its visible label focuses it with the expected JSON content.

Implemented and validated with OpenAI Codex assistance. No screen-reader software test was performed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Label 'Preview' is not associated with its edit field present under 'Transform' dialog box.

1 participant