aslushnikov

var allDescriptors=[{"experiment":"promiseTracker","extensions":[{"className":"WebInspector.PromisePane","order":"30","type":"drawer-view","name":"promises","title":"Promises"}],"name":"promises","dependencies":["components"],"scripts":[]},{"name":"heap_snapshot_worker","scripts":[]},{"dependencies":["source_frame","extensions"],"extensions":[{"className":"WebInspector.SourcesPanelFactory","order":2,"type":"@WebInspector.PanelFactory","name":"sources","title":"Sources"},{"className":"WebInspector.AdvancedSearchView","order":"1","type":"drawer-view","name":"sources.search","title":"Search"},{"className":"WebInspector.SourcesPanel.ContextMenuProvider","contextTypes":["WebInspector.UISourceCode","WebInspector.RemoteObject","WebInspector.NetworkRequest"],"type":"@WebInspector.ContextMenu.Provider"},{"className":"WebInspector.SourcesPanel.TogglePauseActionDelegate","contextTypes":["WebInspector.SourcesPanel","WebInspector.ShortcutRegistry.ForwardedShortcut"],"bindings":[{"platform":"windows,linux","shortcut":"F8 C

aslushnikov

diff --git a/Source/devtools/front_end/script_formatter_worker/ScriptFormatterWorker.js b/Source/devtools/front_end/script_formatter_worker/ScriptFormatterWorker.js
index 6c8401f..50a6ae1 100644
--- a/Source/devtools/front_end/script_formatter_worker/ScriptFormatterWorker.js
+++ b/Source/devtools/front_end/script_formatter_worker/ScriptFormatterWorker.js
@@ -79,8 +79,10 @@ FormatterWorker.format = function(params)
         result.mapping = { original: [0], formatted: [0] };
         result.content = FormatterWorker._formatCSS(params.content, result.mapping, 0, 0, indentString);
     } else {
+        console.time("FormatterWorker.format");
         result.mapping = { original: [0], formatted: [0] };

aslushnikov

function FullTask()
{
    this._downloadTask = new DownloadTask();
    this._processTask = new ProcessTask();
    this._renderTask = new RenderTask();

    this._progress = new ProgressModel();
    this._progress.setTotal(this._downloadTask.progress().total() * 8 + 
        this._processTask.progress().total() +
        this._renderTask.progress().total());

aslushnikov

for (var sectionModel of stylesSidebarPane.sections()) {
   sectionModel.rebaselineSourceLocations(oldRange, newRange);
}

aslushnikov

WebInspector.SharedSidebarModel.Events = {
    ComputedStyleChanged: "ComputedStyleChanged",
    MatchedStyleChanged: "MatchedStyleChanged"
}

WebInspector.SharedSidebarModel.prototype = {
    // current
    node: function() {}, // DOMNode

    // fetching

aslushnikov

CSSModel.prototype = {
    stylesForNode: function(node)
    styleSheets: function()
}

CSSRule.Events = {
    Outdated,
    SelectorUpdated,
    StyleUpdated
}

aslushnikov

CSSModel.prototype = {
    stylesForNode: NodeStyle
    styleSheets: Array<CSSStyleSheet>
}

/** CSSRule **/
CSSRule.Events = {
    Outdated,
    SelectorUpdated,
    StyleUpdated

aslushnikov

# CSS Layer

## Basic concepts
1. CSSOM changes are not supported ATM.
2. `CSSModel.StyleSheetChanged` event happens only in case of DevTools successful changes/UndoEvents and has the following information:
	- `styleSheetId` 
	- `editedRange`
	- `newText` 
3.  `CSSRule` / `CSSStyleDeclaration` / `CSSMedia` objects could be acquired as a result of `getMatchedStyles`, `getComputedStyle`, `getInlineStyle` or `getMediaQueries`. There is no other way to get these objects.
4. The `CSSMedia` objects are deduplicated. (why not dedup CSSRule?) 

aslushnikov

# CSS Layer v.2

## Backend

### 1. Granularity of StyleSheetChanged
In order to support **Undo/Redo**, the following `events` should be added to protocol's CSS domain instead of a simple `StyleSheetChanged`:
 - `StyleSheetTextChanged` - handled by `CSSEditableModel` to rebase text range
 - `RuleSelectorChanged` - handled by `CSSSelector` to update its model
 - `StyleTextChanged` - handled by `CSSStyle` to update its model
 - `MediaTextChanged` - handled by `CSSMedia` to update its model

aslushnikov

# CSS Layer v.2

The ultimate goals of the CSS design are:

 - support the **Layout Mode** modifications of CSS model
 - make *side-by-side matched styles of two nodes* user scenario possible
 - support multiple clients per css domain

The work will result in subsystem with a clean API to fetch and edit CSS styles.