Skip to content

Panel: pass ID for header text element to custom renderer#4469

Merged
ecraig12345 merged 6 commits intomicrosoft:masterfrom
ecraig12345:panel-header-id
Apr 5, 2018
Merged

Panel: pass ID for header text element to custom renderer#4469
ecraig12345 merged 6 commits intomicrosoft:masterfrom
ecraig12345:panel-header-id

Conversation

@ecraig12345
Copy link
Copy Markdown
Member

Pull request checklist

  • Addresses an existing issue: Fixes #0000
  • Include a change request file using $ npm run change

Description of changes

The dialog inside Panel uses the panel header text as its ARIA label, referencing the header text element using aria-labelledby=<header text id>. That works fine with the default renderer, but custom renderers had no way to assign the correct ID, meaning the panel title was not read.

As a fix, this PR adds an additional headerTextId param to the header renderer.

@ecraig12345 ecraig12345 requested a review from joschect April 5, 2018 00:12
</div>
<div className={ css('ms-Panel-contentInner', styles.contentInner) } >
{ onRenderHeader(this.props, this._onRenderHeader) }
{ onRenderHeader(this.props, this._onRenderHeader, headerTextId) }
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: it should match popup, with headerText && headerTextId. An optional change though.

@ecraig12345 ecraig12345 merged commit 236047d into microsoft:master Apr 5, 2018
@ecraig12345 ecraig12345 deleted the panel-header-id branch April 5, 2018 01:23
@microsoft microsoft locked as resolved and limited conversation to collaborators Aug 31, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants