Consider using WP Script Modules API

[tomalec]

User story

As discussed in during the review of https://github.com/woocommerce/woocommerce-google-analytics-integration/pull/398#discussion_r1540078257 our scripts would be more async and defer friendly. This could let us use the latest WP Script Modules API.

This could let us use a bit more modern standard, and write the code closer to the one actually executed in the browser.

Unfortunately, for now, we cannot switch yet.

1. The API will be available in WP 6.5, which is not released yet, and we need to support older versions.
2. WP API does not support inline modules. And we currently end data using inline scripts. So we would either need to change that approach, or wait for the support.
3. The API does not support classic script dependencies, so we need to depend on classic inline script data (or change the approach). Most importantly, we depend on google-tag-manager, which needs to stay there.

Describe alternatives you've considered

Use classic scripts as we use today.

Acceptance criteria

Unknowns

Out of bounds/rabbit holes

Event tracking

[tomalec]

Speaking of loading the data via inline script, we could work it around as suggested in https://github.com/woocommerce/woocommerce-google-analytics-integration/pull/398#issuecomment-2026047208 by providing the data in HTML:

<wc-ga4w event-data="{JSON with data}">

Then, have a JS module that could define the custom element with no script dependency:

customElements.define( 'wc-ga4w', class extends HTMLElement{ 
    static observedAttributes = ["event-data"];
    attributeChangedCallback 
} );

but we still need to wait for WP 6.5 support, and solve the google-tag-manager script dependency.