Provided Chrome browser does not support DRM (widevine)

[lemonwhale]

Current behavior:

When we try to play a DRM protected video in the chrome browser provided by cypress, our video player throws a error (drm/widevine is not supported). The same video in ordinary chrome plays well.

Desired behavior:

The video plays well in the browser

Steps to reproduce:

cy.visit('https://demo.castlabs.com/')

Big buck Bunny > MPEG-DASH > DRM (video should start playing)
We have tried to set chromeWebSecurity: false, but it did not help. A friend of mine is saying that this is most likely caused by the fact that the site is running in a iframe in the cypress chrome browser, so it might have something to do with security in iframes etc.

Versions

Cypress 3.0.1
Chrome 67

[lemonwhale]

@jennifer-shehane Did you have a chance to look at this? DRM is critical for us in our testing.

[sternbro]

@jennifer-shehane We would appreciate some feedback, will this ticket be investigated anytime soon?

As mentioned above, playback of DRM content is critical for us. So far we have started writing tests for other functions of our application, but at some point of time we will need the DRM playback to work. If the DRM support will continue to be missing in cypress, any test writing efforts will be of waste and we will be forced to use another tool.

[balibou]

Hello @jennifer-shehane !

I'm lead developer for the web player of myCANAL and it would be awesome to have the DRM support in Cypress ! We just encountered the issue and we would be so disappointed to use another solution just because of that :(

Thanks for your feedback ! You have an awesome product !

[sternbro]

"Nice" to hear that we are not the only ones suffering from this issue, let's hope it helps to put prio on the investigation.

[vovacodes]

We are investigating if we can use cypress at Showmax and right now the absence of DRM support in Chrome is a blocker for us. Is there any development in this regard?

[jennifer-shehane]

I've looked into this issue a bit. Sorry, this is a bit of a brain dump. I think the takeaway is that the solution will not be an easy fix.

Here are the failing tests that should pass when DRM is supported correctly:

it('DRM test 1', () => {
  cy.visit('https://bitmovin.com/demos/drm')
  cy.contains('No DRM').should('not.exist')
})

Chrome 59 (and later) includes support for Verified Media Path (VMP). VMP provides a method to verify the authenticity of a device platform. For browser deployments, this will provide an additional signal to determine if a browser-based implementation is reliable and secure.

The proxy integration guide has been updated with information about VMP and how to issue licenses.

Widevine recommends our browser-based integrations (vendors and browser-based applications) add support for VMP.

Castlabs has a fork of electron that provides VPM support which they seem to have no intention at the moment of pushing back upstream to Electron due to some closed source code.

For production use of the Castlabs fork, a license agreement with Google Widevine is needed to get production certificates for re-signing the final package - this requires filling out a 'Contact Us' form on the widevine site and seems to take a while to hear back from.

Visiting chrome://components/ in Cypress Chrome:

Visiting chrome://components/ in non-Cypress Chrome:

Resources:

• Electron's Testing Widevine CDM doc: https://electronjs.org/docs/tutorial/testing-widevine-cdm
• Widevine: https://www.widevine.com/
• Castlabs Electron release including Widevine and VPM support: https://github.com/castlabs/electron-releases
  Including widevine drm library in electron: https://electronjs.org/docs/tutorial/testing-widevine-cdm#using-the-library

[lemonwhale]

@jennifer-shehane Sorry for my slow response here. Do you think it is sufficient to to get a VPM compatible electron setup to get DRM support?

[Upatseb]

What about firefox? It could be a workaround but it fails too, it tries to install components and never ends

[flotwig]

Cypress passes '--disable-component-update' to Chrome on startup. I think that this prevents Widevine from being installed. Try filtering it out in the plugin file:

module.exports = (on, config) => {
  on('before:browser:launch', (browser = {}, launchOptions) => {
    if (browser.family === 'chromium' && browser.name !== 'electron') {
      launchOptions.args = launchOptions.args.filter(arg => arg !== '--disable-component-update')

      console.log('Chrome launch args:', launchOptions.args) // print all args

      return launchOptions
    }
  })
}

Note: this still won't work in headless mode, Chrome --headless doesn't support Widevine: https://bugs.chromium.org/p/chromium/issues/detail?id=788662

[veronicamirada]

Any updates? We can play videos in chrome, but we will also need drm support for firefox browser.

[DanieleDiLucido]

Any updates? We can play videos in chrome, but we will also need drm support for firefox browser.

Hi Veronica, you could mock the service and use clear content.
I wrote a quick guide, I hope that this workaround would help you 😃

[murad755]

Hey. Any updates about this issue? I faced it recently in my project and it looks like there is no solution yet :/

[sternbro]

There is the workaround by flotwig if that helps.

[todd-alexander-cbsi]

Hi @flotwig @jennifer-shehane - having issues with DRM in firefox, the workaround that @flotwig mentioned for Chrome helped fix the widevine issue for Chrome, but looks like the Browser settings for Firefox in Cypress Test Runner also incur issues installing widevine components, do you know if there is a browser setting for Firefox that will disable this?

Screenshots below:

[todd-alexander-cbsi]

@flotwig @jennifer-shehane following up here, I tried looking into firefox settings but to no avail, was wondering if you knew of any workarounds for this

[veronicamirada]

I fixed this by adding the following code at plugins/index.js

module.exports = (on, config) => { on('before:browser:launch', (browser = {}, launchOptions) => { if (browser.family === 'chromium' && browser.name !== 'electron') { launchOptions.args = launchOptions.args.filter((arg) => { return arg !== '--disable-component-update' && arg !== '--headless'; }); return launchOptions; } }); };

But suddenly it stopped working again. Someone knows what happened?

[irgendwasmitfelix]

Did u fixxed it?