Cannot read property 'getBoundingClientRect' of null

[Valerika]

Hi! I'm getting sometimes this error in console Uncaught TypeError: Cannot read property 'getBoundingClientRect' of null

How can I fix this?

[ttamminen]

I get this after resizing the window and opening the popover after the resize

[ttamminen]

The problem started when I migrated from v4 to v6. I had a custom component (styled <button>) that opened the popover.

I got rid of the error by doing the React.forwardRef thing from the documentation.

[Linktheoriginal]

I'm using the React.forwardRef behavior, but I see this error on a re-render after closing a related modal. I see elsewhere in the code where there is a ?. check for the ref, is that needed here?

[humphrey]

I also receive this error.

It occurs when I resize the screen AND resizing the screen causes the component to be destroyed... For example if I have something like this (not tested), then resizing the screen past 768px breakpoint will cause this issue. Hopefully the above fix resolves this.

import React from 'react';
import { useMedia } from 'react-media';
import { Popover } from 'react-tiny-popover';

const MyComponent = () => {
  const media = useMedia({queries: {md: '(min-width: 768px)'});
  return (
    <>
      {media.md ? 
        <div>
            Large screen
            <Popover/>
        </div>
      :
        <div>
            Small screen
            <Popover/>
        </div>
    </>
  );
}

[tboerc]

I can confirm that @humphrey issue is correct. On my current project, even with the forwardRef solution, if the resize causes the Popover to unmount, it will throw getBoundingClientRect error.

[RusovVladimir]

I have the same issue.

[humphrey]

I originally fixed with patch-package, but the issue is fixed for me in 6.0.10

On Tue, 24 Aug 2021 at 00:35, Vladimir @.***> wrote:

I have the same issue.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/alexkatz/react-tiny-popover/issues/100#issuecomment-903831324, or unsubscribe https://github.com/notifications/unsubscribe-auth/AABYD4SS6EUGPBQN5GURGHLT6JMCRANCNFSM4WEARZ4A .

[zhangqiangcrazy]

I have the same issue.

[alexkatz]

Closing this issue, as it's been fixed!