4.0.0-rc13.14

* Fixed: Clicking Stream Latency metadata not toggling the visibility of the player's playback statistics.
* Fixed: The Turbo landing page being inappropriately darkened. (Twitch forgot to add the "base text color" class to anything so text becomes invisible against the background.)
* Fixed: More emote menu fixes. Check that emote data from Twitch doesn't contain null values, because apparently it can.
* Fixed: Chat width in portrait mode using Microsoft Edge.
* Fixed: `no_invert` not applying to badges correctly. (Closes #547)

src/main.js

@@ -149,7 +149,7 @@ ${typeof x[1] === 'string' ? x[1] : JSON.stringify(x[1], null, 4)}`
 FrankerFaceZ.Logger = Logger;
 
 const VER = FrankerFaceZ.version_info = {
-	major: 4, minor: 0, revision: 0, extra: '-rc13.13',
+	major: 4, minor: 0, revision: 0, extra: '-rc13.14',
 	commit: __git_commit__,
 	build: __webpack_hash__,
 	toString: () =>

src/modules/chat/badges.jsx

@@ -441,6 +441,7 @@ export default class Badges extends Module {
 
 				if (no_invert) {
 					slotted[slot].full_size = true;
+					slotted[slot].no_invert = true;
 
 					style.background = 'unset';
 					style.backgroundSize = 'unset';
@@ -471,7 +472,7 @@ export default class Badges extends Module {
 				const data = slotted[slot],
 					props = data.props;
 
-				props.className = `ffz-tooltip ffz-badge${data.full_size ? ' ffz-full-size' : ''}`;
+				props.className = `ffz-tooltip ffz-badge${data.full_size ? ' ffz-full-size' : ''}${data.no_invert ? ' ffz-no-invert' : ''}`;
 				props.key = `${props['data-provider']}-${props['data-badge']}`;
 				props['data-tooltip-type'] = 'badge';
 				props['data-badge-data'] = JSON.stringify(data.badges);

src/modules/metadata.jsx

@@ -180,11 +180,12 @@ export default class Metadata extends Module {
 					return;
 
 				const store = internal.context.store,
-					state = store.getState();
+					state = store.getState(),
+					displayed = state && state.stats && state.stats.displayState === 'DISPLAY_VIDEO_STATS';
 
 				store.dispatch({
 					type: 'display stats',
-					displayed: ! (state.stats && state.stats.displayed)
+					displayState: displayed ? 'DISPLAY_NONE' : 'DISPLAY_VIDEO_STATS'
 				});
 			},
 

src/sites/twitch-twilight/index.js

@@ -204,6 +204,7 @@ Twilight.ROUTES = {
 	'user-following': '/:userName/following',
 	'product': '/products/:productName',
 	'prime': '/prime',
+	'turbo': '/turbo',
 	'user': '/:userName',
 }
 

src/sites/twitch-twilight/modules/chat/emote_menu.jsx

@@ -1303,6 +1303,11 @@ export default class EmoteMenu extends Module {
 						}
 
 						for(const emote of emote_set.emotes) {
+							// Validate emotes, because apparently Twitch is handing
+							// out bad emote data.
+							if ( ! emote || ! emote.id || ! emote.token )
+								continue;
+
 							const id = parseInt(emote.id, 10),
 								name = KNOWN_CODES[emote.token] || emote.token,
 								mapped = emote_map && emote_map[name],
@@ -1403,6 +1408,11 @@ export default class EmoteMenu extends Module {
 							section.all_locked = false;
 
 						for(const emote of product.emotes) {
+							// Validate emotes, because apparently Twitch is handing
+							// out bad emote data.
+							if ( ! emote || ! emote.id || ! emote.token )
+								continue;
+
 							const id = parseInt(emote.id, 10),
 								base = `${TWITCH_EMOTE_BASE}${id}`,
 								name = KNOWN_CODES[emote.token] || emote.token,

src/sites/twitch-twilight/modules/css_tweaks/styles/channel-metadata-top.scss

@@ -0,0 +1,13 @@
+.channel-info-bar__content-right {
+	display: flex;
+	flex-direction: column;
+
+	& > .tw-align-items-start {
+		margin-top: 0 !important;
+		order: -1;
+
+		& > .tw-pd-t-05 {
+			padding-top: 0 !important;
+		}
+	}
+}

src/sites/twitch-twilight/modules/css_tweaks/styles/portrait.scss

@@ -41,6 +41,10 @@
 		width: unset !important;
 		border-top: 1px solid #dad8de;
 
+		& > .tw-full-height {
+			width: 100% !important;
+		}
+
 		.right-column__toggle-visibility {
 			position: fixed !important;
 			top: 6.5rem;

src/sites/twitch-twilight/modules/theme/index.js

@@ -9,7 +9,7 @@ import {createElement} from 'utilities/dom';
 
 import THEME_CSS_URL from 'site/styles/theme.scss';
 
-const BAD_ROUTES = ['product', 'prime'];
+const BAD_ROUTES = ['product', 'prime', 'turbo'];
 
 
 export default class ThemeEngine extends Module {

styles/chat.scss

@@ -34,6 +34,10 @@
 	background-position: center;
 	vertical-align: middle;
 
+	&.ffz-no-invert {
+		filter:none !important;
+	}
+
 	&.ffz-full-size {
 		min-width: 1.8rem;
 		height: 1.8rem;