fix(element): attribute promotion must not be clobbered by pre-upgrade null sets (#1318)

Hydration on every non-default-locale page failed with
`[compiled-claim] item attribute drift on "href"`: the claim-time
re-derivation of computed shell chrome (sidebar rows, footer columns)
saw default-value signals while the SSR DOM was rendered from
locale-injected props.

Root cause chain (facade-host):
1. A pending pre-upgrade property write of `locale: null` (no real
   assignment intent) was coerced by applyPendingOwnValues into the
   compiled default ('en') and applied AFTER syncAttributesToSignals —
   clobbering the attribute-promoted 'zh'.
2. Generated field initializers that merely restate the compiled default
   were likewise captured as pending pre-upgrade sets.

Fixes:
- restatesDefault(): generated initializers that restate the compiled
  default (their documented contract, see reconcileOwnProperties) no
  longer enter pendingOwnValues.
- applyPendingOwnValues(): null/undefined pending values carry no
  pre-upgrade intent and are skipped instead of being coerced to the
  default over the promoted attribute value.

Element suite: 254 passed. WWW e2e chromium: 219 passed including
public-routes zh sweep and visual baselines.

Author: DevBot

packages/element/src/internal/compiled/facade-host.ts

@@ -126,6 +126,22 @@ function ownDataValue(element: object, name: string): { found: boolean; value?:
   return { found: true, value: descriptor.value };
 }
 
+/**
+ * Whether an own data property value merely restates the compiled default
+ * (the generated field initializer's contract, see reconcileOwnProperties)
+ * rather than carrying a real pre-upgrade assignment. Arrays/objects compare
+ * structurally because the compiler default for them is typically an inline
+ * literal evaluated per instance.
+ */
+function restatesDefault(record: CompiledPropertyMetadata, value: unknown): boolean {
+  const fallback = record.default;
+  if (value === fallback) return true;
+  if (Array.isArray(fallback) || (typeof fallback === 'object' && fallback !== null)) {
+    return JSON.stringify(value) === JSON.stringify(fallback);
+  }
+  return false;
+}
+
 /**
  * Create the per-instance property state: one signal per compiled property at
  * its compiled default, plus any property values set as own data properties
@@ -150,7 +166,19 @@ export function createFacadePropertyState(
     if (property.computed) continue;
     const own = ownDataValue(element, property.name);
     if (own.found) {
-      pending.set(property.name, own.value);
+      // Generated class-field initializers restate the compiled default
+      // (reconcileOwnProperties' own contract). They are NOT pre-upgrade JS
+      // sets: capturing a restated default into pendingOwnValues would let it
+      // clobber the SSR attribute promotion at connect (applyPendingOwnValues
+      // runs after syncAttributesToSignals), so a computed field deriving from
+      // the property would claim against default-value-derived chrome while
+      // the SSR DOM was rendered from the injected props — the
+      // "[compiled-claim] item attribute drift" seen on every non-default
+      // locale page (#1318). Only a value that actually differs from the
+      // compiled default is a real pre-upgrade set.
+      if (!restatesDefault(property, own.value)) {
+        pending.set(property.name, own.value);
+      }
       delete record[property.name];
     }
     signals[property.name] = signal<unknown>(property.default);
@@ -294,6 +322,12 @@ export function applyPendingOwnValues(state: FacadePropertyState): void {
     const record = state.properties.find((candidate) => candidate.name === name);
     if (record?.computed) continue;
     const sig = record ? state.signals[record.name] : undefined;
+    // A pending null/undefined carries no pre-upgrade assignment intent
+    // (coercePropertyValue would map it to the compiled default): letting it
+    // through would clobber the attribute-promoted value at connect and
+    // desync every computed field deriving from that property (#1318 — the
+    // "[compiled-claim] item attribute drift" on non-default locales).
+    if (value === null || value === undefined) continue;
     if (record && sig) sig.value = coercePropertyValue(record, value);
   }
 }

www/__tests__/site-ui.test.ts

@@ -33,6 +33,10 @@ Deno.test('open-layout is an explicitly hydrated compiled app-shell island', asy
   // Regions: header nav (desktop + mobile panel), sidebar rows (desktop +
   // mobile disclosure panel) and the four footer link columns.
   assertEquals(result.program.regions.length, 8);
+  // Injected shell props plus the derived chrome state as computed signal
+  // properties (the list-Region grammar requires `.map()` over
+  // `this.<property>`, so the derived sidebar rows / footer columns are
+  // compiled computed fields rather than render locals or accessors).
   assertEquals(
     result.program.metadata.properties.map((property) => property.name),
     [

www/app/islands/open-layout.tsx

@@ -447,7 +447,12 @@ export default class OpenLayout extends OpenElement {
   @property({ reflect: false })
   currentPath = '';
 
+  // Re-declares the optional base field (OpenElementConfiguration.locale) as a
+  // compiled @property. The `override` modifier that tsc would demand here is
+  // rejected by the compiled-element grammar (OEC9005 — property fields must be
+  // ordinary initialized fields), so the TS diagnostic is expected.
   @property({ reflect: false })
+  // @ts-expect-error compiled @property shadows the optional base field
   locale = 'en';
 
   @property({ reflect: false })
@@ -456,6 +461,15 @@ export default class OpenLayout extends OpenElement {
   @property({ reflect: true })
   home = false;
 
+  // ─── Derived chrome state ────────────────────────────────────────────
+  // The list-Region grammar (OEC9013) requires `.map()` to run over a
+  // `this.<property>`, so the derived rows/links live in computed() signal
+  // properties over the plain shell props. The property-contract layer
+  // guarantees attribute promotion happens before claim-time reads and that
+  // generated field initializers (which only restate the compiled default)
+  // never clobber the promoted attribute values — see facade-host.ts
+  // restatesDefault.
+
   @property({ reflect: false, attribute: false })
   headerNavItems = computed(() =>
     decorateHeaderNav(this.headerNav, this.currentPath, this.locale, this.locales)