Skip to content

Commit

Permalink
Handle reentrant focus/blur events correctly, see phetsims/scenery#1550
Browse files Browse the repository at this point in the history
… (details below)

1. PDOMTree before/after op uses all Displays, and moves blockFocusCallbacks from Display to BrowserEvents (to catch before batching)
2. Adds EventContext, replaced with Event in many cases, so we can store activeElement (or other future things) from when the event fired
3. Adds a better way of synthesizing fake events (EventContext.createSynthetic()), so that we don't need conditionals on events. Pointer.lastEventContext should be guaranteed once it's set up once.
4. Adds activeElement to SceneryEvent
5. ComboBox ListBox selection doesn't rely on seeing if the box gets focus. We directly focus the item instead instead of the redirection
6. Regenerated phet-io APIs
  • Loading branch information
jonathanolson committed Apr 26, 2023
1 parent 6927a82 commit 9f6618d
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 11 deletions.
2 changes: 1 addition & 1 deletion js/ComboBox.ts
Original file line number Diff line number Diff line change
Expand Up @@ -354,7 +354,7 @@ export default class ComboBox<T> extends WidthSizable( Node ) {
// Clicking on the button toggles visibility of the list box
this.button.addListener( () => {
this.listBox.visibleProperty.value = !this.listBox.visibleProperty.value;
this.listBox.visibleProperty.value && this.listBox.focus();
this.listBox.focusListItemNode( property.value );
} );

this.display = null;
Expand Down
19 changes: 9 additions & 10 deletions js/ComboBoxListBox.ts
Original file line number Diff line number Diff line change
Expand Up @@ -220,16 +220,6 @@ export default class ComboBoxListBox<T> extends Panel {

// pdom listener for the entire list box
this.addInputListener( {

// When the list box gets focus, transfer focus to the ComboBoxListItemNode that matches property.value.
focus: () => {
if ( this.visible ) {
const listItemNode = this.getListItemNode( property.value );
listItemNode.supplyOpenResponseOnNextFocus();
listItemNode.focus();
}
},

// Handle keydown
keydown: event => {
if ( event.domEvent && KeyboardUtils.isAnyKeyEvent( event.domEvent, [ KeyboardUtils.KEY_ESCAPE, KeyboardUtils.KEY_TAB ] ) ) {
Expand Down Expand Up @@ -324,6 +314,15 @@ export default class ComboBoxListBox<T> extends Panel {
return listItemNode;
}

/**
* Focuses the ComboBoxListItemNode that corresponds to a specified value
*/
public focusListItemNode( value: T ): void {
const listItemNode = this.getListItemNode( value );
listItemNode.supplyOpenResponseOnNextFocus();
listItemNode.focus();
}

/**
* voice the response from selecting a new item Node. The response will differ depending on if the selection
* changed the Property.
Expand Down

0 comments on commit 9f6618d

Please sign in to comment.