-
Notifications
You must be signed in to change notification settings - Fork 9.4k
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
audit(non-composited-animations): add UIString for custom properties #15571
base: main
Are you sure you want to change the base?
audit(non-composited-animations): add UIString for custom properties #15571
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you add a new unit test to this file:
https://github.com/GoogleChrome/lighthouse/blob/main/core/test/audits/non-composited-animations-test.js#L1
@@ -91,9 +101,18 @@ function getActionableFailureReasons(failureCode, unsupportedProperties) { | |||
.filter(reason => failureCode & reason.flag) | |||
.map(reason => { | |||
if (reason.text === UIStrings.unsupportedCSSProperty) { | |||
const nonCustomUnSupportedProperties = unsupportedProperties | |||
.filter(property => !property.startsWith('--')); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit
.filter(property => !property.startsWith('--')); | |
.filter(property => !property.startsWith('--')); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
sure
Will do in a bit
@@ -91,9 +101,18 @@ function getActionableFailureReasons(failureCode, unsupportedProperties) { | |||
.filter(reason => failureCode & reason.flag) | |||
.map(reason => { | |||
if (reason.text === UIStrings.unsupportedCSSProperty) { | |||
const nonCustomUnSupportedProperties = unsupportedProperties |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
const nonCustomUnSupportedProperties = unsupportedProperties | |
const nonCustomUnsupportedProperties = unsupportedProperties |
Summary
Animating custom properties appear to always end up non-composited (at least outside of CSS painting), and get lumped with all the other non-composited CSS properties found in the trace (don't be surprised like me and note that this happens regardless of what the property is animating, e.g. animating translate through fixed values is usually composited, animating --yheight in translate: 0 var(--yheight) will not be).
Related Issues/PRs
Closes #14521