Branch: refs/heads/main
  Home:   https://github.com/WebKit/WebKit
  Commit: b1dd655b710e45f59c91ef803255a8dbc4fc94e1
      
https://github.com/WebKit/WebKit/commit/b1dd655b710e45f59c91ef803255a8dbc4fc94e1
  Author: Patrick Angle <pan...@apple.com>
  Date:   2023-03-07 (Tue, 07 Mar 2023)

  Changed paths:
    M LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt
    M 
LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping-expected.txt
    M LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping.html
    M LayoutTests/inspector/css/modify-css-property-expected.txt
    M LayoutTests/inspector/css/modify-css-property.html
    M LayoutTests/inspector/css/resources/modify-css-property.css
    M Source/JavaScriptCore/inspector/protocol/CSS.json
    M Source/WebCore/css/CSSPropertySourceData.h
    M Source/WebCore/css/parser/CSSParserImpl.cpp
    M Source/WebCore/css/parser/CSSParserImpl.h
    M Source/WebCore/css/parser/CSSParserObserver.h
    M Source/WebCore/inspector/InspectorStyleSheet.cpp
    M Source/WebCore/inspector/InspectorStyleSheet.h
    M Source/WebCore/inspector/agents/InspectorCSSAgent.cpp
    M Source/WebInspectorUI/UserInterface/Models/CSSRule.js
    M Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js
    M Source/WebInspectorUI/UserInterface/Models/DOMNodeStyles.js

  Log Message:
  -----------
  Web Inspector: Implicitly nested property declarations inside non-style rules 
results in nested content being deleted during editing or displaying incorrect 
matched styles for elements
https://bugs.webkit.org/show_bug.cgi?id=251565
rdar://104821946

Reviewed by Devin Rousso.

InspectorStyleSheet was built with the assumption that Style rules contained 
property declarations, and nothing else.
CSS nesting has proven this assumption wrong in significant ways by allowing 
properties and other rules to be declared,
interleaved inside a rule. This includes inside @ rules, which previously could 
not contain property delcarations
directly.

This means during editing, we only want to replace the property declarations, 
not the full body of a rule, since the
rule may contain other rules. Luckily, canonically all property declarations 
occur before all nested rules, so we can
safely move nested rules below to make our lives a bit easier with no harm to 
the meaning of the style sheet.

This fix adds instrumentation to the CSS parser so we can be informed of the 
new "implicit" nested rule that contains
properties inside of non-style rules. It also overhauls how rule body text is 
edited, much like we had to last year for
rule header text.

* LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt:
- Account for new property of CSSRule.

* 
LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping-expected.txt:
* LayoutTests/inspector/css/getMatchedStylesForNodeNestingStyleGrouping.html:
* LayoutTests/inspector/css/modify-css-property-expected.txt:
* LayoutTests/inspector/css/modify-css-property.html:
* LayoutTests/inspector/css/resources/modify-css-property.css:
- Add test cases for implicitly nested rules and their siblings, children, and 
parents.

* Source/JavaScriptCore/inspector/protocol/CSS.json:
- Mark implicitly nested rules so that the frontend can prevent the editing of 
their selector.

* Source/WebCore/css/CSSPropertySourceData.h:
(WebCore::CSSRuleSourceData::CSSRuleSourceData):
- The container rule types can now contain properties, so we always need to 
have the buffer for that information ready,
since we won't be informed by the parser that an implicit nested context was 
created until after we have observed the
properties themselves.

* Source/WebCore/css/parser/CSSParserImpl.cpp:
(WebCore::CSSParserImpl::consumeRegularRuleList):
(WebCore::CSSParserImpl::consumeDeclarationListOrStyleBlockHelper):
(WebCore::CSSParserImpl::consumeStyleBlock):
* Source/WebCore/css/parser/CSSParserImpl.h:
- Don't send duplicate bodyStart/bodyEnd messages to the observer.
- Notify the observer when the engine has created an implict nested rule inside 
a body.

* Source/WebCore/css/parser/CSSParserObserver.h:

* Source/WebCore/inspector/InspectorStyleSheet.cpp:
(WebCore::atRuleIdentifierForType):
(WebCore::isValidRuleHeaderText):
- Pull the mapping of types to their keyword text for reuse in setting new 
style text.

(WebCore::StyleSheetHandler::endRuleBody):
- In order to maintain parity with CSSOM's representation of styles, we need to 
create an implictly nested rule to
match against the CSSOM's implicitly nested rule. This also allows us to inform 
the frontend that said CSSOM rule was
implicitly nested, since the OM itself doesn't carry this information.

(WebCore::StyleSheetHandler::markRuleBodyContainsImplicitlyNestedProperties):
- Observe to mark the style rule data as containing implicitly nested 
properties, which will then trigger us to take those properties and mvoe them 
to a special implicit style rule data object.

(WebCore::InspectorStyleSheet::buildObjectForRule):

(WebCore::isNotSpaceOrTab):
(WebCore::InspectorStyleSheet::setRuleStyleText):
- Overhaul the setting of style text.
- Undo/oldText is handled specially because we want to restore the sheet back 
to the non-canonical form after an edit.
- The frontend does not provide nested rules as part of its new text, so we 
must readd them ourselves, which we can do
from the original style sheet.
- Indentation is matched to the new property delcartion text provided by the 
frontend.

(WebCore::InspectorStyleSheetForInlineStyle::setRuleStyleText):
- Match the method signature for non-inline styles, and simplify the 
indirection previously present for setting a style
rule's/inline style's text.

(WebCore::InspectorStyle::setText): Deleted.
(WebCore::InspectorStyleSheet::setStyleText): Deleted.
(WebCore::InspectorStyleSheetForInlineStyle::setStyleText): Deleted.
* Source/WebCore/inspector/InspectorStyleSheet.h:

* Source/WebCore/inspector/agents/InspectorCSSAgent.cpp:
- Adopt new method to set the body text of a rule.

* Source/WebInspectorUI/UserInterface/Models/CSSRule.js:
(WI.CSSRule):
(WI.CSSRule.prototype.get isImplicitlyNested):
* Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js:
(WI.CSSStyleDeclaration.prototype.get selectorEditable):
* Source/WebInspectorUI/UserInterface/Models/DOMNodeStyles.js:
(WI.DOMNodeStyles.prototype._parseRulePayload):
- Mark the selector of implicitly nested rules as non-editable.

Canonical link: https://commits.webkit.org/261329@main


_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to