Skip to content

[Bug]: button-base aria label not updating on change #5620

@SavkaTaras

Description

@SavkaTaras

Code of conduct

  • I agree to follow this project's code of conduct.

Impacted component(s)

Button

Library version

1.7.0

Expected behavior

The aria-label should be preserved when slot content changes, maintaining the accessibility label set via the label prop.

Actual behavior

The aria-label gets completely removed when slot content changes, breaking accessibility for users who rely on screen readers.

Screenshots

No response

What browsers are you seeing the problem in?

Chrome

How can we reproduce this issue?

  1. Create an sp-button with a label prop:

    <sp-button label="Test Label">
        Initial Content
    </sp-button>
  2. Verify the aria-label is set correctly:

    const button = document.querySelector('sp-button');
    console.log(button.getAttribute('aria-label')); // "Test Label"
  3. Change the slot content:

    button.textContent = 'Updated Content';
    // or
    button.innerHTML = '<span>New Content</span>';
  4. Observe that the aria-label is removed:

    console.log(button.getAttribute('aria-label')); // null or empty

Sample code or abstract reproduction which illustrates the problem

No response

Severity

SEV 3

Logs taken while reproducing problem

No response

Would you like to track this issue in Jira?

  • Yes, please tell me the ticket number!

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions