js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 04:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

backport 1764

Browse Source
This commit is contained in:
Cory LaViska
2023-12-06 12:02:20 -05:00
parent 340351ca4b
commit 4f8417806c
3 changed files with 15 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
docs/pages/resources/changelog.md
View File

@@ -24,6 +24,7 @@ New versions of Web Awesome are released as-needed and generally occur when a cr
- Added the `hover-bridge` feature to `<sl-popup>` to support better tooltip accessibility [#1734]
- Fixed a bug in `<sl-input>` and `<sl-textarea>` that made it work differently from `<input>` and `<textarea>` when using defaults [#1746]
- Fixed a bug in `<sl-select>` that prevented it from closing when tabbing to another select inside a shadow root [#1763]
- Improved the accessibility of `<sl-tooltip>` so they persist when hovering over the tooltip and dismiss when pressing [[Esc]] [#1734]
## 2.12.0

19
src/components/select/select.component.ts
View File

@@ -223,15 +223,22 @@ export default class WaSelect extends WebAwesomeElement implements WebAwesomeFor
}
private addOpenListeners() {
document.addEventListener('focusin', this.handleDocumentFocusIn);
document.addEventListener('keydown', this.handleDocumentKeyDown);
document.addEventListener('mousedown', this.handleDocumentMouseDown);
//
// Listen on the root node instead of the document in case the elements are inside a shadow root
//
// https://github.com/shoelace-style/shoelace/issues/1763
//
const root = this.getRootNode();
root.addEventListener('focusin', this.handleDocumentFocusIn);
root.addEventListener('keydown', this.handleDocumentKeyDown);
root.addEventListener('mousedown', this.handleDocumentMouseDown);
}
private removeOpenListeners() {
document.removeEventListener('focusin', this.handleDocumentFocusIn);
document.removeEventListener('keydown', this.handleDocumentKeyDown);
document.removeEventListener('mousedown', this.handleDocumentMouseDown);
const root = this.getRootNode();
root.removeEventListener('focusin', this.handleDocumentFocusIn);
root.removeEventListener('keydown', this.handleDocumentKeyDown);
root.removeEventListener('mousedown', this.handleDocumentMouseDown);
}
private handleFocus() {

1
src/components/select/select.test.ts
View File

@@ -156,6 +156,7 @@ describe('<wa-select>', () => {
await el.updateComplete;
await sendKeys({ press: 'ArrowDown' }); // move selection to the third option
await el.updateComplete;
el.focus(); // For some reason, the browser loses focus before we press enter. Refocus the select.
await sendKeys({ press: 'Enter' }); // commit the selection
await el.updateComplete;