3

Edge claims to support webkitSpeechRecognition, but it doesn't work (discussion here, doesn't work on websites meant for testing, like this mozilla one, with the error "Error occurred in recognition: language-not-supported" despite my US english UI).

How can I detect if webkitSpeechRecognition is actually supported? I tried to filter out Edge by looking at the user agent, but it shows up as Chrome, and I'd prefer to just use feature detection rather than looking at the user agent anyway. I'd like to check this without requesting microphone permission (if I did request microphone permission, I'd have to wait for them to accept, and then see the language-not-supported error). Is there a simple way to check this, similar to just checking the value of window["webkitSpeechRecognition"] (which is defined in Edge, despite not working)?

www
  • 55
  • 1
  • 7
  • Why not instantiate it and wrap it in a `try/catch`? This is exactly one of those situations where you may want to do that. My US-language mac with Edge is having no issues with that web page. – somethinghere Feb 01 '21 at 23:32
  • @somethinghere oh, hm, I just downloaded edge a few days ago, and the page doesn't work for me! I immediately get "Error occurred in recognition: language-not-supported". The answer below says "It looks like this feature is currently under development and to use it we need to enable it by passing the command line arguments." — did you do that? I probably will use the try/catch way, but I'd prefer to not request microphone permission if the user isn't going to be able to use it – www Feb 02 '21 at 16:38
  • No, but I might be using an older canary version, now that I think about it. Why not test in chrome for now, while microsoft is working on it? Just catch the error to decide if it works! – somethinghere Feb 02 '21 at 22:25
  • Right, I just would prefer if there was a way to see if speech recognition was supported without first asking the user for microphone permission, which it seems like there may not be. – www Feb 02 '21 at 22:32
  • Well, technically the presence of that object should be enough. Safari doesn’t have that API, so you check by presence. Just to be sure, did you set the language of the speech recognition itself object to ‘en-US’, right? Not sure if its required but mdns examples do it. – somethinghere Feb 02 '21 at 22:43
  • 1
    The presence of which object, `recognizer = new window["webkitSpeechRecognition"]()` ? Yeah, that object is defined in Edge, it just doesn't recognize any text. Safari e.g. returns false for `window["webkitSpeechRecognition"]`, so I have no problems there. You don't have to set the language (it defaults to user agent's language setting), but even if I do, I get the same error. And I get the same error on the mozilla example too :) – www Feb 02 '21 at 22:57

2 Answers2

2

If you want to check the support for webkitSpeechRecognition then you can refer to the JS code example below.

if ('SpeechRecognition' in window || 'webkitSpeechRecognition' in window) 
{
  console.log("speech recognition API supported");
} 
else 
{
  console.log("speech recognition API not supported")
}

Output in MS Edge 88.0.705.56:

enter image description here

However, if you directly try to make a test using webkitSpeechRecognition then it will not work.

It looks like this feature is currently under development and to use it we need to enable it by passing the command line arguments.

I suggest you refer to the steps below.

  1. Create a shortcut of the Edge chromium-browser.
  2. Right-click the shortcut file and go to Properties.
  3. Under Shortcut tab, in the Target textbox, add --enable-features=msSpeechRecognition after the msedge.exe path. Make sure to add 1 space between the path and command-line argument.

It should look like below.

enter image description here

  1. Click on the OK button to close the properties window.
  2. Launch the Edge browser via shortcut and visit any sample code example for SpeechRecognition. Here I am making a test with this example.

Output in MS Edge 88.0.705.56:

enter image description here

Deepak-MSFT
  • 10,379
  • 1
  • 12
  • 19
  • Thank you for the answer! Hm, how is the user supposed to know to pass in the command line arguments? Shouldn't webkitSpeechRecognition return false if it doesn't work without extra configuration? I want my site to have different behavior if the user can speak, so I need to be able to check for that. – www Feb 02 '21 at 16:55
  • I suggest you wait for the official release of this feature. You can keep track of the latest updates to know whether this feature is released, after that you can try to implement it for the Edge browser. At present, you can identify the Edge browser using a user agent string and try to bypass your code for SpeechRecognition. Here is an [example code](https://justpaste.it/2jz2g) to identify the Edge browser using the user agent string. Further, you can provide feedback to Microsoft by pressing the `ALT + SHIFT + I` key in the Edge browser. Thanks for your understanding. – Deepak-MSFT Feb 03 '21 at 01:43
  • Try to check whether your production site has some code that overrides the user agent string. – Deepak-MSFT Feb 03 '21 at 09:17
0

In addition, it's useful to check for errors (as shown in the above example source code, see below, https://www.google.com/intl/en/chrome/demos/speech.html): for instance audio might be disabled if not on a https website.

  recognition.onerror = function(event) {
    if (event.error == 'no-speech') {
      start_img.src = '/intl/en/chrome/assets/common/images/content/mic.gif';
      showInfo('info_no_speech');
      ignore_onend = true;
    }
    if (event.error == 'audio-capture') {
      start_img.src = '/intl/en/chrome/assets/common/images/content/mic.gif';
      showInfo('info_no_microphone');
      ignore_onend = true;
    }
    if (event.error == 'not-allowed') {
      if (event.timeStamp - start_timestamp < 100) {
        showInfo('info_blocked');
      } else {
        showInfo('info_denied');
      }
      ignore_onend = true;
    }
  };
bfredo123
  • 462
  • 1
  • 8
  • 20