Send message not working from custom html page.

[coure2011]

I have just cloned the latest vitesse-webext project and added the following code, which is sending message correctly.

// src/options/Options.vue
<script setup lang="ts">
import { sendMessage, onMessage } from 'webext-bridge'

import { storageDemo } from '~/logic/storage'

const logIt = async() => {
  console.log('hello there')
  const dd = await sendMessage('get-current-tab', {}, 'background')
  console.log(dd)
}
</script>

It logged both console messages when Log it button is clicked.

Now I have another page which I can access at url: chrome-extension://[id-of-extension]/test/index.html, which contains the same code to send message but its failing silently.

// src/test/Options.vue 
<script setup lang="ts">
import { sendMessage, onMessage } from 'webext-bridge'

import { storageDemo } from '~/logic/storage'

const logIt = async() => {
  console.log('hello there')
  const dd = await sendMessage('get-current-tab', {}, 'background')
  console.log(dd)
}
</script>

the complete code can be found at https://stackblitz.com/edit/vitejs-vite-ngk771?file=src%2Ftest%2FOptions.vue&terminal=dev