grid becomes blank on opening new tab and coming back to old tab

[ragavan-vyn]

grid is blanked on tab refocus when site opened on another tab

steps to reproduce

1. open https://grid.glideapps.com/ (called tab-1)
2. open new tab and open https://grid.glideapps.com/ (called tab-2)
3. goto tab-1, grid is empy

device, browser details

Browser: Chrome Version 124.0.6367.208 (Official Build) (arm64) Os: Mac 13.2.1 (22D68)

Video

reproducible on new chrome profile without extensions

https://github.com/glideapps/glide-data-grid/assets/95401389/669f285c-8523-43ab-a733-9cfeb5ee941e

Let me know if you need any other details.

Thanks.

[vydimitrov]

I have the same problem. The columns are shown back again when you hover the canvas. So I guess it is some kind of refresh issue on the canvas.

[vydimitrov]

Here is a video from me as well showing the issue.

https://github.com/glideapps/glide-data-grid/assets/10707142/37cd04e0-9a14-4058-bef0-0b05135b1c2b

[kcvikander]

We were running into this same problem, the following code seems to have resolved it in our app at least by forcing focus. (React/Typescript)

 const dataEditorRef = React.useRef<DataEditorRef>(null);

...

const handleFocusIn = useCallback(() => {
    if (dataEditorRef.current) {
      dataEditorRef.current.focus();
    }
  }, [dataEditorRef]);

  useEffect(() => {
    void document.addEventListener('visibilitychange', handleFocusIn);

    return () => {
      document.removeEventListener('visibilitychange', handleFocusIn);
    };
  }, [handleFocusIn]);

[hovoaep]

I updated Chrome to the latest version, and I no longer see the issue.

[ragavan-vyn]

yes, works on latest chrome.