algolia / instantsearch

🐛 Current behavior

Somewhere between algoliasearch@4.20.0 and 4.22.1, the html function used in a template changed such that html`` (empty string in html function) returns string undefined to template.

🔍 Steps to reproduce

return html`` in a template

Live reproduction

na

💭 Expected behavior

Should be equivalent to return '' instead of return 'undefined'

Package version

instantsearch.js@4.65.0

Operating system

na

Browser

na

Code of Conduct

I agree to follow this project's Code of Conduct

For which component is this, I just did a quick test for hits and can't reproduce:

test('renders empty template using `html`', async () => {
  const container = document.createElement('div');
  const searchClient = createMockedSearchClient();

  const search = instantsearch({ indexName: 'indexName', searchClient });

  search.addWidgets([
    hits({
      container,
      templates: {
        item(_, { html }) {
          return html``;
        },
      },
    }),
  ]);

  search.start();

  await wait(0);

  expect(container).toMatchInlineSnapshot(`
    <div>
      <div
        class="ais-Hits"
      >
        <ol
          class="ais-Hits-list"
        >
          <li
            class="ais-Hits-item"
          />
          <li
            class="ais-Hits-item"
          />
        </ol>
      </div>
    </div>
  `);
});

If there's anything happening that's causing it, I think it may be around here in the code, where undefined somehow gets casted as a string? If there's a clear repro, I wonder if the content === null check should be just !content as that shouldn't render in any case.

instantsearch/packages/instantsearch.js/src/components/Template/Template.tsx

Line 101 in a047839

if (content === null) {

It was in my template.empty, e.g.,

hits({
  // ...
  templates: {
    empty(results, { html }) {
      return html``;
    },
  },
});

html template function returns "undefined" with empty string