Skip to content

Commit

Permalink
fix: checks if element exists before reading height
Browse files Browse the repository at this point in the history
Fixes an error that would sometimes get thrown if the element
we tried to read the height from was no longer in the DOM.
  • Loading branch information
ivarni committed Feb 24, 2025
1 parent 3e89981 commit c789206
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 6 deletions.
13 changes: 10 additions & 3 deletions packages/expandable-react/src/Expander.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,10 +40,17 @@ export const Expander = React.forwardRef(function Expander<

useEffect(() => {
const observer = new ResizeObserver(function () {
setExpanderHeight(internalRef.current!.offsetHeight);
// Default to 64 if the height can not be read because that is
// the height of the default summary element. In a custom component
// this means that the focus ring might be slightly misaligned but
// in most cases we will be able to read the ref correctly.
setExpanderHeight(internalRef.current?.offsetHeight || 64);
});
observer.observe(internalRef.current!);
return () => observer.disconnect();
if (internalRef.current) {
observer.observe(internalRef.current);
return () => observer.disconnect();
}
return () => {};
}, [setExpanderHeight]);

return (
Expand Down
13 changes: 10 additions & 3 deletions packages/jokul/src/components/expander/Expander.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,10 +45,17 @@ export const Expander = React.forwardRef(function Expander<

useEffect(() => {
const observer = new ResizeObserver(function () {
setExpanderHeight(internalRef.current!.offsetHeight);
// Default to 64 if the height can not be read because that is
// the height of the default summary element. In a custom component
// this means that the focus ring might be slightly misaligned but
// in most cases we will be able to read the ref correctly.
setExpanderHeight(internalRef.current?.offsetHeight || 64);
});
observer.observe(internalRef.current!);
return () => observer.disconnect();
if (internalRef.current) {
observer.observe(internalRef.current);
return () => observer.disconnect();
}
return () => {};
}, [setExpanderHeight]);

return (
Expand Down

0 comments on commit c789206

Please sign in to comment.