diff --git a/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.test.tsx b/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.test.tsx index 57d577382..cbf698ab4 100644 --- a/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.test.tsx +++ b/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.test.tsx @@ -30,6 +30,20 @@ describe('the useVideoTrackDimensions hook', () => { expect(result.current).toEqual({ height: 300, width: 600 }); }); + it('should return a new object reference on "dimensionsChanged" event', () => { + mockTrack.dimensions = { height: 123, width: 456 }; + const { result } = renderHook(() => useVideoTrackDimensions(mockTrack)); + + act(() => { + mockTrack.dimensions.height = 300; + mockTrack.dimensions.width = 600; + mockTrack.emit('dimensionsChanged', mockTrack); + }); + + expect(result.current).toEqual({ height: 300, width: 600 }); + expect(result.current).not.toBe(mockTrack.dimensions); + }); + it('should clean up listeners on unmount', () => { const { unmount } = renderHook(() => useVideoTrackDimensions(mockTrack)); unmount(); diff --git a/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.tsx b/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.tsx index 100e94614..0f55c3e29 100644 --- a/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.tsx +++ b/src/hooks/useVideoTrackDimensions/useVideoTrackDimensions.tsx @@ -10,7 +10,10 @@ export default function useVideoTrackDimensions(track?: TrackType) { setDimensions(track?.dimensions); if (track) { - const handleDimensionsChanged = (track: TrackType) => setDimensions(track?.dimensions); + const handleDimensionsChanged = (track: TrackType) => setDimensions({ + width: track.dimensions.width, + height: track.dimensions.height + }); track.on('dimensionsChanged', handleDimensionsChanged); return () => { track.off('dimensionsChanged', handleDimensionsChanged);