Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Animations required for close #285

Open
mmeeks opened this issue Nov 2, 2019 · 0 comments
Open

Animations required for close #285

mmeeks opened this issue Nov 2, 2019 · 0 comments

Comments

@mmeeks
Copy link

mmeeks commented Nov 2, 2019

For one reason and another we had a vex dialog without any animation around close. There is code to handle this in vex:

  // Detect if the content el has any CSS animations defined
  var style = window.getComputedStyle(this.contentEl)
  function hasAnimationPre (prefix) {
    return style.getPropertyValue(prefix + 'animation-name') !== 'none' && style.getPropertyValue(prefix + 'animation-duration') !== '0s'
  }
  var hasAnimation = hasAnimationPre('') || hasAnimationPre('-webkit-') || hasAnimationPre('-moz-') || hasAnimationPre('-o-')

That (I guess) checks to see if the open has an animation and assumes there is one for close - but that seems ~reasonable I guess. What is not working is that:
getPropertyValue('-moz-animation-name') returns "" and not 'none' on Google Chrome - and same for '-o-animation-name'. So this code-path can't possibly work.

hasAnimationPre(prefix) should be extended to check for empty / undefined states and bail out - as an example:

    return style.getPropertyValue(prefix + 'animation-name') !== 'none' &&
              style.getPropertyValue(prefix + 'animation-name') !== '' &&
              style.getPropertyValue(prefix + 'animation-duration') !== '0s'

Would be wonderful to have a test for that too I guess.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant