3.11.5 new error with MotionPath: "Failed to execute 'getComputedStyle'" #531
Comments
|
I do apologize - this should be fixed in the next release which you can preview at: One of the improvements we made in 3.11.5 inadvertently introduced this problem if the target of your motionPath tween is not a DOM element. Please try replacing the core GSAP file with the beta file I linked to above and let us know if it resolves things for you. If you need an ES Module instead, let me know and I can get you that. |
|
No worries, these things happen! I'm using npm and esm imports. Happy to help test, but also no need to provide a fix for me until the new version ships. I always pin dependencies (no such thing as a non-breaking change imo) so I don't mind hanging out on 3.11.4. |
|
Sure, here's a .tgz file that you can npm install: (link valid for at least the next 5 days) Does that help? |
jackdoyle
added a commit
that referenced
this issue
Jun 6, 2023
- NEW: Ever had ScrollTriggered animations at the very top of your page start out partially-scrubbed? Now you can clamp() them! Wrap your ScrollTrigger start/end values with "clamp()" to prevent them from "leaking" outside the bounds of the page. They'll never start before a scroll position of 0, nor will they finish after the maximum scroll. Clamped ScrollTriggers make all your "above the fold" elements start off in their native positions. - NEW: For ScrollSmoother, you can now wrap your data-speed value in "clamp()" to make the associated element start out in its natural position if it's within the viewport at the top of the page (meaning the resulting ScrollTrigger would otherwise have a negative start value), and it also will have the same effect if the element is at the very bottom of the page and the associated effect's ScrollTrigger would normally have an end value that exceeds the maximum scroll position. See https://greensock.com/forums/topic/36177-scrollsmoother-data-speed-and-firstlast-folds/ - NEW: ScrollSmoother officially recognizes a new "speed" property that you can use to make the page scroll faster or slower. - IMPROVED: TypeScript string-based eases added to improve code hinting in some editors. See #533 - IMPROVED: if you set dragClickables: false in a React app, since React adds an onclick handler on the root, things wouldn't be draggable. So having an onclick handler no longer causes something to be deemed "clickable". You can always use the clickableTest function if you'd like to run your own logic. See https://greensock.com/forums/topic/36854-using-a-handle-touchpoint-to-manipulate-a-draggable-object-allowing-for-form-interaction/ - IMPROVED: PixiPlugin now recognizes the new location for filters in Pixi version 7.1 and later. See https://greensock.com/forums/topic/36997-pixi-plugin-deprecation-v7/ - FIXED: regression in 3.11.5 could cause a motionPath tween to throw an error if the target is not a DOM element and you're animating transform-related properties like "x" or "y". See #531 - FIXED: if a Flip-related tween is reverted when it is paused, it wouldn't clear out the inline styles properly. Related to this thread in the forums: https://greensock.com/forums/topic/36259-flip-resize/ - FIXED: ScrollSmoother might appear to jump slightly on the very first scroll in a specific situation. See https://greensock.com/forums/topic/35244-there-is-a-lag-with-page-scrolling-while-using-scrollsmoother/ - FIXED: Some frameworks like Vue make the value of Refs into Proxies, so when you store a gsap.context() or gsap.matchMedia() in a Ref and then revert() it (perhaps onUnmount()), the Proxy that the framework imposed interfered with GSAP's ability to match up the original object with the Proxy, so a matchMedia() may not get properly killed in some edge cases. See https://greensock.com/forums/topic/36313-use-matchmedia-with-scrolltrigger-pin-in-nuxt3-will-get-error-after-breakpoint-change/ - FIXED: if you create a timeline inside a gsap.context() with a callback like onComplete it may still get called after revert() is called on the context. Timelines are now properly killed in the context.revert() call. See https://greensock.com/forums/topic/35365-react-and-gsap-timelines-callbacks/ - FIXED: if you disable() a Draggable that's in the middle of an inertia animation, it'll kill() that animation. - FIXED: in 3.11.5 if you set overflow-y: scroll on the <body> and you used ScrollTrigger to pin something on a page that natively doesn't have any scroll, it might horizontally size things slightly wrong (as if there was an extra scrollbar's worth of space). - FIXED: if you set a "speed" on a ScrollSmoother and then the content resizes when the page is scrolled all the way to the bottom, it may jump the scroll position incorrectly. See https://greensock.com/forums/topic/36602-scrollsmoother-with-accordion-animation-makes-page-jump/ - FIXED: if you create a staggered tween inside a gsap.context() and then kill()/revert() the context, it could throw an error. See #536 - FIXED: if you use selector text for an endTrigger of a ScrollTrigger that was created inside of a scoped gsap.context(), it may not honor that scope. See #537 - FIXED: if you initiate a ScrollTriggered from() animation that has a stagger BEFORE ScrollSmoother is created, it may render incorrectly initially. See https://greensock.com/forums/topic/36777-scrollsmoother-splittext-nextjs/ and https://codepen.io/GreenSock/pen/eYPyPpd?editors=0010 - FIXED: if you create a ScrollSmoother AFTER already creating ScrollTriggers, and you revert() and then re-create the ScrollSmoother (sometimes happens in environments like Next.js), it may revert() those pre-existing ScrollTriggers even if they weren't created inside the context in which the ScrollSmoother was created. See https://greensock.com/forums/topic/36777-scrollsmoother-splittext-nextjs/ - FIXED: if you apply a ScrollTrigger to an element that also has data-speed and ScrollSmoother is controlling it, the end scroll position may be miscalculated. See https://greensock.com/forums/topic/36930-scrollsmoother-with-data-speed-causes-wrong-scrolltrigger-positions/ - FIXED: if you create a gsap.context() or gsap.matchMedia() inside a scoped gsap.context() (nested), it wouldn't honor the outer scope as the default. - FIXED: a regression in 3.11.x could cause timeline event callbacks and onEnter/onLeave ScrollTrigger callbacks not to fire properly on a ScrollTrigger-scrubbed timeline when the page is reloaded after scrolling down (scroll restoration). See #538 - FIXED: if you use data-speed="auto" on an element with ScrollSmoother, a very specific aspect ratio could cause the element to move in the wrong direction. See https://greensock.com/forums/topic/37185-issues-with-scrollsmoother-for-images-past-a-certain-width/
This was referenced Sep 13, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hey all – when I updated to 3.11.5, my MotionPath plugin started crashing with the error
Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.I'm not targeting an HTMLElement, I'm targeting a babylon.js mesh's
positionproperty. This was working as expected in 3.11.4.I've reverted and pinned 3.11.4 for now. Any pointers on what is happening? Appreciate any help!
Here is my code.
The text was updated successfully, but these errors were encountered: