Skip to content

Animations using WebAnimations reports "Unsupported CSS property" #11658

@bakura10

Description

@bakura10

What is the current behavior?

Lighthouse reports me some issue in the performance panel with "Unsupported CSS property" (without even more details on which property is invalid):

image

The only rather unusual thing here is that I am using WebAnimations JS. Here is for instance the animation I am doing:

imageElement.animate({
        visibility: 'visible',
        clipPath: ['inset(100% 0 0 0)', 'inset(0 0 0 0)']
      }, {
        duration: 800,
        easing: 'cubic-bezier(0.5, 0.06, 0.01, 0.99)',
        fill: 'forwards'
      });

Is Lighthouse not compatible with WebAnimation JS or is the elements I animate indeed cannot be composited (if that's the case they should not be reported by the tool?

Thanks :)

Environment Information

  • Lighthouse version: 6.2
  • Chrome version:
  • Operating System: OS X

Related issues

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions