chore(release): 4.7.1 [CI SKIP]

CHANGELOG.md

@@ -1,3 +1,10 @@
+## [4.7.1](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.7.0...v4.7.1) (2024-08-08)
+
+
+### Bug Fixes
+
+* **utils/react:** fix potential race condition in injectFCTrampoline ([4c97097](https://github.com/SteamDeckHomebrew/decky-frontend-lib/commit/4c97097757919580a380b70785e6c161de6b03cc))
+
 # [4.7.0](https://github.com/SteamDeckHomebrew/decky-frontend-lib/compare/v4.6.0...v4.7.0) (2024-07-28)
 
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decky/ui",
-  "version": "4.7.0",
+  "version": "4.7.1",
   "description": "A library for interacting with the Steam frontend in Decky plugins and elsewhere.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

src/modules/Router.ts

@@ -126,6 +126,7 @@ export interface Navigation {
   OpenQuickAccessMenu(quickAccessTab?: QuickAccessTab): void;
   OpenMainMenu(): void;
   OpenPowerMenu(unknown?: any): void;
+  /** if calling this to perform navigation, call it after Navigate to prevent a race condition in desktop Big Picture mode that hides the overlay unintentionally */
   CloseSideMenus(): void;
 }
 

src/utils/react/fc.ts

@@ -52,6 +52,7 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
             // we have to redirect this to return an object with component's prototype as a constructor returning a value overrides its prototype
             window.SP_REACT.createElement = () => {
                 loggingEnabled && logger.debug("createElement hook called");
+                loggingEnabled && console.trace("createElement trace");
                 return Object.create(component.prototype);
             };
         }
@@ -66,12 +67,16 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
         }
     }
 
+    let renderHookStep = 0;
+
     // Accessed two times, once directly before class instantiation, and again in some extra logic we don't need to worry about that we hanlde below just in case.
     Object.defineProperty(component, "contextType", {
         configurable: true,
         get: function () {
-            loggingEnabled && logger.debug("get contexttype", this, stubsApplied);
-            applyStubsIfNeeded();
+            loggingEnabled && logger.debug("get contexttype", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("contextType trace");
+            if (renderHookStep == 0) renderHookStep = 1;
+            else if (renderHookStep == 3) renderHookStep = 4;
             return this._contextType;
         },
         set: function (value) {
@@ -79,16 +84,20 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
         }
     });
 
-    // Undoes the second contextType access we can't detect shortly before render before it's able to cause any damage
-    Object.defineProperty(component, "getDerivedStateFromProps", {
+    // Always accessed directly after contextType for the path we want to catch.
+    Object.defineProperty(component, "contextTypes", {
         configurable: true,
         get: function () {
-            loggingEnabled && logger.debug("get getDerivedStateFromProps", this, stubsApplied);
-            removeStubsIfNeeded();
-            return this._getDerivedStateFromProps;
+            loggingEnabled && logger.debug("get contexttypes", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("contextTypes trace");
+            if (renderHookStep == 1) {
+                renderHookStep = 2;
+                applyStubsIfNeeded();
+            };
+            return this._contextTypes;
         },
         set: function (value) {
-            this._getDerivedStateFromProps = value;
+            this._contextTypes = value;
         }
     });
 
@@ -99,11 +108,32 @@ export function injectFCTrampoline(component: FC, customHooks?: any): FCTrampoli
             return this._updater;
         },
         set: function (value) {
-            loggingEnabled && logger.debug("set updater", this, value, stubsApplied);
-            removeStubsIfNeeded();
+            loggingEnabled && logger.debug("set updater", this, value, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("updater trace");
+            if (renderHookStep == 2) {
+                renderHookStep = 0;
+                removeStubsIfNeeded();
+            }
             return this._updater = value;
         }
     });
 
+    // Prevents the second contextType+contextTypes access from leaving its hooks around
+    Object.defineProperty(component, "getDerivedStateFromProps", {
+        configurable: true,
+        get: function () {
+            loggingEnabled && logger.debug("get getDerivedStateFromProps", this, stubsApplied, renderHookStep);
+            loggingEnabled && console.trace("getDerivedStateFromProps trace");
+            if (renderHookStep == 2) {
+                renderHookStep = 0;
+                removeStubsIfNeeded();
+            }
+            return this._getDerivedStateFromProps;
+        },
+        set: function (value) {
+            this._getDerivedStateFromProps = value;
+        }
+    });
+
     return userComponent;
 }

src/utils/react/react.ts

@@ -104,19 +104,15 @@ export function wrapReactClass(node: any, prop: any = 'type') {
 
 export function getReactRoot(o: HTMLElement | Element | Node) {
   return (
-    // @ts-expect-error 7053
-    o[Object.keys(o).find((k) => k.startsWith('__reactContainer$')) as string] ||
-    // @ts-expect-error 7053
-    o['_reactRootContainer']?._internalRoot?.current
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactContainer$')) as string] ||
+    (o as any)['_reactRootContainer']?._internalRoot?.current
   );
 }
 
 export function getReactInstance(o: HTMLElement | Element | Node) {
   return (
-    // @ts-expect-error 7053
-    o[Object.keys(o).find((k) => k.startsWith('__reactFiber')) as string] ||
-    // @ts-expect-error 7053
-    o[Object.keys(o).find((k) => k.startsWith('__reactInternalInstance')) as string]
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactFiber')) as string] ||
+    (o as any)[Object.keys(o).find((k) => k.startsWith('__reactInternalInstance')) as string]
   );
 }