tildes-community/tildes-reextended
tildes-community
/
tildes-reextended
1
Fork 0
Code

Make autocomplete also listen for compositionupdate events.

This commit is contained in:
Bauke 2023-08-14 15:09:32 +02:00
parent 6e62ea0036
commit 56b3a7da80
Signed by: Bauke
GPG Key ID: C1C0F29952BCF558
1 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
source/content-scripts/features/autocomplete.tsx
View File

@ -56,6 +56,7 @@ export class AutocompleteFeature extends Component<Props, State> {
// Add a keydown listener for the entire page. // Add a keydown listener for the entire page.
document.addEventListener("keydown", this.globalInputHandler); document.addEventListener("keydown", this.globalInputHandler);
document.addEventListener("compositionupdate", this.globalInputHandler);
log( log(
`Autocomplete: Initialized with ${this.state.groups.size} groups and ` + `Autocomplete: Initialized with ${this.state.groups.size} groups and ` +
@ -63,7 +64,7 @@ export class AutocompleteFeature extends Component<Props, State> {
); );
} }
globalInputHandler = (event: KeyboardEvent) => { globalInputHandler = (event: CompositionEvent | KeyboardEvent) => {
const activeElement = document.activeElement as HTMLElement; const activeElement = document.activeElement as HTMLElement;
// Only add the autocompletes to textareas. // Only add the autocompletes to textareas.
if (activeElement.tagName !== "TEXTAREA") { if (activeElement.tagName !== "TEXTAREA") {
@ -78,7 +79,8 @@ export class AutocompleteFeature extends Component<Props, State> {
) => { ) => {
const dataAttribute = `data-trx-autocomplete-${target}`; const dataAttribute = `data-trx-autocomplete-${target}`;
if (event.key === prefix && !activeElement.getAttribute(dataAttribute)) { const key = event instanceof KeyboardEvent ? event.key : event.data;
if (key === prefix && !activeElement.getAttribute(dataAttribute)) {
activeElement.setAttribute(dataAttribute, "true"); activeElement.setAttribute(dataAttribute, "true");
activeElement.addEventListener("keyup", (event) => { activeElement.addEventListener("keyup", (event) => {
this.textareaInputHandler(event, prefix, target, values); this.textareaInputHandler(event, prefix, target, values);
@ -93,7 +95,7 @@ export class AutocompleteFeature extends Component<Props, State> {
}; };
textareaInputHandler = ( textareaInputHandler = (
event: KeyboardEvent, event: CompositionEvent | KeyboardEvent,
prefix: string, prefix: string,
target: string, target: string,
values: Set<string>, values: Set<string>,