-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Web Inspector: Font Panel: CSS font property values marked !important don't get overridden when using the interactive editing controls. #21557
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
Web Inspector: Font Panel: CSS font property values marked !important don't get overridden when using the interactive editing controls. #21557
Conversation
|
EWS run on previous version of this PR (hash b2d78f6) Details
|
|
EWS run on previous version of this PR (hash 5292f06) Details
|
|
I see this is still a draft so I won't review it yet. I also notice you closed the previous PR for the same task: #20015 That's unfortunate. There are useful comments in there. In general, it's preferable to keep the same PR and iterate on the code to maintain that history for people in the future who research why a patch was made a certain way. |
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.
There's no need to modify the value here in the parsing stage when receiving it from the backend.
This is causing the inspector/css/modify-inline-style.html test to fail.
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.
Removed it
|
EWS run on previous version of this PR (hash c3966d9) Details
|
|
EWS run on previous version of this PR (hash 3e6ed13) Details
|
|
EWS run on previous version of this PR (hash a220164) Details
|
|
EWS run on previous version of this PR (hash 31365b0) Details
|
|
EWS run on previous version of this PR (hash 13945c9) Details
|
|
EWS run on previous version of this PR (hash 5a39e81) Details
|
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.
This will change always add the !important suffix to the written property value.
It should be added only when the property value collected from the page originally was marked with !important.
To find identify that, you can update WI.FontStyles._computeProperty() to look at the important property of the WI.CSSProperty collected into WI.DOMNodeStyles.
Like this:
// returns true if the CSS property was authored with `!important` in its value (which exists on WI.CSSProperty._rawValue)
style.domNodeStyle.effectivePropertyForName(name).importantUpdate the object returned by WI.FontStyles._computeProperty with an additional property, like isImportant or similar.
Note
The name of that return object is misleadingly pluralised now as resultProperties. It should be resultProperty since that method operates on a single property. Probably a typo from when it was written.
If you follow that return object, you'll notice it gets collected with the other ones for other CSS properties in WI.FontStyles._propertiesMap.
That's the map you can then check against in WI.FontStyles.writeFontVariation() to check whether the value of the CSS property you're trying to update was originally marked important. If so, concatenate the "!important" to targetPropertyValue.
You don't have to make any changes outside of WI.FontStyles to fix this bug. Please don't change WI.CSSProperty
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.
inspectorOverrideImportant does not exist on WI.CSSProperty. Please remove.
|
EWS run on previous version of this PR (hash ce47351) Details
|
|
EWS run on previous version of this PR (hash 923cd33) Details
|
rcaliman-apple
left a comment
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.
Thank you for fixing this.
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.
The code comment is redundant. Please remove it. I had put it in the code snippet in my review as an explanation for you
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.
Removed
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.
Please rename resultProperties to resultProperty inside this method. The plural form is a typo from the original patch. This method deals with a single property.
|
EWS run on previous version of this PR (hash 08170d6) Details
|
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.
FYI we're already calling this inside _effectivePropertyValueForName, so i think we could/should avoid that
let effectivePropertyForName = style.domNodeStyle.effectivePropertyForName(name);
let value = effectivePropertyForName?.value;
...
resultProperty.isImportant = effectivePropertyForName?.important ?? false;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.
Added
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.
We need to keep return resultProperties included
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.
Removing return resultProperties was causing web inspector test cases to fail, so I added it back
|
EWS run on previous version of this PR (hash 4c81087) Details
|
|
EWS run on previous version of this PR (hash a6e89fe) Details
|
|
EWS run on current version of this PR (hash ff503c3) Details |
|
I'm ok with this landing. @dcrousso want to approve? |
… don't get overridden when using the interactive editing controls. https://bugs.webkit.org/show_bug.cgi?id=258975 Reviewed by Devin Rousso. If a CSS class has a !important tag on a property the slider does not work correctly. This is due to us modifying the inline style, and the inline style is being overriden by the css class !important property. We can address this by checking if the !important property is being applied already during _computeProperty(), and then if it is then append !important in the writeFontVariation(). Rename resultProperties to resultProperty inside of _computeProperty() because there is a single property being handled. Delete _effectivePropertyValueForName function since it is not in use and create it in _computeProperty instead to be used for resultProperty.isImportant. * Source/WebInspectorUI/UserInterface/Models/FontStyles.js: (WI.FontStyles.prototype.writeFontVariation): (WI.FontStyles): Canonical link: https://commits.webkit.org/275389@main
|
Committed 275389@main (793932c): https://commits.webkit.org/275389@main Reviewed commits have been landed. Closing PR #21557 and removing active labels. |

🛠 🧪 jsc
793932c
ff503c3