Skip to content

Commit 5d80124

Browse files
authored
fix[devtools]: still show overlay, if getClientRects is not implemented (#35294)
Follow-up to #34653. React Native doesn't implement `getClientRect`, since this is applicable to CSS box, which is not a concept for Native (maybe yet). I am loosening the condition that gates `showOverlay()` call to pass if `getClientRect` is not implemented. Conceptually, everything that is inside `react-devtools-shared/backend` should be Host-agnostic, because both on Web and Native it is installed inside the Host JavaScript runtime, be it main frame of the page, or RN instance. Since overlay & highlighting logic also lives there, it should also follow these principles.
1 parent eade0d0 commit 5d80124

File tree

1 file changed

+5
-6
lines changed
  • packages/react-devtools-shared/src/backend/views/Highlighter

1 file changed

+5
-6
lines changed

packages/react-devtools-shared/src/backend/views/Highlighter/index.js

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -202,13 +202,12 @@ export default function setupHighlighter(
202202
typeof node.getClientRects === 'function'
203203
? node.getClientRects()
204204
: [];
205-
// If this is currently display: none, then try another node.
206-
// This can happen when one of the host instances is a hoistable.
207205
if (
208-
nodeRects.length > 0 &&
209-
(nodeRects.length > 2 ||
210-
nodeRects[0].width > 0 ||
211-
nodeRects[0].height > 0)
206+
typeof node.getClientRects === 'undefined' || // If Host doesn't implement getClientRects, try to show the overlay.
207+
(nodeRects.length > 0 && // If this is currently display: none, then try another node.
208+
(nodeRects.length > 2 || // This can happen when one of the host instances is a hoistable.
209+
nodeRects[0].width > 0 ||
210+
nodeRects[0].height > 0))
212211
) {
213212
// $FlowFixMe[method-unbinding]
214213
if (scrollIntoView && typeof node.scrollIntoView === 'function') {

0 commit comments

Comments
 (0)