0

I'm trying to add a sound to my chrome extension. It is my understanding it must be done in a service worker and that is where I have it:

 chrome.tts.speak("Hit has been queued",{"lang": "en-US","rate":2.0});

However, when this executes I get this error:

caught error - Cannot read properties of undefined (reading 'speak')

It almost looks like a syntax error in the argument list but I don't see it. Can someone spot what I'm doing wrong? TIA

Updated HTML page without running as an extension

<!doctype html>
<html lang="en">
    <head>
        <title>
            Alert
        </title>
    </head>
    <body>
        <script>
            chrome.tts.speak("Hit added to queue",{"lang":"US-en","rate":2.0});
        </script>
    </body>
</html>

Updated per suggestion

alert.html

<!doctype html>
<html lang="en">
    <head>
        <title>
            Alert
        </title>
    </head>
    <body>
        <script type="application/x-javascript" src="alert.js">
        </script>
    </body>
</html>

alert.js

chrome.tts.speak("Hit added to queue",{"lang":"US-en","rate":2.0});
Wt Riker
  • 514
  • 12
  • 24
  • This API doesn't work in a service worker. – wOxxOm Oct 19 '22 at 14:55
  • Interesting. I read where it MUST be in a service worker. In any case what is the alternative? Thanks. – Wt Riker Oct 19 '22 at 15:52
  • There's no alternative. You'll have to open a new tab/window with your extension html file, so that inside its script you can use this API. – wOxxOm Oct 19 '22 at 17:09
  • I've create a new HTML page using that interface (OP is updated). I still get the same error when loading that page directly in Chrome (no extension). – Wt Riker Oct 21 '22 at 17:33
  • You need to load it via chrome.tabs.create({url: 'page.html'}) so that it has chrome-extension:// URL. – wOxxOm Oct 21 '22 at 17:39
  • I loaded it using crtl+o. I just want to see it it works before adding it to my extension. – Wt Riker Oct 21 '22 at 18:08
  • Well, you can't do it. – wOxxOm Oct 21 '22 at 20:31
  • OK, so now I am struggling with content security. I added this to my manifest 3: "content_security_policy": { "extension_pages": "script-src 'self'; object-src 'self'; script-src-elem 'self' unsafe-inline 'alert.html'" } The error I get it on unsafe-inline. I don't know how to specify a local html file. – Wt Riker Oct 23 '22 at 16:00
  • Use a separate js file: [onclick or inline script isn't working in extension](https://stackoverflow.com/q/13591983) – wOxxOm Oct 23 '22 at 17:04
  • I guess I don't understand. I have that HTML file in my extension directory. I load it using chrome.tabs.create({url:"alert.html"}) from my background script. – Wt Riker Oct 23 '22 at 21:50
  • The link I gave shows how to load a separate js file e.g. you alert.html should have `` and the code should be inside alert.js – wOxxOm Oct 24 '22 at 00:33
  • That is what I've done. My background script uses chrome.tabs.create to load alert.html. As you suggested I load the script (alert.js) from a separate source file. I still get the same error. See updated OP. – Wt Riker Oct 24 '22 at 14:49
  • 1
    Remove `type="application/x-javascript"` and make sure you have tts in permissions in manifest.json. – wOxxOm Oct 24 '22 at 17:05
  • That was it. Weird error message. Thanks. – Wt Riker Oct 25 '22 at 15:59

0 Answers0