TUL/Fix SSR overlay never revealing: add id="main-content" on <main> (#1358)

The SSR anti-flicker overlay (src/index.html) is removed event-driven only
once AppComponent.dsAppHasRenderedContent() finds dsApp.querySelector(
'#main-content') (src/app/app.component.ts:197). TUL's root template rendered
<main class="main-content"> WITHOUT that id (it predates the upstream
skip-to-main-content commit that other branches carry, so backport #1310
shipped a selector precondition this template never satisfied). The
event-driven reveal could therefore never fire, and the overlay was removed
only by the 10s settle cap (ssrOverlaySettleMaxMs) on EVERY hard reload:
during that window the opaque snapshot masks the live app while clicks pass
through (pointer-events:none) and navigate invisibly -> the page looks frozen
and "does not respond after reload".

Fix: add id="main-content" to <main>, matching zcu-pub/vsb-tuo and the
selector AppComponent already expects. The custom theme reuses this base
template (themes/custom/app/root/root.component.ts), so one edit covers all
themes; app.component.ts is left byte-identical to the other customer
branches (no local selector hardening) to keep backports clean.

Adds a root.component.spec regression test that renders the real template and
asserts #main-content exists — app.component.spec fabricated its own <ds-app>
with the id, which masked this divergence from the unit suite.

Co-authored-by: milanmajchrak <minptai7@gmail.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

Author: 3 people

src/app/root/root.component.html

@@ -5,7 +5,7 @@
   <div class="inner-wrapper">
     <ds-system-wide-alert-banner></ds-system-wide-alert-banner>
     <ds-themed-header-navbar-wrapper></ds-themed-header-navbar-wrapper>
-    <main class="main-content">
+    <main class="main-content" id="main-content">
       <ds-themed-breadcrumbs></ds-themed-breadcrumbs>
 
       <div class="container d-flex justify-content-center align-items-center h-100" *ngIf="shouldShowRouteLoader">

src/app/root/root.component.spec.ts

@@ -74,4 +74,13 @@ describe('RootComponent', () => {
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  // The SSR anti-flicker overlay (src/index.html) is removed event-driven only once
+  // AppComponent.dsAppHasRenderedContent() sees dsApp.querySelector('#main-content') (see
+  // src/app/app.component.ts). If the root template ever drops this id again (as it silently did
+  // on TUL, leaving the overlay to be removed only by the 10s settle cap on every hard reload -> a
+  // frozen, "unresponsive" page), this test fails instead of the regression reaching production.
+  it('renders the #main-content landmark required by the SSR overlay reveal', () => {
+    expect(fixture.nativeElement.querySelector('main#main-content')).not.toBeNull();
+  });
 });