FIX: attempts to update select-kit on keyboard (#26345)

Prior to this change the dropdown could appear offscreen due to its position not being updated after the appearance of the keyboard.
This commit is contained in:
Joffrey JAFFEUX 2024-03-25 22:58:11 +01:00 committed by GitHub
parent 285306ff3f
commit 2a1b675af7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 22 additions and 6 deletions

View File

@ -3,6 +3,7 @@ import EmberObject, { computed, get } from "@ember/object";
import { guidFor } from "@ember/object/internals";
import Mixin from "@ember/object/mixin";
import { bind, cancel, next, schedule, throttle } from "@ember/runloop";
import { service } from "@ember/service";
import { isEmpty, isNone, isPresent } from "@ember/utils";
import { createPopper } from "@popperjs/core";
import { Promise } from "rsvp";
@ -10,6 +11,7 @@ import { INPUT_DELAY } from "discourse-common/config/environment";
import discourseDebounce from "discourse-common/lib/debounce";
import deprecated from "discourse-common/lib/deprecated";
import { makeArray } from "discourse-common/lib/helpers";
import { bind as bindDecorator } from "discourse-common/utils/decorators";
import I18n from "discourse-i18n";
import PluginApiMixin, {
applyContentPluginApiCallbacks,
@ -59,6 +61,7 @@ export default Component.extend(
labelProperty: null,
titleProperty: null,
langProperty: null,
appEvents: service(),
init() {
this._super(...arguments);
@ -192,6 +195,8 @@ export default Component.extend(
didInsertElement() {
this._super(...arguments);
this.appEvents.on("keyboard-visibility-change", this, this._updatePopper);
if (this.selectKit.options.expandedOnInsert) {
this._open();
}
@ -207,6 +212,12 @@ export default Component.extend(
this._cancelSearch();
this.appEvents.off(
"keyboard-visibility-change",
this,
this._updatePopper
);
if (this.popper) {
this.popper.destroy();
this.popper = null;
@ -375,7 +386,7 @@ export default Component.extend(
this.errorsCollection.pushObject(error);
}
this._safeAfterRender(() => this.popper && this.popper.update());
this._safeAfterRender(() => this._updatePopper());
},
clearErrors() {
@ -409,7 +420,7 @@ export default Component.extend(
},
_onInput(event) {
this.popper && this.popper.update();
this._updatePopper();
if (this._searchPromise) {
cancel(this._searchPromise);
@ -481,7 +492,7 @@ export default Component.extend(
if (this.selectKit.options.focusAfterOnChange) {
this._safeAfterRender(() => {
this._focusFilter();
this.popper && this.popper.update();
this._updatePopper();
});
}
}
@ -641,7 +652,7 @@ export default Component.extend(
"selectKit.isLoading": true,
"selectKit.enterDisabled": true,
});
this._safeAfterRender(() => this.popper && this.popper.update());
this._safeAfterRender(() => this._updatePopper());
let content = [];
@ -707,7 +718,7 @@ export default Component.extend(
this._safeAfterRender(() => {
if (this.selectKit.isExpanded) {
this.popper && this.popper.update();
this._updatePopper();
this._focusFilter();
}
});
@ -1024,7 +1035,7 @@ export default Component.extend(
this._safeAfterRender(() => {
this._focusFilter();
this._scrollToCurrent();
this.popper && this.popper.update();
this._updatePopper();
});
},
@ -1102,6 +1113,11 @@ export default Component.extend(
this._handleDeprecatedArgs();
},
@bindDecorator
_updatePopper() {
this.popper?.update?.();
},
_computePlacementStrategy() {
let placementStrategy = this.selectKit.options.placementStrategy;