Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
ElliotGeno

NS_ERROR_FAILURE with TweenMax, SVG and Firefox

Recommended Posts

I wonder if anyone else got this error on Firefox... NS_ERROR_FAILURE

 

ColorWheel Bug

 

It seems to be a combo of TweenMax and SVG in Firefox in Mac and Windows.

 

Chrome looks correct. There should be two color wheels on the bottom of the screen. Pressing and releasing them should select colors.

Link to comment
Share on other sites

Seems like its a Firefox bug with getBBox().

 

How do you work around this?

Link to comment
Share on other sites

I found the culprit! It is because the SVG is not appended to the document before applying any TweenMax stuff to it. The solution was to temporarily appendChild to the document after initing the SVG object. Then appending the child elsewhere to place it.

ColorWheel Fixed

  • Like 3
Link to comment
Share on other sites

Hi Elliot,

 

Glad you figured it out and thanks for sharing your findings.

Really dig the Color Picker. Slick.

 

Carl

Link to comment
Share on other sites

Yeah, nice work on the color picker. Sweet!

Link to comment
Share on other sites

  • 9 months later...

I am having this same issue now. However the SVG is inlined to the DOM and is not under any circumstance display:none in any of its parents. Its really pissing me off. The weird thing is in this codepen it works fine:

 

See the Pen MarYZr?editors=101 by pr1nt_r (@pr1nt_r) on CodePen

 

But on my site it NS_ERROR_FAILURE. I can't for the life of me figure out what is going on. Is there anything you guys can think of at all that could cause this if not the display:none issue?

 

btw its pretty much impossible to debug GSAP midtween :( I had to go turning every tween off/on to figure out which one it was to even isolate the code that was producing it.

 

Maybe adding some error handling that identified the element selector being tweened?

Link to comment
Share on other sites

Nevermind, I am dumb. turns i had 2 elements with same ID!  I need to not ID my svgs.

  • Like 1
Link to comment
Share on other sites

Just to put my 2 cents..

 

Firefox has a bug report someone submitted .. but it is really not a bug it is what the SVG spec dictates, that when you try to access an element that is an SVG element that is either missing, has display:none or not visible. It will throw that NS_ERROR_FAILURE, since any element that is missing, has display:none or hidden will be removed from the render tree making it throw that error since it does not exist.

 

https://bugzilla.mozilla.org/show_bug.cgi?id=612118

 

:)

  • Like 2
Link to comment
Share on other sites

  • 2 months later...

Jonathan, you saved my skin! Thanks a ton for the info.

  • Like 3
Link to comment
Share on other sites

  • 5 months later...

Hi Guys

 

I have the same problem (NS_ERROR_FAILURE in Firefox with TweenMax and SVG) but no idea how to diagnose/fix this issue... see codepen below... can anyone help? The timeline doesn't play, I can see something running in the web console?

 

See the Pen dXYZBY by iamaandy (@iamaandy) on CodePen

Link to comment
Share on other sites

Thanks Carl... typical noob mistake... apologies for wasting your time... I would say (barring a few token noob errors like this) I have managed to get up and running with Green Sock within a couple of days with fairly limited JS knowledge so kudos to the team!

Link to comment
Share on other sites

No worries. That's why we are here. Glad you are having success!

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×