Closed thiagoss closed 3 years ago
https://github.com/thiagoss/react-speech-recognition/tree/example-issue-63
Example here adapted to reproduce the issue. Just start/stop a few times and it will happen. Or just add more replicas of the component and it gets easier to reproduce.
Sometimes I also get when transcripts are being created:
Uncaught TypeError: Cannot read property 'onTranscriptChange' of undefined
at RecognitionManager.js:137
at Array.forEach (<anonymous>)
at RecognitionManager.emitTranscriptChange (RecognitionManager.js:136)
at RecognitionManager.updateTranscript (RecognitionManager.js:207)
My original use case for this is that I have a rather large text area and I want buttons on top and bottom of it to start/stop the speech recognition. That's how I got into this issue. Is this a valid use case? (Having multiple hooks from react-speech-recognition).
Thanks for the clear explanation and example @thiagoss Your use case is indeed valid and the example did highlight a race condition I previously wasn't aware of. I have attempted to fix this, please try version 3.2.3 and see how you get on.
I won't claim I understood the fix (still kind of new to reactjs and javascript) but it did fix my issue. Thanks!
When adding multiple components that use react-speech-recognition, it seems like starting and stopping the listening can cause the error in the title. Looks like it is a race as it happens more frequently the more replicas of the component I add. With only 2 it happens more rarely for me, with 3 it happens almost all the time.
Reproduced on Windows 10 Chrome Version 85.0.4183.83 (Official Build) (64-bit)