YouTube speed menu fix

demo/dist/demo.js

@@ -85,6 +85,15 @@ function serializer(replacer, cycleReplacer) {
 });
 var stringify_2 = stringify_1.getSerialize;
 
+
+var stringify = Object.freeze({
+	default: stringify_1,
+	__moduleExports: stringify_1,
+	getSerialize: stringify_2
+});
+
+var stringify$1 = ( stringify && stringify_1 ) || stringify;
+
 var _window =
   typeof window !== 'undefined'
     ? window
@@ -592,7 +601,7 @@ function serializeException(ex, depth, maxSize) {
 
   var serialized = serializeObject(ex, depth);
 
-  if (jsonSize(stringify_1(serialized)) > maxSize) {
+  if (jsonSize(stringify$1(serialized)) > maxSize) {
     return serializeException(ex, depth - 1);
   }
 
@@ -630,7 +639,7 @@ function sanitize(input, sanitizeKeys) {
   var safeInput;
 
   try {
-    safeInput = JSON.parse(stringify_1(input));
+    safeInput = JSON.parse(stringify$1(input));
   } catch (o_O) {
     return input;
   }
@@ -693,6 +702,78 @@ var utils = {
   serializeKeysForMessage: serializeKeysForMessage,
   sanitize: sanitize
 };
+var utils_1 = utils.isObject;
+var utils_2 = utils.isError;
+var utils_3 = utils.isErrorEvent;
+var utils_4 = utils.isUndefined;
+var utils_5 = utils.isFunction;
+var utils_6 = utils.isPlainObject;
+var utils_7 = utils.isString;
+var utils_8 = utils.isArray;
+var utils_9 = utils.isEmptyObject;
+var utils_10 = utils.supportsErrorEvent;
+var utils_11 = utils.supportsFetch;
+var utils_12 = utils.supportsReferrerPolicy;
+var utils_13 = utils.supportsPromiseRejectionEvent;
+var utils_14 = utils.wrappedCallback;
+var utils_15 = utils.each;
+var utils_16 = utils.objectMerge;
+var utils_17 = utils.truncate;
+var utils_18 = utils.objectFrozen;
+var utils_19 = utils.hasKey;
+var utils_20 = utils.joinRegExp;
+var utils_21 = utils.urlencode;
+var utils_22 = utils.uuid4;
+var utils_23 = utils.htmlTreeAsString;
+var utils_24 = utils.htmlElementAsString;
+var utils_25 = utils.isSameException;
+var utils_26 = utils.isSameStacktrace;
+var utils_27 = utils.parseUrl;
+var utils_28 = utils.fill;
+var utils_29 = utils.safeJoin;
+var utils_30 = utils.serializeException;
+var utils_31 = utils.serializeKeysForMessage;
+var utils_32 = utils.sanitize;
+
+
+var utils$1 = Object.freeze({
+	default: utils,
+	__moduleExports: utils,
+	isObject: utils_1,
+	isError: utils_2,
+	isErrorEvent: utils_3,
+	isUndefined: utils_4,
+	isFunction: utils_5,
+	isPlainObject: utils_6,
+	isString: utils_7,
+	isArray: utils_8,
+	isEmptyObject: utils_9,
+	supportsErrorEvent: utils_10,
+	supportsFetch: utils_11,
+	supportsReferrerPolicy: utils_12,
+	supportsPromiseRejectionEvent: utils_13,
+	wrappedCallback: utils_14,
+	each: utils_15,
+	objectMerge: utils_16,
+	truncate: utils_17,
+	objectFrozen: utils_18,
+	hasKey: utils_19,
+	joinRegExp: utils_20,
+	urlencode: utils_21,
+	uuid4: utils_22,
+	htmlTreeAsString: utils_23,
+	htmlElementAsString: utils_24,
+	isSameException: utils_25,
+	isSameStacktrace: utils_26,
+	parseUrl: utils_27,
+	fill: utils_28,
+	safeJoin: utils_29,
+	serializeException: utils_30,
+	serializeKeysForMessage: utils_31,
+	sanitize: utils_32
+});
+
+var utils$2 = ( utils$1 && utils ) || utils$1;
 
 /*
  TraceKit - Cross brower stack traces
@@ -842,9 +923,9 @@ TraceKit.report = (function reportModuleWrapper() {
   function traceKitWindowOnError(msg, url, lineNo, colNo, ex) {
     var stack = null;
     // If 'ex' is ErrorEvent, get real Error from inside
-    var exception = utils.isErrorEvent(ex) ? ex.error : ex;
+    var exception = utils$2.isErrorEvent(ex) ? ex.error : ex;
     // If 'msg' is ErrorEvent, get real message from inside
-    var message = utils.isErrorEvent(msg) ? msg.message : msg;
+    var message = utils$2.isErrorEvent(msg) ? msg.message : msg;
 
     if (lastExceptionStack) {
       TraceKit.computeStackTrace.augmentStackTraceWithInitialElement(
@@ -854,7 +935,7 @@ TraceKit.report = (function reportModuleWrapper() {
         message
       );
       processLastException();
-    } else if (exception && utils.isError(exception)) {
+    } else if (exception && utils$2.isError(exception)) {
       // non-string `exception` arg; attempt to extract stack trace
 
       // New chrome and blink send along a real error object
@@ -1321,6 +1402,12 @@ TraceKit.computeStackTrace = (function computeStackTraceWrapper() {
 
 var tracekit = TraceKit;
 
+
+var tracekit$1 = Object.freeze({
+	default: tracekit,
+	__moduleExports: tracekit
+});
+
 /*
  * JavaScript MD5
  * https://github.com/blueimp/JavaScript-MD5
@@ -1588,6 +1675,12 @@ function md5(string, key, raw) {
 
 var md5_1 = md5;
 
+
+var md5$1 = Object.freeze({
+	default: md5_1,
+	__moduleExports: md5_1
+});
+
 function RavenConfigError(message) {
   this.name = 'RavenConfigError';
   this.message = message;
@@ -1597,6 +1690,12 @@ RavenConfigError.prototype.constructor = RavenConfigError;
 
 var configError = RavenConfigError;
 
+
+var configError$1 = Object.freeze({
+	default: configError,
+	__moduleExports: configError
+});
+
 var wrapMethod = function(console, level, callback) {
   var originalConsoleLevel = console[level];
   var originalConsole = console;
@@ -1610,14 +1709,14 @@ var wrapMethod = function(console, level, callback) {
   console[level] = function() {
     var args = [].slice.call(arguments);
 
-    var msg = utils.safeJoin(args, ' ');
+    var msg = utils$2.safeJoin(args, ' ');
     var data = {level: sentryLevel, logger: 'console', extra: {arguments: args}};
 
     if (level === 'assert') {
       if (args[0] === false) {
         // Default browsers message
         msg =
-          'Assertion failed: ' + (utils.safeJoin(args.slice(1), ' ') || 'console.assert');
+          'Assertion failed: ' + (utils$2.safeJoin(args.slice(1), ' ') || 'console.assert');
         data.extra.arguments = args.slice(1);
         callback && callback(msg, data);
       }
@@ -1637,6 +1736,22 @@ var wrapMethod = function(console, level, callback) {
 var console$1 = {
   wrapMethod: wrapMethod
 };
+var console_1 = console$1.wrapMethod;
+
+
+var console$2 = Object.freeze({
+	default: console$1,
+	__moduleExports: console$1,
+	wrapMethod: console_1
+});
+
+var TraceKit$1 = ( tracekit$1 && tracekit ) || tracekit$1;
+
+var md5$2 = ( md5$1 && md5_1 ) || md5$1;
+
+var RavenConfigError$1 = ( configError$1 && configError ) || configError$1;
+
+var require$$0 = ( console$2 && console$1 ) || console$2;
 
 /*global XDomainRequest:false */
 
@@ -1646,35 +1761,35 @@ var console$1 = {
 
 
 
-var isError$1 = utils.isError;
+var isError$1 = utils$2.isError;
-var isObject$1 = utils.isObject;
+var isObject$1 = utils$2.isObject;
-var isPlainObject$1 = utils.isPlainObject;
+var isPlainObject$1 = utils$2.isPlainObject;
-var isErrorEvent$1 = utils.isErrorEvent;
+var isErrorEvent$1 = utils$2.isErrorEvent;
-var isUndefined$1 = utils.isUndefined;
+var isUndefined$1 = utils$2.isUndefined;
-var isFunction$1 = utils.isFunction;
+var isFunction$1 = utils$2.isFunction;
-var isString$1 = utils.isString;
+var isString$1 = utils$2.isString;
-var isArray$1 = utils.isArray;
+var isArray$1 = utils$2.isArray;
-var isEmptyObject$1 = utils.isEmptyObject;
+var isEmptyObject$1 = utils$2.isEmptyObject;
-var each$1 = utils.each;
+var each$1 = utils$2.each;
-var objectMerge$1 = utils.objectMerge;
+var objectMerge$1 = utils$2.objectMerge;
-var truncate$1 = utils.truncate;
+var truncate$1 = utils$2.truncate;
-var objectFrozen$1 = utils.objectFrozen;
+var objectFrozen$1 = utils$2.objectFrozen;
-var hasKey$1 = utils.hasKey;
+var hasKey$1 = utils$2.hasKey;
-var joinRegExp$1 = utils.joinRegExp;
+var joinRegExp$1 = utils$2.joinRegExp;
-var urlencode$1 = utils.urlencode;
+var urlencode$1 = utils$2.urlencode;
-var uuid4$1 = utils.uuid4;
+var uuid4$1 = utils$2.uuid4;
-var htmlTreeAsString$1 = utils.htmlTreeAsString;
+var htmlTreeAsString$1 = utils$2.htmlTreeAsString;
-var isSameException$1 = utils.isSameException;
+var isSameException$1 = utils$2.isSameException;
-var isSameStacktrace$1 = utils.isSameStacktrace;
+var isSameStacktrace$1 = utils$2.isSameStacktrace;
-var parseUrl$1 = utils.parseUrl;
+var parseUrl$1 = utils$2.parseUrl;
-var fill$1 = utils.fill;
+var fill$1 = utils$2.fill;
-var supportsFetch$1 = utils.supportsFetch;
+var supportsFetch$1 = utils$2.supportsFetch;
-var supportsReferrerPolicy$1 = utils.supportsReferrerPolicy;
+var supportsReferrerPolicy$1 = utils$2.supportsReferrerPolicy;
-var serializeKeysForMessage$1 = utils.serializeKeysForMessage;
+var serializeKeysForMessage$1 = utils$2.serializeKeysForMessage;
-var serializeException$1 = utils.serializeException;
+var serializeException$1 = utils$2.serializeException;
-var sanitize$1 = utils.sanitize;
+var sanitize$1 = utils$2.sanitize;
 
-var wrapConsoleMethod = console$1.wrapMethod;
+var wrapConsoleMethod = require$$0.wrapMethod;
 
 var dsnKeys = 'source protocol user pass host port path'.split(' '),
   dsnPattern = /^(?:(\w+):)?\/\/(?:(\w+)(:\w+)?@)?([\w\.-]+)(?::(\d+))?(\/.*)/;
@@ -1781,7 +1896,7 @@ Raven.prototype = {
 
   debug: false,
 
-  TraceKit: tracekit, // alias to TraceKit
+  TraceKit: TraceKit$1, // alias to TraceKit
 
   /*
      * Configure Raven with a DSN and extra options
@@ -1862,7 +1977,7 @@ Raven.prototype = {
     }
     globalOptions.instrument = instrument;
 
-    tracekit.collectWindowErrors = !!globalOptions.collectWindowErrors;
+    TraceKit$1.collectWindowErrors = !!globalOptions.collectWindowErrors;
 
     // return for chaining
     return self;
@@ -1879,7 +1994,7 @@ Raven.prototype = {
   install: function() {
     var self = this;
     if (self.isSetup() && !self._isRavenInstalled) {
-      tracekit.report.subscribe(function() {
+      TraceKit$1.report.subscribe(function() {
         self._handleOnErrorStackInfo.apply(self, arguments);
       });
 
@@ -2043,7 +2158,7 @@ Raven.prototype = {
    * @return {Raven}
    */
   uninstall: function() {
-    tracekit.report.uninstall();
+    TraceKit$1.report.uninstall();
 
     this._detachPromiseRejectionHandler();
     this._unpatchFunctionToString();
@@ -2138,7 +2253,7 @@ Raven.prototype = {
     // raises an exception different from the one we asked to
     // report on.
     try {
-      var stack = tracekit.computeStackTrace(ex);
+      var stack = TraceKit$1.computeStackTrace(ex);
       this._handleStackInfo(stack, options);
     } catch (ex1) {
       if (ex !== ex1) {
@@ -2154,7 +2269,7 @@ Raven.prototype = {
     var options = objectMerge$1(currentOptions, {
       message:
         'Non-Error exception captured with keys: ' + serializeKeysForMessage$1(exKeys),
-      fingerprint: [md5_1(exKeys)],
+      fingerprint: [md5$2(exKeys)],
       extra: currentOptions.extra || {}
     });
     options.extra.__serialized__ = serializeException$1(ex);
@@ -2203,7 +2318,7 @@ Raven.prototype = {
 
     // null exception name so `Error` isn't prefixed to msg
     ex.name = null;
-    var stack = tracekit.computeStackTrace(ex);
+    var stack = TraceKit$1.computeStackTrace(ex);
 
     // stack[0] is `throw new Error(msg)` call itself, we are interested in the frame that was just before that, stack[1]
     var initialCall = isArray$1(stack.stack) && stack.stack[1];
@@ -2350,7 +2465,7 @@ Raven.prototype = {
      */
   getContext: function() {
     // lol javascript
-    return JSON.parse(stringify_1(this._globalContext));
+    return JSON.parse(stringify$1(this._globalContext));
   },
 
   /*
@@ -2486,12 +2601,12 @@ Raven.prototype = {
 
     var lastEventId = options.eventId || this.lastEventId();
     if (!lastEventId) {
-      throw new configError('Missing eventId');
+      throw new RavenConfigError$1('Missing eventId');
     }
 
     var dsn = options.dsn || this._dsn;
     if (!dsn) {
-      throw new configError('Missing DSN');
+      throw new RavenConfigError$1('Missing DSN');
     }
 
     var encode = encodeURIComponent;
@@ -3133,11 +3248,11 @@ Raven.prototype = {
     try {
       while (i--) dsn[dsnKeys[i]] = m[i] || '';
     } catch (e) {
-      throw new configError('Invalid DSN: ' + str);
+      throw new RavenConfigError$1('Invalid DSN: ' + str);
     }
 
     if (dsn.pass && !this._globalOptions.allowSecretKey) {
-      throw new configError(
+      throw new RavenConfigError$1(
         'Do not specify your secret key in the DSN. See: http://bit.ly/raven-secret-key'
       );
     }
@@ -3658,7 +3773,7 @@ Raven.prototype = {
     }
 
     if (supportsFetch$1()) {
-      evaluatedFetchParameters.body = stringify_1(opts.data);
+      evaluatedFetchParameters.body = stringify$1(opts.data);
 
       var defaultFetchOptions = objectMerge$1({}, this._fetchDefaults);
       var fetchOptions = objectMerge$1(defaultFetchOptions, evaluatedFetchParameters);
@@ -3733,7 +3848,7 @@ Raven.prototype = {
       });
     }
 
-    request.send(stringify_1(opts.data));
+    request.send(stringify$1(opts.data));
   },
 
   _evaluateHash: function(hash) {
@@ -3775,6 +3890,14 @@ Raven.prototype.setReleaseContext = Raven.prototype.setRelease;
 
 var raven = Raven;
 
+
+var raven$1 = Object.freeze({
+	default: raven,
+	__moduleExports: raven
+});
+
+var RavenConstructor = ( raven$1 && raven ) || raven$1;
+
 /**
  * Enforces a single instance of the Raven client, and the
  * main entry point for Raven. If you are a consumer of the
@@ -3790,7 +3913,7 @@ var _window$3 =
     : typeof commonjsGlobal !== 'undefined' ? commonjsGlobal : typeof self !== 'undefined' ? self : {};
 var _Raven = _window$3.Raven;
 
-var Raven$1 = new raven();
+var Raven$1 = new RavenConstructor();
 
 /*
  * Allow multiple versions of Raven to be installed.
@@ -3841,7 +3964,7 @@ var singleton = Raven$1;
  *
  * It should "just work".
  */
-var Client = raven;
+var Client = RavenConstructor;
 singleton.Client = Client;
 
 // ==========================================================================

dist/plyr.js

@@ -84,7 +84,7 @@ var defaults = {
 
     // Quality default
     quality: {
-        default: 720,
+        default: 576,
         options: [4320, 2880, 2160, 1440, 1080, 720, 576, 480, 360, 240, 'default']
     },
 
@@ -1542,6 +1542,18 @@ var utils = {
     },
 
 
+    // Get the closest value in an array
+    closest: function closest(array, value) {
+        if (!utils.is.array(array) || !array.length) {
+            return null;
+        }
+
+        return array.reduce(function (prev, curr) {
+            return Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev;
+        });
+    },
+
+
     // Get the provider for a given URL
     getProviderByUrl: function getProviderByUrl(url) {
         // YouTube
@@ -1951,13 +1963,13 @@ var Fullscreen = function () {
         });
 
         // Fullscreen toggle on double click
-        utils.on(this.player.elements.container, 'dblclick', function () {
+        utils.on(this.player.elements.container, 'dblclick', function (event) {
-            _this.toggle();
+            // Ignore double click in controls
-        });
+            if (_this.player.elements.controls.contains(event.target)) {
+                return;
+            }
 
-        // Prevent double click on controls bubbling up
+            _this.toggle();
-        utils.on(this.player.elements.controls, 'dblclick', function (event) {
-            return event.stopPropagation();
         });
 
         // Update the UI
@@ -3316,13 +3328,7 @@ var controls = {
                     break;
 
                 case 1440:
-                    label = 'WQHD';
-                    break;
-
                 case 1080:
-                    label = 'HD';
-                    break;
-
                 case 720:
                     label = 'HD';
                     break;
@@ -3496,14 +3502,14 @@ var controls = {
         var list = this.elements.settings.panes.captions.querySelector('ul');
 
         // Toggle the pane and tab
-        var hasTracks = captions.getTracks.call(this).length;
+        var toggle = captions.getTracks.call(this).length;
-        controls.toggleTab.call(this, type, hasTracks);
+        controls.toggleTab.call(this, type, toggle);
 
         // Empty the menu
         utils.emptyElement(list);
 
         // If there's no captions, bail
-        if (!hasTracks) {
+        if (!toggle) {
             return;
         }
 
@@ -3547,10 +3553,10 @@ var controls = {
         var type = 'speed';
 
         // Set the speed options
-        if (!utils.is.array(options)) {
+        if (utils.is.array(options)) {
-            this.options.speed = [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
-        } else {
             this.options.speed = options;
+        } else if (this.isHTML5 || this.isVimeo) {
+            this.options.speed = [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
         }
 
         // Set options if passed and filter based on config
@@ -3559,7 +3565,7 @@ var controls = {
         });
 
         // Toggle the pane and tab
-        var toggle = !utils.is.empty(this.options.speed);
+        var toggle = !utils.is.empty(this.options.speed) && this.options.speed.length > 1;
         controls.toggleTab.call(this, type, toggle);
 
         // Check if we need to toggle the parent
@@ -3582,7 +3588,8 @@ var controls = {
 
         // Create items
         this.options.speed.forEach(function (speed) {
-            return controls.createMenuItem.call(_this4, speed, list, type, controls.getLabel.call(_this4, 'speed', speed));
+            var label = controls.getLabel.call(_this4, 'speed', speed);
+            controls.createMenuItem.call(_this4, speed, list, type, label);
         });
 
         controls.updateSetting.call(this, type, list);
@@ -3866,7 +3873,8 @@ var controls = {
         // Settings button / menu
         if (this.config.controls.includes('settings') && !utils.is.empty(this.config.settings)) {
             var menu = utils.createElement('div', {
-                class: 'plyr__menu'
+                class: 'plyr__menu',
+                hidden: ''
             });
 
             menu.appendChild(controls.createButton.call(this, 'settings', {
@@ -3991,12 +3999,12 @@ var controls = {
 
         this.elements.controls = container;
 
-        controls.setSpeedMenu.call(this);
-
         if (this.isHTML5) {
             controls.setQualityMenu.call(this, html5.getQualityOptions.call(this));
         }
 
+        controls.setSpeedMenu.call(this);
+
         return container;
     },
 
@@ -5804,8 +5812,7 @@ var youtube = {
                     });
 
                     // Get available speeds
-                    var options = instance.getAvailablePlaybackRates();
+                    player.options.speed = instance.getAvailablePlaybackRates();
-                    controls.setSpeedMenu.call(player, options);
 
                     // Set the tabindex to avoid focus entering iframe
                     if (player.supported.ui) {
@@ -7560,11 +7567,16 @@ var Plyr = function () {
                 quality = this.config.quality.default;
             }
 
-            if (!this.options.quality.includes(quality)) {
+            if (!this.options.quality.length) {
-                this.debug.warn('Unsupported quality option (' + quality + ')');
                 return;
             }
 
+            if (!this.options.quality.includes(quality)) {
+                var closest = utils.closest(this.options.quality, quality);
+                this.debug.warn('Unsupported quality option: ' + quality + ', using ' + closest + ' instead');
+                quality = closest;
+            }
+
             // Update config
             this.config.quality.selected = quality;
 

src/js/controls.js

@@ -474,13 +474,7 @@ const controls = {
                     break;
 
                 case 1440:
-                    label = 'WQHD';
-                    break;
-
                 case 1080:
-                    label = 'HD';
-                    break;
-
                 case 720:
                     label = 'HD';
                     break;
@@ -656,14 +650,14 @@ const controls = {
         const list = this.elements.settings.panes.captions.querySelector('ul');
 
         // Toggle the pane and tab
-        const hasTracks = captions.getTracks.call(this).length;
+        const toggle = captions.getTracks.call(this).length;
-        controls.toggleTab.call(this, type, hasTracks);
+        controls.toggleTab.call(this, type, toggle);
 
         // Empty the menu
         utils.emptyElement(list);
 
         // If there's no captions, bail
-        if (!hasTracks) {
+        if (!toggle) {
             return;
         }
 
@@ -710,7 +704,9 @@ const controls = {
         const type = 'speed';
 
         // Set the speed options
-        if (!utils.is.array(options)) {
+        if (utils.is.array(options)) {
+            this.options.speed = options;
+        } else if (this.isHTML5 || this.isVimeo) {
             this.options.speed = [
                 0.5,
                 0.75,
@@ -720,15 +716,13 @@ const controls = {
                 1.75,
                 2,
             ];
-        } else {
-            this.options.speed = options;
         }
 
         // Set options if passed and filter based on config
         this.options.speed = this.options.speed.filter(speed => this.config.speed.options.includes(speed));
 
         // Toggle the pane and tab
-        const toggle = !utils.is.empty(this.options.speed);
+        const toggle = !utils.is.empty(this.options.speed) && this.options.speed.length > 1;
         controls.toggleTab.call(this, type, toggle);
 
         // Check if we need to toggle the parent
@@ -750,7 +744,10 @@ const controls = {
         utils.emptyElement(list);
 
         // Create items
-        this.options.speed.forEach(speed => controls.createMenuItem.call(this, speed, list, type, controls.getLabel.call(this, 'speed', speed)));
+        this.options.speed.forEach(speed => {
+            const label = controls.getLabel.call(this, 'speed', speed);
+            controls.createMenuItem.call(this, speed, list, type, label);
+        });
 
         controls.updateSetting.call(this, type, list);
     },
@@ -1033,6 +1030,7 @@ const controls = {
         if (this.config.controls.includes('settings') && !utils.is.empty(this.config.settings)) {
             const menu = utils.createElement('div', {
                 class: 'plyr__menu',
+                hidden: '',
             });
 
             menu.appendChild(
@@ -1167,12 +1165,12 @@ const controls = {
 
         this.elements.controls = container;
 
-        controls.setSpeedMenu.call(this);
-
         if (this.isHTML5) {
             controls.setQualityMenu.call(this, html5.getQualityOptions.call(this));
         }
 
+        controls.setSpeedMenu.call(this);
+
         return container;
     },
 

src/js/defaults.js

@@ -63,7 +63,7 @@ const defaults = {
 
     // Quality default
     quality: {
-        default: 720,
+        default: 576,
         options: [
             4320,
             2880,

src/js/fullscreen.js

@@ -68,13 +68,15 @@ class Fullscreen {
         });
 
         // Fullscreen toggle on double click
-        utils.on(this.player.elements.container, 'dblclick', () => {
+        utils.on(this.player.elements.container, 'dblclick', event => {
+            // Ignore double click in controls
+            if (this.player.elements.controls.contains(event.target)) {
+                return;
+            }
+
             this.toggle();
         });
 
-        // Prevent double click on controls bubbling up
-        utils.on(this.player.elements.controls, 'dblclick', event => event.stopPropagation());
-
         // Update the UI
         this.update();
     }

src/js/plugins/youtube.js

@@ -351,8 +351,7 @@ const youtube = {
                     });
 
                     // Get available speeds
-                    const options = instance.getAvailablePlaybackRates();
+                    player.options.speed = instance.getAvailablePlaybackRates();
-                    controls.setSpeedMenu.call(player, options);
 
                     // Set the tabindex to avoid focus entering iframe
                     if (player.supported.ui) {

src/js/plyr.js

@@ -692,11 +692,16 @@ class Plyr {
             quality = this.config.quality.default;
         }
 
-        if (!this.options.quality.includes(quality)) {
+        if (!this.options.quality.length) {
-            this.debug.warn(`Unsupported quality option (${quality})`);
             return;
         }
 
+        if (!this.options.quality.includes(quality)) {
+            const closest = utils.closest(this.options.quality, quality);
+            this.debug.warn(`Unsupported quality option: ${quality}, using ${closest} instead`);
+            quality = closest;
+        }
+
         // Update config
         this.config.quality.selected = quality;
 

src/js/utils.js

@@ -746,6 +746,15 @@ const utils = {
         return array.filter((item, index) => array.indexOf(item) === index);
     },
 
+    // Get the closest value in an array
+    closest(array, value) {
+        if (!utils.is.array(array) || !array.length) {
+            return null;
+        }
+
+        return array.reduce((prev, curr) => Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev);
+    },
+
     // Get the provider for a given URL
     getProviderByUrl(url) {
         // YouTube