Replace vendored floating-ui in FloatingDOMController with CSS Anchor Positioning

[bennypowers]

Summary

CSS Anchor Positioning reached Baseline in January 2026 (Chrome 125+, Safari 26+, Firefox 147+). The ~1400 lines of vendored floating-ui code in FloatingDOMController can be replaced with native popover attribute + CSS anchor positioning.

Current problems with the vendored code

The vendored floating-ui has diverged from upstream. Several functions use the bare global window where upstream uses getWindow(node) (i.e. node.ownerDocument.defaultView). This causes infinite recursion and stack overflow when components using FloatingDOMController are rendered inside same-origin iframes (see RedHat-UX/red-hat-design-system#2969).

What CSS Anchor Positioning replaces

Vendored floating-ui code	CSS replacement
calculatePosition, computeCoordsFromPlacement, all rect/offset math (~600 lines)	anchor-name, position-anchor, anchor() function
Flip middleware, fallback placements loop	position-try-fallbacks, @position-try
Shift middleware, overflow detection	position-area + viewport-aware clamping
autoUpdate with ResizeObserver/IntersectionObserver/scroll listeners	Not needed -- browser recalculates natively
getOffsetParent, getContainingBlock, isContainingBlock	Not needed -- popover promotes to top layer, escaping containing blocks
Arrow positioning	anchor() function on the arrow pseudo-element
RTL handling	CSS logical properties (already baseline)

Timeline

Milestone	Date
Firefox 147 ships anchor positioning	Jan 2026
Firefox ESR 153 (includes anchor positioning) launches	Jul 2026
Firefox ESR 140 (no anchor positioning) EOL	Oct 2026

October 2026 is the earliest clean cutover for projects supporting Firefox ESR.

Polyfill considerations

The @oddbird/css-anchor-positioning polyfill (~8KB gzipped) exists but has limitations that make it unsuitable for component libraries:

• Cannot work with constructed stylesheets (how Lit delivers CSS)
• Only processes styles present at call time
• Cross-shadow-root anchoring unsupported
• Global side effects even in "ponyfill" mode

Migration approach

1. Fix the iframe window bug now (one-line fix per affected function)
2. Keep JS positioning as the engine through ESR 140's lifetime
3. Write CSS anchor positioning alongside, gated by @supports (anchor-name: --a)
4. Drop JS positioning path after Oct 2026

References

• CSS Anchor Positioning browser support
• OddBird polyfill shadow DOM limitations
• Web components + anchor positioning + popover
• Firefox ESR schedule
• Baseline status tracking