diff --git a/web/src/engine/osk/src/banner/suggestionBanner.ts b/web/src/engine/osk/src/banner/suggestionBanner.ts index db2232e35c..7720c9bdc0 100644 --- a/web/src/engine/osk/src/banner/suggestionBanner.ts +++ b/web/src/engine/osk/src/banner/suggestionBanner.ts @@ -498,7 +498,9 @@ export class SuggestionBanner extends Banner { const optionBounding = option.div.getBoundingClientRect(); if(optionBounding.left <= sample.clientX && sample.clientX < optionBounding.right) { - return option; + // If there is no backing suggestion, then there's no real selection. + // May happen when no suggestions are available. + return option.suggestion ? option : null; } else { const dist = (sample.clientX < optionBounding.left ? -1 : 1) * (sample.clientX - optionBounding.left); @@ -509,7 +511,8 @@ export class SuggestionBanner extends Banner { } } - return bestMatch; + // If there is no backing suggestion, then there's no real selection. + return bestMatch.suggestion ? bestMatch : null; } }; @@ -557,7 +560,7 @@ export class SuggestionBanner extends Banner { sourceTracker.source = source; sourceTracker.scrollingHandler = (sample) => { const newScrollLeft = this.scrollState.updateTo(sample); - this.highlightAnimation.setBaseScroll(newScrollLeft); + this.highlightAnimation?.setBaseScroll(newScrollLeft); // Only re-enable the original suggestion, even if the touchpoint finds // itself over a different suggestion. Might happen if a scroll boundary @@ -578,9 +581,9 @@ export class SuggestionBanner extends Banner { }; sourceTracker.suggestion = source.currentSample.item; - markSelection(sourceTracker.suggestion); - - source.currentSample.item.highlight(true); + if(sourceTracker.suggestion) { + markSelection(sourceTracker.suggestion); + } const terminationHandler = () => { if(sourceTracker.suggestion) {