0

Using video.js in IE11 the player is failing to load video segments.

If I look in the console I see an "InvalidStateError" error.

The offending line is within the xhr library dependency of the video.js package:

// node_modules/video.js/node_modules/xhr/index.js#L210
|  if ("responseType" in options) {
>     xhr.responseType = options.responseType
|  }

If I remove this line manually on my computer the player will work.

How can I get around this? I am building my application with webpack.

sdgluck
  • 24,894
  • 8
  • 75
  • 90

1 Answers1

0

It's hacky, but you can use the webpack-plugin-replace plugin to remove the line by replacing it with an empty string.

// fixes "InvalidStateError" in IE which occurs at:
// node_modules/video.js/node_modules/xhr/index.js#L210
new ReplacePlugin({
  include: [
    "/node_modules/video.js/node_modules/xhr/index.js"
  ],
  patterns: [
    {
      regex: /xhr\.responseType = options\.responseType/,
      value: ''
    }
  ],
  // required due to a bug in `webpack-plugin-replace`
  // see: https://github.com/lukeed/webpack-plugin-replace/issues/6
  values: {
    "": ""
  }
})
sdgluck
  • 24,894
  • 8
  • 75
  • 90
  • Thanks for posting the solution for this issue. I suggest you to try to mark your own answer as an accepted answer for this question after 48 hrs, when it is available to mark. It can help other community members in future in similar kind of issues. Thanks for your understanding. – Deepak-MSFT Nov 12 '19 at 01:16