Add Microsoft UET to registry

[joachimhviid]

Script can be found here

I attempted to implement it myself like below, but I am running into problems with UET not being available from the script that is being set, since it is part of the script being loaded.

const { uetq, $script } = useRegistryScript('bing', () => ({
  scriptInput: {
    src: 'https://bat.bing.com/bat.js',
    async: true,
    crossorigin: false,
  },
  scriptOptions: {
    use() {
      return { uetq: window.uetq }
    },
  },
  clientInit: import.meta.server
    ? undefined
    : () => {
        window.uetq = window.uetq || []

        const options = { ti: 'YOUR_KEY_HERE', enableAutoSpaTracking: true }
        // @ts-expect-error untyped
        options.queue = window.uetq
        // @ts-expect-error untyped
        window.uetq = new UET(options)

        window.uetq.push('consent', 'default', { ad_storage: 'denied' })
      },
}))

The original script creates a brand new script element with https://bat.bing.com/bat.js as the source and then sets the window.uetq from there, but I am unsure how to recreate that in a registry script.

[harlan-zw]

Hey, I'll leave this issue open to discuss the issues you're running into but would you mind also posting this integration in #177.

Thanks!

[joachimhviid]

Posting my workaround from #177 in here as well. The following worked for me, but unfortunately only through the $script object.

const { $script } = useScript(
  {
    src: 'https://bat.bing.com/bat.js',
    crossorigin: false,
  },
  {
    use() {
      return { uetq: window.uetq }
    },
  },
)

watch($script.status, (status) => {
  if (status === 'loaded') {
    const options = { ti: 'TAG_ID_HERE', enableAutoSpaTracking: true }
    // @ts-expect-error untyped
    options.q = window.uetq
    // @ts-expect-error untyped
    window.uetq = new UET(options)
  }
})

[harlan-zw]

Slight DX on the loading improvement. I'll look at the other issues when I next do a round of 3p scripts. Will close for now in favour of the item on #177

const { onLoaded } = useScript(
  {
    src: 'https://bat.bing.com/bat.js',
    crossorigin: false,
  },
  {
    use() {
      return { uetq: window.uetq }
    },
  },
)

onLoaded((uetq) => {
    const options = { ti: 'TAG_ID_HERE', enableAutoSpaTracking: true }
    // @ts-expect-error untyped
    options.q = uetq
    // @ts-expect-error untyped
    window.uetq = new UET(options)
})