chore: Update preset env, drop IE11 and older browser support (#7708)

.babelrc

@@ -3,6 +3,19 @@
     [
       "@babel/preset-env",
       {
+        "targets": [
+          "last 3 major versions",
+          "Firefox ESR",
+          "Chrome >= 53",
+          "not dead",
+          "not ie 11",
+          "not baidu 7",
+          "not and_qq 11",
+          "not and_uc 12",
+          "not kaios 2",
+          "not op_mini all",
+          "not op_mob 64"
+        ],
         "bugfixes": true,
         "loose": true
       }

.browserslistrc

@@ -0,0 +1,13 @@
+# Browsers that we support
+
+last 3 major versions
+Firefox ESR
+Chrome >= 53
+not dead
+not ie 11
+not baidu 7
+not and_qq 11
+not and_uc 12
+not kaios 2
+not op_mini all
+not op_mob 64

postcss.config.js

@@ -1,7 +1,5 @@
-// default is: > 0.5%, last 2 versions, Firefox ESR, not dead
-// we add on ie 11 since we still support that.
 // see https://github.com/browserslist/browserslist for more info
-const browsersList = ['defaults', 'ie 11'];
+const browsersList = ['last 3 major version', 'Firefox ESR', 'Chrome >= 53', 'not dead', 'not ie 11'];
 
 module.exports = {
   plugins: [

rollup.config.js

@@ -57,6 +57,20 @@ const primedBabel = babel({
   compact: false,
   presets: [
     ['@babel/preset-env', {
+      targets: [
+        'last 3 major versions',
+        'Firefox ESR',
+        // This ensures support for certain smart TVs (ex. LG WebOS 4)
+        'Chrome >= 53',
+        'not dead',
+        'not ie 11',
+        'not baidu 7',
+        'not and_qq 11',
+        'not and_uc 12',
+        'not kaios 2',
+        'not op_mini all',
+        'not op_mob 64'
+      ],
       bugfixes: true,
       loose: true,
       modules: false

src/js/extend.js

@@ -4,6 +4,7 @@
  */
 
 import _inherits from '@babel/runtime/helpers/inherits';
+import log from './utils/log';
 
 /**
  * Used to subclass an existing class by emulating ES subclassing using the
@@ -25,12 +26,24 @@ import _inherits from '@babel/runtime/helpers/inherits';
  *
  * @return   {Function}
  *           The new class with subClassMethods that inherited superClass.
+ *
+ * @deprecated videojs.extend() is deprecated as of v8; use native ES6 classes instead
  */
 const extend = function(superClass, subClassMethods = {}) {
+  log.warn('The extend() method is deprecated. Please use native ES6 classes instead.');
+
+  const isNativeClass = superClass && /^class/.test(superClass.toString());
+
   let subClass = function() {
     superClass.apply(this, arguments);
   };
 
+  // If the provided super class is a native ES6 class,
+  // make the sub class one as well.
+  if (isNativeClass) {
+    subClass = class SubClass extends superClass {};
+  }
+
   let methods = {};
 
   if (typeof subClassMethods === 'object') {
@@ -42,7 +55,9 @@ const extend = function(superClass, subClassMethods = {}) {
     subClass = subClassMethods;
   }
 
-  _inherits(subClass, superClass);
+  if (!isNativeClass) {
+    _inherits(subClass, superClass);
+  }
 
   // this is needed for backward-compatibility and node compatibility.
   if (superClass) {

test/unit/extend.test.js

@@ -4,27 +4,52 @@ import extend from '../../src/js/extend.js';
 QUnit.module('extend.js');
 
 QUnit.test('should add implicit parent constructor call', function(assert) {
-  let superCalled = false;
-  const Parent = function() {
-    superCalled = true;
-  };
-  const Child = extend(Parent, {
-    foo: 'bar'
-  });
-  const child = new Child();
+  assert.expect(4);
 
-  assert.ok(superCalled, 'super constructor called');
-  assert.ok(child.foo, 'child properties set');
+  let superCalled = false;
+
+  [
+    function() {
+      superCalled = true;
+    },
+    class Parent {
+      constructor() {
+        superCalled = true;
+      }
+    }
+  ].forEach(Parent => {
+    const Child = extend(Parent, {
+      foo: 'bar'
+    });
+    const child = new Child();
+
+    assert.ok(superCalled, 'super constructor called');
+    assert.ok(child.foo, 'child properties set');
+
+    superCalled = false;
+  });
 });
 
 QUnit.test('should have a super_ pointer', function(assert) {
-  const Parent = function() {};
+  assert.expect(4);
+
+  [function() {}, class Parent {}].forEach(Parent => {
+    const Child = extend(Parent, {
+      foo: 'bar'
+    });
+    const child = new Child();
+
+    assert.ok(child.foo, 'child properties set');
+    assert.equal(child.constructor.super_, Parent, 'super_ is present and equal to the super class');
+  });
+});
+
+QUnit.test('sub class is an ES6 class if the super class is', function(assert) {
+  class Parent {}
+
   const Child = extend(Parent, {
     foo: 'bar'
   });
 
-  const child = new Child();
-
-  assert.ok(child.foo, 'child properties set');
-  assert.equal(child.constructor.super_, Parent, 'super_ is present and equal to the super class');
+  assert.ok(/^class/.test(Child.toString()), 'sub class is native es6 class');
 });

test/unit/tracks/text-track.test.js

@@ -440,7 +440,9 @@ QUnit.test('if preloadTextTracks is false, default tracks are not parsed until m
 
   window.WebVTT = () => {};
   window.WebVTT.StringDecoder = () => {};
-  window.WebVTT.Parser = () => {
+
+  // This needs to be function expression rather than arrow function so it is constructable
+  window.WebVTT.Parser = function() {
     parserCreated = true;
     return {
       oncue() {},
@@ -485,7 +487,9 @@ QUnit.test('tracks are parsed if vttjs is loaded', function(assert) {
 
   window.WebVTT = () => {};
   window.WebVTT.StringDecoder = () => {};
-  window.WebVTT.Parser = () => {
+
+  // This needs to be function expression rather than arrow function so it is constructable
+  window.WebVTT.Parser = function() {
     parserCreated = true;
     return {
       oncue() {},
@@ -524,7 +528,9 @@ QUnit.test('tracks are loaded withCredentials is crossorigin is set to use-crede
 
   window.WebVTT = () => {};
   window.WebVTT.StringDecoder = () => {};
-  window.WebVTT.Parser = () => {
+
+  // This needs to be function expression rather than arrow function so it is constructable
+  window.WebVTT.Parser = function() {
     return {
       oncue() {},
       onparsingerror() {},
@@ -596,7 +602,9 @@ QUnit.test('tracks are parsed once vttjs is loaded', function(assert) {
 
   window.WebVTT = () => {};
   window.WebVTT.StringDecoder = () => {};
-  window.WebVTT.Parser = () => {
+
+  // This needs to be function expression rather than arrow function so it is constructable
+  window.WebVTT.Parser = function() {
     parserCreated = true;
     return {
       oncue() {},