browser support issue for html-audio-responses

[viviantic]

Hello!

I am testing my experiment on Cognition.run with a couple of participants who are currently in China. Everything started well. We had no problem getting their keyboard responses and RT, but when it got to the part where I collected their audio responses, (using the audio response plugin that @becky-gilbert had suggested:https://github.com/becky-gilbert/jsPsych/blob/audio-response/plugins/jspsych-html-audio-response.js), the website froze right after they had clicked on the mic permission button.
https://github.com/becky-gilbert/jsPsych/blob/audio-response/plugins/jspsych-html-audio-response.js
This is the error code that many of my participants got:

The script is fine because many of my participants can run the experiment successfully in the US. I am not sure, but it seems that it's a browser support issue because we had tried Firefox, Safari, and other browsers that are more popular in China (such as qq, 360, and so on), but none of them worked and they all ended up with the same error code as seen above. It seems that the only browser that works is Chrome, but it's less likely for my participants in China to have access and install it. Is there any way to solve this problem? Any help would be greatly appreciated.

[becky-gilbert]

Hi @viviantic, sorry to hear that your participants are having browser compatibility issues. The audio-reponse plugin uses the MediaStream Recording API, which is not supported in Safari and Internet Explorer (I'm not sure about the other browsers that you mentioned). There's a note about browser compatibility on the documentation page for the image-audio-response plugin here. Firefox and Edge do support the MediaStream Recording API, not just Chrome. I just tried the image-audio-response example file on Windows 10 Firefox and it works fine for me.

Maybe there's another cause for this error? I see that you're using a customized version of the plugin. Maybe you could first try running the the example file using Firefox on your computer, to check whether there might be any issues related to your system (operating system, browser version, mic/browser settings, etc.). If the example file works for you in Firefox, then the next thing I would do is look at line 41 in your plugin file, as well as the differences between your version and the one on my github fork, to help figure out why you're getting the "Can't find variable: MediaRecorder" error. Please feel free to follow up if you need any further guidance, and let us know if you figure out the problem.