0

I was trying to implement a voice controlled navigation feature for my reactjs web application and I accidently broke it for Opera, Edge but it works fine on Google Chrome.

I just introduced this code to my Main.js codebase:

  const history = useHistory();
  recognition.onresult = (event) => {
    const command = event.results[0][0].transcript;

    if (command.includes("navigate to") || command.includes("go to")) {
      if (command.includes("home") || command.includes("index")) {
        history.push("/home");
      } else if (command.includes("education") || command.includes("index")) {
        history.push("/education");
      } else if (command.includes("experience") || command.includes("index")) {
        history.push("/experience");
      } else if (command.includes("contact") || command.includes("index")) {
        history.push("/contact");
      } else if (command.includes("projects") || command.includes("index")) {
        history.push("/projects");
      } else if (command.includes("hobbies") || command.includes("index")) {
        history.push("/hobbies");
      }
    } else if (command.includes("go back")) {
      history.goBack();
    }
  };

  recognition.onend = () => {
    recognition.start();
  };

And this is recognition:

const SpeechRecognition =
  window.SpeechRecognition || window.webkitSpeechRecognition;

export const recognition = new SpeechRecognition();

recognition.start();

Now when I open the website using Opera

LVL4 (core: 98.0.4759.74) Update stream:Early Access System:Windows 10 64-bit Chromium version:112.0.5615.165

it just shows a blank empty white page. When using Edge it loads the page and asks for permission to use microphone, once I give permission Edge freezes for a couple of seconds then it crashes and closes. But using Google Chrome

Version 113.0.5672.127 (Official Build) (64-bit)

which is the latest version it works perfectly fine, it asks for microphone permission once I give it permission the feature works fine and I can navigate from page to page no problem.

Updating Edge made so that giving microphone permission no longer crashes Edge. The website works and it shows that microphone is in use on the web application tab in Edge but the voice controlled navigation doesn't work. Giving commands doesn't redirect to the specified routes.

Moe_blg
  • 71
  • 4

0 Answers0