Merge pull request #1970 from framer/fix/remove-viewport-fallback

Removing IntersectionObserver fallback
motiondivision · Feb 24, 2023 · 20d9661 · 20d9661
2 parents 3fb6d05 + 3547e32
commit 20d9661
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 50 deletions.
diff --git a/packages/framer-motion/src/motion/features/viewport/index.ts b/packages/framer-motion/src/motion/features/viewport/index.ts
@@ -12,41 +12,11 @@ export class InViewFeature extends Feature<Element> {
 
     private isInView = false
 
-    /**
-     * TODO: Remove this in 10.0
-     */
-    private viewportFallback() {
-        /**
-         * Fire this in an rAF because, at this point, the animation state
-         * won't have flushed for the first time and there's certain logic in
-         * there that behaves differently on the initial animation.
-         */
-        requestAnimationFrame(() => {
-            this.hasEnteredView = true
-            const { onViewportEnter } = this.node.getProps()
-            onViewportEnter && onViewportEnter(null)
-            if (this.node.animationState) {
-                this.node.animationState.setActive("whileInView", true)
-            }
-        })
-    }
-
     private startObserver() {
         this.unmount()
 
         const { viewport = {} } = this.node.getProps()
-        const {
-            root,
-            margin: rootMargin,
-            amount = "some",
-            once,
-            fallback = true,
-        } = viewport
-
-        if (typeof IntersectionObserver === "undefined") {
-            if (fallback) this.viewportFallback()
-            return
-        }
+        const { root, margin: rootMargin, amount = "some", once } = viewport
 
         const options = {
             root: root ? root.current : undefined,

diff --git a/packages/framer-motion/src/motion/features/viewport/types.ts b/packages/framer-motion/src/motion/features/viewport/types.ts
@@ -11,10 +11,6 @@ export interface ViewportOptions {
     once?: boolean
     margin?: string
     amount?: "some" | "all" | number
-    /**
-     * @deprecated IntersectionObserver fallback will always be disabled from 10.0. Prefer polyfill for older browser support.
-     */
-    fallback?: boolean
 }
 
 export interface ViewportProps {

diff --git a/packages/framer-motion/src/render/dom/viewport/index.ts b/packages/framer-motion/src/render/dom/viewport/index.ts
@@ -18,16 +18,6 @@ export function inView(
     onStart: (entry: IntersectionObserverEntry) => void | ViewChangeHandler,
     { root, margin: rootMargin, amount = "any" }: InViewOptions = {}
 ): VoidFunction {
-    /**
-     * If this browser doesn't support IntersectionObserver, return a dummy stop function.
-     * Default triggering of onStart is tricky - it could be used for starting/stopping
-     * videos, lazy loading content etc. We could provide an option to enable a fallback, or
-     * provide a fallback callback option.
-     */
-    if (typeof IntersectionObserver === "undefined") {
-        return () => {}
-    }
-
     const elements = resolveElements(elementOrSelector)
 
     const activeIntersections = new WeakMap<Element, ViewChangeHandler>()

diff --git a/yarn.lock b/yarn.lock
@@ -7844,8 +7844,8 @@ __metadata:
     cache-loader: ^1.2.5
     convert-tsconfig-paths-to-webpack-aliases: ^0.9.2
     fork-ts-checker-webpack-plugin: ^6.2.0
-    framer-motion: ^9.1.6
-    framer-motion-3d: ^9.1.6
+    framer-motion: ^9.1.7
+    framer-motion-3d: ^9.1.7
     path-browserify: ^1.0.1
     react: ^18.2.0
     react-dom: ^18.2.0
@@ -7911,14 +7911,14 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"framer-motion-3d@^9.1.6, framer-motion-3d@workspace:packages/framer-motion-3d":
+"framer-motion-3d@^9.1.7, framer-motion-3d@workspace:packages/framer-motion-3d":
   version: 0.0.0-use.local
   resolution: "framer-motion-3d@workspace:packages/framer-motion-3d"
   dependencies:
     "@react-three/fiber": ^8.2.2
     "@react-three/test-renderer": ^9.0.0
     "@rollup/plugin-commonjs": ^22.0.1
-    framer-motion: ^9.1.6
+    framer-motion: ^9.1.7
     react-merge-refs: ^2.0.1
   peerDependencies:
     "@react-three/fiber": ^8.2.2
@@ -7928,7 +7928,7 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"framer-motion@^9.1.6, framer-motion@workspace:packages/framer-motion":
+"framer-motion@^9.1.7, framer-motion@workspace:packages/framer-motion":
   version: 0.0.0-use.local
   resolution: "framer-motion@workspace:packages/framer-motion"
   dependencies: