Skip to content

searchPhraseUpdated

searchPhraseUpdated is a DOM event that occurs whenever the search phrase inside the h-storefront-search webcomponent is updated.

Event body

The searchPhraseUpdated body has a TSearchPhaseEventBody type which represents the details of the updated search phrase. It is optional so it might not exist.

Example

In this example we listen to searchPhraseUpdated event and perform an action whenever it's emitted.

useStorefront(async (storefront) => {
    document.addEventListener('searchPhraseUpdated', (event) => {
        const detail = event.detail;

        if (!detail) return;

        const { searchPhrase, moduleInstanceId } = detail;

        console.log('Search of id ', moduleInstanceId, ' has been updated to ', searchPhrase);
    });
});