diff --git a/packages/react-intersection-observer/src/InView.tsx b/packages/react-intersection-observer/src/InView.tsx
index ab159dc5..ca60d28b 100644
--- a/packages/react-intersection-observer/src/InView.tsx
+++ b/packages/react-intersection-observer/src/InView.tsx
@@ -94,7 +94,8 @@ export class InView extends React.Component<
prevProps.triggerOnce !== this.props.triggerOnce ||
prevProps.skip !== this.props.skip ||
prevProps.trackVisibility !== this.props.trackVisibility ||
- prevProps.delay !== this.props.delay
+ prevProps.delay !== this.props.delay ||
+ prevProps.fallbackInView !== this.props.fallbackInView
) {
this.unobserve();
this.observeNode();
diff --git a/packages/react-intersection-observer/src/__tests__/InView.test.tsx b/packages/react-intersection-observer/src/__tests__/InView.test.tsx
index 971e9d0c..ede3976d 100644
--- a/packages/react-intersection-observer/src/__tests__/InView.test.tsx
+++ b/packages/react-intersection-observer/src/__tests__/InView.test.tsx
@@ -301,6 +301,30 @@ test("should render with fallback", () => {
}).toThrow();
});
+test("should update fallbackInView when the observer is unsupported", () => {
+ // @ts-expect-error Simulate a browser without IntersectionObserver.
+ window.IntersectionObserver = undefined;
+ const callback = vi.fn();
+ const { rerender } = render(
+
+ {({ inView, ref }) => {inView.toString()}
}
+ ,
+ );
+ screen.getByText("true");
+
+ rerender(
+
+ {({ inView, ref }) => {inView.toString()}
}
+ ,
+ );
+
+ screen.getByText("false");
+ expect(callback).toHaveBeenLastCalledWith(
+ false,
+ expect.objectContaining({ isIntersecting: false }),
+ );
+});
+
test("should render with global fallback", () => {
const cb = vi.fn();
// @ts-expect-error