Issues while using @twilio/voice-sdk in chrome extension

[BishalSahoo-Pocketpills]

Hello,
I am reaching out regarding issues that we are facing while using @twilio/voice-sdk, as recommended by Twilio's customer support. To ensure continued voice service in our application we are trying to upgrade from Twilio Client SDK V1 to the latest version as recommended In the docs and Twilio Voice. But we are facing several issues in the process.

Brief overview:
We have a chrome extension that provides voice and conversation functionalities to our customers. While upgrading to the latest version of the @twilio/voice-sdk we are getting Error 1 which seems to be due to this issue.

We tried to use the alternative mentioned in the thread

But, as we are intending to keep the functionality in the service workers, dynamic imports are not supported Error 2.
Then we still tried other methods of importing but we got this error Error 3.
We also tried importing it in content scripts but got Error 4.

Please can we get some solution for this? TIA

Error 1

Error: Module "child_process" has been externalized for browser compatibility. Cannot access "child_process.spawn" in client code.
at Object.get (twilio_voice-sdk.js:3188:17)
at node_modules/xmlhttprequest/lib/XMLHttpRequest.js (twilio_voice-sdk.js:3238:40)
at __require (chunk-QOVRSCHT.js:11:50)
at node_modules/@twilio/voice-sdk/es5/twilio/request.js (twilio_voice-sdk.js:3591:15)
at __require (chunk-QOVRSCHT.js:11:50)
at node_modules/@twilio/voice-sdk/es5/twilio/eventpublisher.js (twilio_voice-sdk.js:3647:19)
at __require (chunk-QOVRSCHT.js:11:50)
at node_modules/@twilio/voice-sdk/es5/twilio/device.js (twilio_voice-sdk.js:9434:21)
at __require (chunk-QOVRSCHT.js:11:50)
at node_modules/@twilio/voice-sdk/es5/twilio/call.js (twilio_voice-sdk.js:10907:20)

Error 2

background-controller.ts:3 Uncaught (in promise) TypeError: import() is disallowed on ServiceWorkerGlobalScope by the HTML specification. See https://github.com/w3c/ServiceWorker/issues/1356.
at intitializeDevice (background-controller.ts:3:41)
at background-controller.ts:31:1

Error 3

@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:41 Uncaught ReferenceError: XMLHttpRequest is not defined
at bundle.2 (@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:41:29)
at o (@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:24:24)
at @twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:26:24
at bundle.20.xmlhttprequest (@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:3884:19)
at o (@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:24:24)
at @twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:26:24
at bundle.14../request (@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:2852:23)
at o (@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:24:24)
at @twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:26:24
at bundle.9../audiohelper (@twilio_voice-sdk_dist_twilio__min__js.js?v=fdccb203:1515:25)

Error 4

Uncaught (in promise) EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'".

at Function (<anonymous>)
at bundle.54../runtime (twilio.min.js:1:267660)
at o (twilio.min.js:1:291)
at twilio.min.js:1:342

[wmtjaychhatrola]

@BishalSahoo-Pocketpills
I m also facing the same issue while using this new library (@twilio/voice-sdk). If you will find any solution let me know.

Uncaught ReferenceError: XMLHttpRequest is not defined

@twilio-ci

[gowthamnvv]

Bumping the issue, hoping it gets Twilio's attention

[andrey-ah]

Bumping the issue

[charliesantos]

Hi @BishalSahoo-Pocketpills

But, as we are intending to keep the functionality in the service workers, dynamic imports are not supported Error 2.
Then we still tried other methods of importing but we got this error Error 3.
We also tried importing it in content scripts but got Error 4.

Service workers have limitations which will prevent the voice sdk to function properly. It is not intended to work in this kind of environment.

May I know the context why are you migrating to service workers?

[charliesantos]

Hey @BishalSahoo-Pocketpills just following up on this. May I know the context why are you migrating to service workers?
Is it maybe related to manifest v3 for chrome extensions? As mentioned, the SDK will not work on v3 due to the limitations mentioned by Google here https://groups.google.com/u/0/a/chromium.org/g/chromium-extensions/c/zQ77HkGmK9E?pli=1

Google has postponed their original phase out plan, and is actively pursuing solutions to the limitations. At this moment, there is no further action that we can take so I'll close this now. Please feel free to follow up and we'll reopen the ticket if necessary. Meanwhile, we'll continue to monitor manifest v3 related news for chrome extensions.

[BishalSahoo-Pocketpills]

Hello @charliesantos,
Yes, the reason of migration is related to manifest v3 for chrome extensions.

Meanwhile, we'll continue to monitor manifest v3 related news for chrome extensions

Thank you.

[charliesantos]

Related issue: #247
Example MV3 app https://github.com/twilio/twilio-voice.js/tree/feature/chrome_ext_mv3/extensions/chrome

[GhazanfarKhan]

Can we use twilio conversation sdk and voice sdk both at the same time ? We have out extension that is using both at the same time. Since the service worker should create offscreen documents to run the SDK and only 1 offscreen document can be open at one time. Is it possible?