connected

connected is a DOM event that occurs whenever any webcomponent in Storefront gets connected thus firing the connectedCallback Lit lifecycle method.

Event body

none

Example

In this example we listen to connected event on a product-review webcomponent and perform an action whenever it's emitted. Note that during the first page load the lifecycle method will probably occur before you get to listen to it but it will fire every time after that.

useStorefront(async (storefront) => {
    const $productReview = document.querySelector('product-review');

    $productReview.addEventListener('connected', () => {
        console.log('Reviews have been connected');
    });
});