IE11: Autocomplete with dropdown and multiple selection requires doubleclick

[mertsincan]

Test;

import React, { useState } from 'react';
import './App.css';
import { AutoComplete } from 'primereact/autocomplete';

import 'primereact/resources/themes/nova-light/theme.css';
import 'primereact/resources/primereact.min.css';
import 'primeicons/primeicons.css';

const App = (props) => {

  if(!String.prototype.startsWith) {
    String.prototype.startsWith = function (searchString, position) {
      position = position || 0;
      return this.substr(position, searchString.length) === searchString;
    };
  }

  const [value,] = useState([
    { label: "a", value: "a" },
    { label: "b", value: "b" }
  ]);

  const [values,] = useState([
    { label: "a", value: "a" },
    { label: "b", value: "b" },
    { label: "c", value: "c" }
  ]);

  // Values that match the input for Autocomplete, does not contain already selected Values
  const [filtered, setFiltered] = React.useState();

  /**
   * Called when a User types into the TextInput, sets the filtered Array to the suggestions matching the querystring.
   * Ignores suggestions already included in values
   * @param event Current QueryString
   */
  const onInput = (event) => {
    let results = values.filter((suggestion) => {
      return suggestion.label
        && suggestion.label.toLowerCase().startsWith(event.query.toLowerCase())
        && !value.some(x => x.value === suggestion.value);
    });
    setFiltered(results);
  }

  return (
    <div className="App">
      <AutoComplete
        value={value}
        suggestions={filtered}
        completeMethod={onInput}
        field={"label"}
        multiple={true}
        onChange={e => console.log(e)}
        className={"id-acom-chips"}
        dropdown={true} />
    </div>
  );
}

export default App;