Algolia autocomplete doesn't go to the selected URL with static sources

Question

I've copied the default autocomplete code for static sources, the completion, and filters work, and getItemURL is called correctly, however on click the URL does not change.

I've created a sandbox you can see it here.

Default code:

const { autocomplete } = window["@algolia/autocomplete-js"];
const autocomplete_id = "#autocomplete-search-box";

function CreateAutoComplete(appid, search_api_key, index_name) {
  console.log("CreateAutoComplete Called");
  autocomplete({
    container: autocomplete_id,
    placeholder: "Type T to get completions",
    getSources() {
      return [
        {
          sourceId: "links",
          getItems({ query }) {
            const items = [
              { label: "Twitter", url: "https://twitter.com" },
              { label: "GitHub", url: "https://github.com" }
            ];

            return items.filter(({ label }) =>
              label.toLowerCase().includes(query.toLowerCase())
            );
          },
          getItemUrl({ item }) {
            console.log("GetItemURL", item);
            console.log("returning", item.url);
            return item.url;
          },
          templates: {
            item({ item }) {
              return item.label;
            }
          }
        }
      ];
    }
  });
}

Answer 1

Remember that getItemUrl() is expecting a keyboard interaction (navigate via arrows and click enter) to navigate over to the result URL, not a click.

This is working in your codesandbox, although the redirect is being blocked by Twitter/Github.