Add getClientRects to fabric fragment instance (#34545)

Stacked on #34544 

We only have getBoundingClientRect available from RN currently. This
should work as a substitute for this case because the equivalent of
multi-rect elements in RN is a nested Text component. We only include
the rects of top-level host components here so we can assume that
calling getBoundingClientRect on each child is the same result.

Tested in react-native with Fantom.
This commit is contained in:
Jack Pope 2025-10-03 09:54:33 -04:00 committed by GitHub
parent e866b1d1e9
commit 74dee8ef64
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -648,6 +648,7 @@ export type FragmentInstanceType = {
getRootNode(getRootNodeOptions?: {
composed: boolean,
}): Node | FragmentInstanceType,
getClientRects: () => Array<DOMRect>,
};
function FragmentInstance(this: FragmentInstanceType, fragmentFiber: Fiber) {
@ -772,6 +773,27 @@ FragmentInstance.prototype.getRootNode = function (
return rootNode;
};
// $FlowFixMe[prop-missing]
FragmentInstance.prototype.getClientRects = function (
this: FragmentInstanceType,
): Array<DOMRect> {
const rects: Array<DOMRect> = [];
traverseFragmentInstance(this._fragmentFiber, collectClientRects, rects);
return rects;
};
function collectClientRects(child: Fiber, rects: Array<DOMRect>): boolean {
const instance = getPublicInstanceFromHostFiber(child);
// getBoundingClientRect is available on Fabric instances while getClientRects is not.
// This should work as a substitute in this case because the only equivalent of a multi-rect
// element in RN would be a nested Text component.
// Since we only use top-level nodes here, we can assume that getBoundingClientRect is sufficient.
// $FlowFixMe[method-unbinding]
// $FlowFixMe[incompatible-use] Fabric PublicInstance is opaque
rects.push(instance.getBoundingClientRect());
return false;
}
export function createFragmentInstance(
fragmentFiber: Fiber,
): FragmentInstanceType {