4.77.5

* Fixed: Various player-related features not working correctly after Twitch's Friday update. Closes #1685
* Fixed: The current category not being detected correctly when viewing a channel.
* Fixed: The setting to hide bits not hiding the get bits button from the top navigation bar.

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "frankerfacez",
 	"author": "Dan Salvato LLC",
-	"version": "4.77.4",
+	"version": "4.77.5",
 	"description": "FrankerFaceZ is a Twitch enhancement suite.",
 	"private": true,
 	"license": "Apache-2.0",

src/sites/shared/player.jsx

@@ -1964,14 +1964,17 @@ export default class PlayerBase extends Module {
 				{tip = (<div class="ffz-il-tooltip ffz-il-tooltip--align-right ffz-il-tooltip--up" role="tooltip" />)}
 			</div>);
 
-			const thing = container.querySelector('button[data-a-target="player-theatre-mode-button"]') ||
+			let thing = container.querySelector('button[data-a-target="player-theatre-mode-button"]') ||
 				//container.querySelector('div:not(:has(.tw-tooltip)) button:not([data-a-target])') ||
 				container.querySelector('button[aria-label*="Theat"]') ||
 				container.querySelector('button[data-a-target="player-fullscreen-button"]');
 
-			if ( thing ) {
+			while(thing?.parentElement && thing.parentElement !== container)
-				container.insertBefore(cont, thing.parentElement);
+				thing = thing.parentElement;
-			} else
+
+			if ( thing?.parentElement === container )
+				container.insertBefore(cont, thing);
+			else
 				container.appendChild(cont);
 
 		} else {
@@ -2077,16 +2080,19 @@ export default class PlayerBase extends Module {
 				{tip = (<div class="ffz-il-tooltip ffz-il-tooltip--align-right ffz-il-tooltip--up" role="tooltip" />)}
 			</div>);
 
-			const thing = container.querySelector('.ffz--player-reset button') ||
+			let thing = container.querySelector('.ffz--player-reset button') ||
 				container.querySelector('.ffz--player-pip button') ||
 				container.querySelector('button[data-a-target="player-theatre-mode-button"]') ||
 				//container.querySelector('div:not(:has(.tw-tooltip)) button:not([data-a-target])') ||
 				container.querySelector('button[aria-label*="Theat"]') ||
 				container.querySelector('button[data-a-target="player-fullscreen-button"]');
 
-			if ( thing ) {
+			while(thing?.parentElement && thing.parentElement !== container)
-				container.insertBefore(cont, thing.parentElement);
+				thing = thing.parentElement;
-			} else
+
+			if ( thing?.parentElement === container )
+				container.insertBefore(cont, thing);
+			else
 				container.appendChild(cont);
 
 		} else {
@@ -2112,11 +2118,6 @@ export default class PlayerBase extends Module {
 				));
 	}
 
-	clickClip(inst, e) {
-		console.log('clicked clip', inst, e);
-	}
-
-
 	addResetButton(inst, tries = 0) {
 		const outer = inst.props.containerRef || this.fine.getChildNode(inst),
 			container = outer && outer.querySelector(RIGHT_CONTROLS),
@@ -2157,15 +2158,18 @@ export default class PlayerBase extends Module {
 				{tip = (<div class="ffz-il-tooltip ffz-il-tooltip--align-right ffz-il-tooltip--up" role="tooltip" />)}
 			</div>);
 
-			const thing = container.querySelector('.ffz--player-pip button') ||
+			let thing = container.querySelector('.ffz--player-pip button') ||
 				container.querySelector('button[data-a-target="player-theatre-mode-button"]') ||
 				//container.querySelector('div:not(:has(.tw-tooltip)) button:not([data-a-target])') ||
 				container.querySelector('button[aria-label*="Theat"]') ||
 				container.querySelector('button[data-a-target="player-fullscreen-button"]');
 
-			if ( thing ) {
+			while(thing?.parentElement && thing.parentElement !== container)
-				container.insertBefore(cont, thing.parentElement);
+				thing = thing.parentElement;
-			} else
+
+			if ( thing?.parentElement === container )
+				container.insertBefore(cont, thing);
+			else
 				container.appendChild(cont);
 
 		} else {

src/sites/twitch-twilight/modules/channel.jsx

@@ -308,7 +308,7 @@ export default class Channel extends Module {
 		let nvc = el.querySelector('.ffz--native-viewers-container');
 		if ( ! nvc ) {
 			let i = 0,
-				vel = el.querySelector('p[data-a-target="animated-channel-viewers-count"]');
+				vel = el.querySelector('strong[data-a-target="animated-channel-viewers-count"]');
 			while(vel && vel != el && i < 5) {
 				if ( vel.querySelector('svg') ) {
 					vel.classList.add('ffz--native-viewers-container');
@@ -406,7 +406,7 @@ export default class Channel extends Module {
 				channel = state?.memoizedState?.current?.result?.data?.user ??
 					state?.memoizedState?.current?.previousData?.user;
 
-				if ( !channel?.lastBroadcast?.game )
+				if ( !channel?.lastBroadcast || !channel?.stream?.game )
 					channel = null;
 
 				if ( ! channel )
@@ -416,12 +416,12 @@ export default class Channel extends Module {
 			return channel != null;
 		});
 
-		const game = channel?.lastBroadcast?.game,
+		const game = channel?.stream?.game,
 			title = channel?.lastBroadcast?.title;
 
 		if (game?.id !== el._ffz_game_cache || title !== el._ffz_title_cache)
 			this.settings.updateContext({
-				category: game?.displayName,
+				category: game?.name,
 				categoryID: game?.id,
 				title
 			});
@@ -513,7 +513,7 @@ export default class Channel extends Module {
 				},*/
 				el,
 				getViewerCount: () => {
-					const thing = cont.querySelector('p[data-a-target="animated-channel-viewers-count"]'),
+					const thing = cont.querySelector('strong[data-a-target="animated-channel-viewers-count"]'),
 						r = thing && this.fine.getReactInstance(thing),
 						c = r?.memoizedProps?.children;