Handle non-empty whitespace textContent in Tooltip trigger (#36588)

twbs · Jul 6, 2022 · 3f324ee · 3f324ee
1 parent 7d0b224
commit 3f324ee
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/js/src/tooltip.js b/js/src/tooltip.js
@@ -518,7 +518,7 @@ class Tooltip extends BaseComponent {
       return
     }
 
-    if (!this._element.getAttribute('aria-label') && !this._element.textContent) {
+    if (!this._element.getAttribute('aria-label') && !this._element.textContent.trim()) {
       this._element.setAttribute('aria-label', title)
     }
 

diff --git a/js/tests/unit/tooltip.spec.js b/js/tests/unit/tooltip.spec.js
@@ -1358,6 +1358,25 @@ describe('Tooltip', () => {
       })
     })
 
+    it('should add the aria-label attribute when element text content is a whitespace string', () => {
+      return new Promise(resolve => {
+        fixtureEl.innerHTML = '<a href="#" rel="tooltip" title="A tooltip"><span>    </span></a>'
+
+        const tooltipEl = fixtureEl.querySelector('a')
+        const tooltip = new Tooltip(tooltipEl)
+
+        tooltipEl.addEventListener('shown.bs.tooltip', () => {
+          const tooltipShown = document.querySelector('.tooltip')
+
+          expect(tooltipShown).not.toBeNull()
+          expect(tooltipEl.getAttribute('aria-label')).toEqual('A tooltip')
+          resolve()
+        })
+
+        tooltip.show()
+      })
+    })
+
     it('should not add the aria-label attribute if the attribute already exists', () => {
       return new Promise(resolve => {
         fixtureEl.innerHTML = '<a href="#" rel="tooltip" aria-label="Different label" title="Another tooltip"></a>'