Web Inspector: Command-Z doesn't work when editing CSS selectors in Styles sidebar
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 9 Sep 2016 18:25:14 +0000 (18:25 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 9 Sep 2016 18:25:14 +0000 (18:25 +0000)
commita9f9e18213ae1e6dce872b6cba6add9e54cff15f
treeb63f11e1202db99603bbbc8d619efe5afcbd91d9
parent5448bf50387a18388ae30d6cd17019a7f18a0452
Web Inspector: Command-Z doesn't work when editing CSS selectors in Styles sidebar
https://bugs.webkit.org/show_bug.cgi?id=159734

Patch by Devin Rousso <dcrousso+webkit@gmail.com> on 2016-09-09
Reviewed by Brian Burg.

Replace the current usage of -webkit-user-select with a textarea sized exactly the same as
the selector text which holds the current value of the selector.

* UserInterface/Test.html: Add WrappedPromise.

* UserInterface/Models/DOMNodeStyles.js:
(WebInspector.DOMNodeStyles.prototype.refresh.fetchedMatchedStyles):
(WebInspector.DOMNodeStyles.prototype.refresh.fetchedInlineStyles):
(WebInspector.DOMNodeStyles.prototype.refresh.fetchedComputedStyle):
(WebInspector.DOMNodeStyles.prototype.refresh):
(WebInspector.DOMNodeStyles.prototype.changeRuleSelector.ruleSelectorChanged):
(WebInspector.DOMNodeStyles.prototype.changeRuleSelector):
Ensure that the promise returned by changeRuleSelector is only resolved once the initiated
refresh has completed, ensuring that all matched selectors are parsed and available.

* UserInterface/Views/CSSStyleDeclarationSection.css:
(.style-declaration-section > .header):
(.style-declaration-section.locked > .header::before):
(.style-declaration-section.rule-disabled > .header > .icon):
(.style-declaration-section > .header > textarea):
(.style-declaration-section > .header > textarea:focus):
(.style-declaration-section > .header > textarea:focus + .selector):
(.style-declaration-section > .header > .selector):
(.style-declaration-section > .header > .selector:empty):
(.style-declaration-section > .header > .selector .matched):
(.style-declaration-section:not(.invalid-selector).rule-disabled > .header > .icon): Deleted.
(.style-declaration-section > .header > .selector:empty::before): Deleted.
(.style-declaration-section > .header > .selector:focus): Deleted.
(.style-declaration-section:matches(.locked, .selector-locked) > .header > .selector): Deleted.
(.style-declaration-section > .header > .selector > .matched): Deleted.
(.style-declaration-section.invalid-selector > .header > .icon): Deleted.
(.style-declaration-section.invalid-selector > .header > .selector): Deleted.
Added styling to make textarea invisible when not focused.
Also removed the .invalid-selector styles as the section now refreshed on all changes.

* UserInterface/Views/CSSStyleDeclarationSection.js:
(WebInspector.CSSStyleDeclarationSection):
(WebInspector.CSSStyleDeclarationSection.prototype.refresh.appendSelector):
(WebInspector.CSSStyleDeclarationSection.prototype.refresh.appendSelectorTextKnownToMatch):
(WebInspector.CSSStyleDeclarationSection.prototype.refresh):
(WebInspector.CSSStyleDeclarationSection.prototype.focusRuleSelector):
(WebInspector.CSSStyleDeclarationSection.prototype.get selectorEditable):
(WebInspector.CSSStyleDeclarationSection.prototype.get _currentSelectorText):
(WebInspector.CSSStyleDeclarationSection.prototype._handleSelectorPaste.parseTextForRule):
(WebInspector.CSSStyleDeclarationSection.prototype._handleSelectorPaste):
(WebInspector.CSSStyleDeclarationSection.prototype.get selectorLocked): Deleted.
Added a hidden textarea for modifying the selector of the represented style.

* UserInterface/Views/RulesStyleDetailsPanel.js:
(WebInspector.RulesStyleDetailsPanel.prototype.cssStyleDeclarationSectionEditorPreviousRule):
Now use new getters on CSSSTyleDeclarationSection for determining if a selector is editable.

* UserInterface/Views/Variables.css:
(:root):
Added --style-declaration-section-header-padding CSS variable.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@205754 268f45cc-cd09-0410-ab3c-d52691b4dbfc
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Models/DOMNodeStyles.js
Source/WebInspectorUI/UserInterface/Test.html
Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationSection.css
Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationSection.js
Source/WebInspectorUI/UserInterface/Views/RulesStyleDetailsPanel.js
Source/WebInspectorUI/UserInterface/Views/Variables.css