Incompatible with angular 12

itsTeknas commented 3 years ago

[x] I have verified that the issue occurs with the latest twilio-video.js release and is not marked as a known issue in the CHANGELOG.md.
[x] I reviewed the Common Issues and open GitHub issues and verified that this report represents a potentially new issue.
[x] I verified that the Quickstart application works in my environment.
[x] I am not sharing any Personally Identifiable Information (PII) or sensitive account information (API keys, credentials, etc.) when reporting this issue.

Code to reproduce the issue:

Upgrade working project to angular 12 using official guidelines

Expected behavior:

Angular project should compile and work

Actual behavior: ng build

./node_modules/twilio-video/es5/media/track/es5/localaudiotrack.js:6:15-30
./node_modules/twilio-video/es5/media/track/es5/localvideotrack.js:6:15-30
./node_modules/twilio-video/es5/media/track/es5/localdatatrack.js:6:15-30
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
        - add a fallback 'resolve.fallback: { "util": require.resolve("util/") }'
        - install 'util'
If you don't want to include a polyfill, you can use an empty module like this:
        resolve.fallback: { "util": false }

Software versions:

[x] Browser(s): Chrome
[x] Operating System: Mac OS
[x] twilio-video.js: 2.15.1
[x] Third-party libraries (e.g., Angular, React, etc.): Angular 12.0.0

PikaJoyce commented 3 years ago

Hey @itsTeknas

Thank you for opening this issue, I apologize for the delayed response. Is it possible for you to provide more information? We don't believe that we need polyfills so it would be useful to know where the build is failing.

Best, Joyce

mgesuitti commented 3 years ago

@PikaJoyce I have the same issue and there are more details in this thread https://github.com/twilio/twilio-video.js/issues/1242

@itsTeknas you have to install util using "npm i util" and then insert these lines at the bottom of your polyfills.ts

(window as any).process = { env: { DEBUG: undefined }, };

PikaJoyce commented 3 years ago

Hey @mgesuitti!

Thanks for linking that issue. I will respond back once I gather some more information with the team on how to proceed forward with this issue! In the meanwhile, I'll keep this thread open and keep it updated.

Regards, Joyce

itsTeknas commented 3 years ago

I believe they have removed some node polyfills in webpack5 that were included by default in webpack4. The webpack config file for angular is in node_modules and editing it should not be considered. Maybe an overriding config in our project and how to set that up in your readme/setup guide will help.

Some links to help you get started https://blog.sindresorhus.com/webpack-5-headache-b6ac24973bf1 https://github.com/webpack/node-libs-browser

I'm sorry, I really don't understand the webpack world well enough to solve it on my own.

PikaJoyce commented 3 years ago

Hey everyone,

Small update, we have created an internal ticket to track this issue and investigate further.

Thanks everyone for your patience! Joyce

KaelWD commented 3 years ago

Also see #1147 and #1429. Having those imports in the first place is what makes it webpack (4) specific.

bpinto commented 3 years ago

If the following code is in the library:

https://github.com/twilio/twilio-video.js/blob/bcb5f63bb9ccb0feaa9b381c67553dec0c1f2bf7/lib/media/track/es5/localdatatrack.js#L6

shouldn't util library be a dependency?

dumip commented 3 years ago

Hey everyone,

Small update, we have created an internal ticket to track this issue and investigate further.

Thanks everyone for your patience! Joyce

Hi, any updates regarding this issue?

PikaJoyce commented 3 years ago

Folks,

I apologize for the incredibly late response. But I'm here to update this thread with the internal ticket number (VIDEO-6516) that was created to track and investigate this issue further. This issue is currently within our backlog and we're expecting this to be a larger task that will require some time. Again, we appreciate your patience!

Best, Joyce

hsavit1 commented 2 years ago

@PikaJoyce any updates?

PikaJoyce commented 2 years ago

Hi @hsavit1,

Thank you for the ping! Currently, there are efforts that address this issue in the works. We hope to have a resolution out sometime in the near future! I will keep this thread updated as progress continues.

Best, Joyce

PikaJoyce commented 2 years ago

Hi folks,

Just a quick update here, the latest release 2.21.1 fixes this issue. Please give it a spin and let us know if you're still seeing any issues! I will now be closing this ticket. Please do feel free to open another issue if any new ones occur!

Thank you for all of your patience, Joyce

twilio / twilio-video.js

Incompatible with angular 12 #1517