Initialize aria-pressed for toggle buttons

Author: Kevinjohn

js/src/button.js

@@ -27,6 +27,16 @@ const EVENT_CLICK_DATA_API = `click${EVENT_KEY}${DATA_API_KEY}`
  */
 
 class Button extends BaseComponent {
+  constructor(element) {
+    super(element)
+
+    if (!this._element || this._element.hasAttribute('aria-pressed')) {
+      return
+    }
+
+    this._element.setAttribute('aria-pressed', this._element.classList.contains(CLASS_NAME_ACTIVE))
+  }
+
   // Getters
   static get NAME() {
     return NAME

js/tests/unit/button.spec.js

@@ -22,6 +22,23 @@ describe('Button', () => {
     expect(buttonByElement._element).toEqual(buttonEl)
   })
 
+  it('should initialize aria-pressed when missing', () => {
+    fixtureEl.innerHTML = [
+      '<button class="btn" data-bs-toggle="button"></button>',
+      '<button class="btn active" data-bs-toggle="button"></button>',
+      '<button class="btn active" data-bs-toggle="button" aria-pressed="false"></button>'
+    ].join('')
+
+    const buttons = fixtureEl.querySelectorAll('[data-bs-toggle="button"]')
+
+    const buttonInstances = [...buttons].map(button => new Button(button))
+
+    expect(buttonInstances).toHaveSize(3)
+    expect(buttons[0].getAttribute('aria-pressed')).toEqual('false')
+    expect(buttons[1].getAttribute('aria-pressed')).toEqual('true')
+    expect(buttons[2].getAttribute('aria-pressed')).toEqual('false')
+  })
+
   describe('VERSION', () => {
     it('should return plugin version', () => {
       expect(Button.VERSION).toEqual(jasmine.any(String))