Fix initialization on headerless Steam CEF pages

[Acetab]

Problem

Steam's built-in browser can render store app pages without the legacy #global_header element. On these pages the content script may run before the client page has finished rendering, so the legacy page check fails and Augmented Steam does not initialize. Header-only widgets also assume that #global_action_menu and the legacy header are present.

Changes

• wait for the page check to become true instead of returning immediately when the content script starts before the page shell is available
• treat Steam client's .responsive_page_frame.no_header as a valid legacy page container
• defer store app initialization until app details or an error box is present
• safely skip the menu and warnings when the page has no compatible legacy-header mount point

The existing behavior on regular Steam web pages is unchanged: when the legacy header is available, the normal menu and warnings are mounted as before.

Testing

• npx tsc --noEmit
• npm run build chrome -- --production
• manually tested on a Steam client app page using Chromium 126

Related to #2307

[tfedor]

I think we have to do this for all pages where AS runs, not just app pages, right?

[tfedor]

I'll leave this here for myself for future reference, I have to go through how all this AS initialization works.

User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; Valve Steam Client/default/1788652215) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.6478.183 Safari/537.36

[Acetab]

Yes, I think you're right. This probably affects other pages as well, not only app pages.

For some context, I originally made these changes for my own use. The Steam desktop client is Chromium-based and can load Chrome extensions, so I tried running Augmented Steam directly inside it. The extension could be installed, but AS didn't initialize correctly on Steam client pages.

I also found that other users had already mentioned this before. Discussion #2307 was opened after a Reddit post showed that Chrome extensions can be installed directly in the Steam client, and the user there also found that Augmented Steam didn't work. There have also been older attempts to use AS in the Steam client through tools such as Millennium.

I made some small changes locally and tested them in the Steam client. After these changes, Augmented Steam does work there. The current PR is basically the changes I used to get it working.

However, the integration is not perfect yet. There are still some UI differences between the normal Steam website and the Steam client. For example, the AS menu/status UI doesn't fit the Steam client layout correctly, so its position still needs to be adjusted. There may be similar differences on other pages as well.

The extra observer in "PApp.ts" was mainly added because of the loading behavior I encountered while testing in the Steam client. So I agree that if Steam client support is meant to cover all AS pages, this probably shouldn't be handled only in "PApp.ts".

Since you know the overall AS architecture much better than I do, I'll leave it to you to decide whether this should be generalized for all pages or implemented in a different way. My current PR mainly contains the changes I tested locally to make AS work in the Steam client.

Also, English isn't my native language, so please excuse me if I don't explain some technical details very clearly.

[JayMing743]

I found that after installing Millennium, going to its plugin center and downloading the Extendium plugin allows AugmentedSteam to work perfectly. You can give it a try. Pinning AugmentedSteam to the status bar also allows you to access its settings.