Changeset 65942 in webkit


Ignore:
Timestamp:
Aug 24, 2010 3:33:39 PM (14 years ago)
Author:
Joseph Pecoraro
Message:

2010-08-20 Joseph Pecoraro <Joseph Pecoraro>

Reviewed by Pavel Feldman.

Web Inspector: Backend Should Provide Full Supported CSS Properties List
​https://bugs.webkit.org/show_bug.cgi?id=40886

This allows the backend to send the front-end its complete list of
supported CSS Properties. This is used in CSS Autocompletion and
CSS Syntax Highlighting to show which styles are supported.

  • css/makeprop.pl: moved CSS properties to the header file.
  • inspector/Inspector.idl: expose getSupportedCSSProperties.
  • inspector/InspectorDOMAgent.cpp: (WebCore::InspectorDOMAgent::getSupportedCSSProperties):
  • inspector/InspectorDOMAgent.h:
  • inspector/front-end/CSSCompletions.js: (WebInspector.CSSCompletions._firstIndexOfPrefix): handle a possible error case before properties have loaded. (WebInspector.CSSCompletions._load): fill up the special array with the received properties.
  • inspector/front-end/SourceCSSTokenizer.js: (WebInspector.SourceCSSTokenizer): use the list of support properties from the backend.
  • inspector/front-end/SourceCSSTokenizer.re2js:
  • inspector/front-end/inspector.js: request the list of supported CSS properties on load. (WebInspector.doLoadedDone):
Location:
trunk/WebCore
Files:
9 edited

Legend:

Unmodified
Added
Removed

  • trunk/WebCore/ChangeLog

    r65941 r65942  
     12010-08-20  Joseph Pecoraro  <joepeck@webkit.org>
     2
     3        Reviewed by Pavel Feldman.
     4
     5        Web Inspector: Backend Should Provide Full Supported CSS Properties List
     6        https://bugs.webkit.org/show_bug.cgi?id=40886
     7
     8        This allows the backend to send the front-end its complete list of
     9        supported CSS Properties. This is used in CSS Autocompletion and
     10        CSS Syntax Highlighting to show which styles are supported.
     11
     12        * css/makeprop.pl: moved CSS properties to the header file.
     13        * inspector/Inspector.idl: expose getSupportedCSSProperties.
     14        * inspector/InspectorDOMAgent.cpp:
     15        (WebCore::InspectorDOMAgent::getSupportedCSSProperties):
     16        * inspector/InspectorDOMAgent.h:
     17        * inspector/front-end/CSSCompletions.js:
     18        (WebInspector.CSSCompletions._firstIndexOfPrefix): handle a possible error case before properties have loaded.
     19        (WebInspector.CSSCompletions._load): fill up the special array with the received properties.
     20        * inspector/front-end/SourceCSSTokenizer.js:
     21        (WebInspector.SourceCSSTokenizer): use the list of support properties from the backend.
     22        * inspector/front-end/SourceCSSTokenizer.re2js:
     23        * inspector/front-end/inspector.js: request the list of supported CSS properties on load.
     24        (WebInspector.doLoadedDone):
     25
    1262010-08-24  Adam Barth  <abarth@webkit.org>
    227

  • trunk/WebCore/css/makeprop.pl

    r61091 r65942  
    9696print HEADER "const size_t maxCSSPropertyNameLength = $maxLen;\n";
    9797
     98print HEADER "const char* const propertyNameStrings[$num] = {\n";
     99foreach my $name (@names) {
     100  print HEADER "\"$name\",\n";
     101}
     102print HEADER "};\n";
     103
    98104print HEADER << "EOF";
    99105
    … …  
    109115
    110116open C, ">>CSSPropertyNames.cpp" || die "Could not open CSSPropertyNames.cpp for writing";
    111 print C "static const char * const propertyNameStrings[$num] = {\n";
     117print C << "EOF";
    112118
    113 foreach my $name (@names) {
    114   print C "\"$name\",\n";
    115 }
    116 
    117 print C << "EOF";
    118 };
    119119const char* getPropertyName(CSSPropertyID id)
    120120{

  • trunk/WebCore/inspector/Inspector.idl

    r65870 r65942  
    197197        [handler=DOM] void setRuleSelector(in long callId, in long ruleId, in String selector, in long selectedNodeId, out Value rule, out boolean selectorAffectsNode);
    198198        [handler=DOM] void addRule(in long callId, in String selector, in long selectedNodeId, out Value rule, out boolean selectorAffectsNode);
     199        [handler=DOM] void getSupportedCSSProperties(in long callId, out Array cssProperties);
    199200
    200201        [handler=Controller] void getCookies(in long callId, out Array cookies, out String cookiesString);

  • trunk/WebCore/inspector/InspectorDOMAgent.cpp

    r65891 r65942  
    3636#include "CSSComputedStyleDeclaration.h"
    3737#include "CSSMutableStyleDeclaration.h"
     38#include "CSSPropertyNames.h"
    3839#include "CSSRule.h"
    3940#include "CSSRuleList.h"
    … …  
    14101411}
    14111412
     1413void InspectorDOMAgent::getSupportedCSSProperties(RefPtr<InspectorArray>* cssProperties)
     1414{
     1415    RefPtr<InspectorArray> properties = InspectorArray::create();
     1416    for (int i = 0; i < numCSSProperties; ++i)
     1417        properties->pushString(propertyNameStrings[i]);
     1418    *cssProperties = properties.release();
     1419}
     1420
    14121421PassRefPtr<InspectorObject> InspectorDOMAgent::buildObjectForStyle(CSSStyleDeclaration* style, bool bind)
    14131422{

  • trunk/WebCore/inspector/InspectorDOMAgent.h

    r65891 r65942  
    129129        void setRuleSelector(long ruleId, const String& selector, long selectedNodeId, RefPtr<InspectorValue>* ruleObject, bool* selectorAffectsNode);
    130130        void addRule(const String& selector, long selectedNodeId, RefPtr<InspectorValue>* ruleObject, bool* selectorAffectsNode);
     131        void getSupportedCSSProperties(RefPtr<InspectorArray>* cssProperties);
    131132
    132133        // Methods called from the InspectorController.

  • trunk/WebCore/inspector/front-end/CSSCompletions.js

    r61514 r65942  
    1 WebInspector.CSSCompletions = (function() {
    2     var used = {};
    3     var properties = [];
    4     var style = document.documentElement.style;
    5     var list = document.defaultView.getComputedStyle(document.documentElement, "");
    6     var length = list.length;
    7     for (var i = 0; i < length; ++i)
    8         used[properties[i] = list[i]] = true;
    9 
    10     for (var i = 0, end = length; i < length; ++i) {
    11         var propertyWords = properties[i].split("-");
    12         var j = propertyWords.length;
    13         while (--j) {
    14             propertyWords.pop();
    15             var shorthand = propertyWords.join("-");
    16             if (!(shorthand in used) && style[shorthand] !== undefined) {
    17                 used[shorthand] = true;
    18                 properties[end++] = shorthand;
    19             }
    20         }
    21     }
    22 
    23     return properties.sort();
    24 })();
     1WebInspector.CSSCompletions = [];
    252
    263WebInspector.CSSCompletions.startsWith = function(prefix)
    … …  
    4522{
    4623    if (!prefix)
     24        return -1;
     25    if (!this.length)
    4726        return -1;
    4827
    … …  
    10180    return propertiesWithPrefix[j];
    10281}
     82
     83WebInspector.CSSCompletions._load = function(properties)
     84{
     85    for (var i = 0; i < properties.length; ++i)
     86        WebInspector.CSSCompletions.push(properties[i]);
     87    WebInspector.CSSCompletions.sort();
     88}

  • trunk/WebCore/inspector/front-end/SourceCSSTokenizer.js

    r63342 r65942  
    4646    WebInspector.SourceTokenizer.call(this);
    4747
    48     this._propertyKeywords = [
    49         "background", "background-attachment", "background-clip", "background-color", "background-image",
    50         "background-origin", "background-position", "background-position-x", "background-position-y",
    51         "background-repeat", "background-repeat-x", "background-repeat-y", "background-size", "border",
    52         "border-bottom", "border-bottom-color", "border-bottom-left-radius", "border-bottom-right-radius",
    53         "border-bottom-style", "border-bottom-width", "border-collapse", "border-color", "border-left",
    54         "border-left-color", "border-left-style", "border-left-width", "border-radius", "border-right",
    55         "border-right-color", "border-right-style", "border-right-width", "border-spacing", "border-style",
    56         "border-top", "border-top-color", "border-top-left-radius", "border-top-right-radius", "border-top-style",
    57         "border-top-width", "border-width", "bottom", "caption-side", "clear", "clip", "color", "content",
    58         "counter-increment", "counter-reset", "cursor", "direction", "display", "empty-cells", "float",
    59         "font", "font-family", "font-size", "font-stretch", "font-style", "font-variant", "font-weight",
    60         "height", "left", "letter-spacing", "line-height", "list-style", "list-style-image", "list-style-position",
    61         "list-style-type", "margin", "margin-bottom", "margin-left", "margin-right", "margin-top", "max-height",
    62         "max-width", "min-height", "min-width", "opacity", "orphans", "outline", "outline-color", "outline-offset",
    63         "outline-style", "outline-width", "overflow", "overflow-x", "overflow-y", "padding", "padding-bottom",
    64         "padding-left", "padding-right", "padding-top", "page", "page-break-after", "page-break-before",
    65         "page-break-inside", "pointer-events", "position", "quotes", "resize", "right", "size", "src",
    66         "table-layout", "text-align", "text-decoration", "text-indent", "text-line-through", "text-line-through-color",
    67         "text-line-through-mode", "text-line-through-style", "text-line-through-width", "text-overflow", "text-overline",
    68         "text-overline-color", "text-overline-mode", "text-overline-style", "text-overline-width", "text-rendering",
    69         "text-shadow", "text-transform", "text-underline", "text-underline-color", "text-underline-mode",
    70         "text-underline-style", "text-underline-width", "top", "unicode-bidi", "unicode-range", "vertical-align",
    71         "visibility", "white-space", "widows", "width", "word-break", "word-spacing", "word-wrap", "z-index", "zoom",
    72         "-webkit-animation", "-webkit-animation-delay", "-webkit-animation-direction", "-webkit-animation-duration",
    73         "-webkit-animation-iteration-count", "-webkit-animation-name", "-webkit-animation-play-state",
    74         "-webkit-animation-timing-function", "-webkit-appearance", "-webkit-backface-visibility",
    75         "-webkit-background-clip", "-webkit-background-composite", "-webkit-background-origin", "-webkit-background-size",
    76         "-webkit-binding", "-webkit-border-end", "-webkit-border-end-color", "-webkit-border-end-style", "-webkit-border-end-width",
    77         "-webkit-border-fit", "-webkit-border-horizontal-spacing", "-webkit-border-image",
    78         "-webkit-border-radius", "-webkit-border-start", "-webkit-border-start-color", "-webkit-border-start-style",
    79         "-webkit-border-start-width","-webkit-border-vertical-spacing", "-webkit-box-align", "-webkit-box-direction",
    80         "-webkit-box-flex", "-webkit-box-flex-group", "-webkit-box-lines", "-webkit-box-ordinal-group",
    81         "-webkit-box-orient", "-webkit-box-pack", "-webkit-box-reflect", "-webkit-box-shadow", "-webkit-box-sizing",
    82         "-webkit-column-break-after", "-webkit-column-break-before", "-webkit-column-break-inside", "-webkit-column-count",
    83         "-webkit-column-gap", "-webkit-column-rule", "-webkit-column-rule-color", "-webkit-column-rule-style",
    84         "-webkit-column-rule-width", "-webkit-column-width", "-webkit-columns", "-webkit-font-size-delta",
    85         "-webkit-font-smoothing", "-webkit-highlight", "-webkit-line-break", "-webkit-line-clamp",
    86         "-webkit-margin-bottom-collapse", "-webkit-margin-collapse", "-webkit-margin-end", "-webkit-margin-start", "-webkit-margin-top-collapse",
    87         "-webkit-marquee", "-webkit-marquee-direction", "-webkit-marquee-increment", "-webkit-marquee-repetition",
    88         "-webkit-marquee-speed", "-webkit-marquee-style", "-webkit-mask", "-webkit-mask-attachment",
    89         "-webkit-mask-box-image", "-webkit-mask-clip", "-webkit-mask-composite", "-webkit-mask-image",
    90         "-webkit-mask-origin", "-webkit-mask-position", "-webkit-mask-position-x", "-webkit-mask-position-y",
    91         "-webkit-mask-repeat", "-webkit-mask-repeat-x", "-webkit-mask-repeat-y", "-webkit-mask-size",
    92         "-webkit-match-nearest-mail-blockquote-color", "-webkit-nbsp-mode", "-webkit-padding-end", "-webkit-padding-start",
    93         "-webkit-perspective", "-webkit-perspective-origin", "-webkit-perspective-origin-x", "-webkit-perspective-origin-y",
    94         "-webkit-rtl-ordering", "-webkit-text-decorations-in-effect", "-webkit-text-fill-color", "-webkit-text-security",
    95         "-webkit-text-size-adjust", "-webkit-text-stroke", "-webkit-text-stroke-color", "-webkit-text-stroke-width",
    96         "-webkit-transform", "-webkit-transform-origin", "-webkit-transform-origin-x", "-webkit-transform-origin-y",
    97         "-webkit-transform-origin-z", "-webkit-transform-style", "-webkit-transition", "-webkit-transition-delay",
    98         "-webkit-transition-duration", "-webkit-transition-property", "-webkit-transition-timing-function",
    99         "-webkit-user-drag", "-webkit-user-modify", "-webkit-user-select", "-webkit-variable-declaration-block"
    100     ].keySet();
    101    
     48    this._propertyKeywords = WebInspector.CSSCompletions.keySet();
     49
    10250    this._valueKeywords = [
    10351        "above", "absolute", "activeborder", "activecaption", "afar", "after-white-space", "ahead", "alias", "all", "all-scroll",

  • trunk/WebCore/inspector/front-end/SourceCSSTokenizer.re2js

    r55248 r65942  
    4545    WebInspector.SourceTokenizer.call(this);
    4646
    47     this._propertyKeywords = [
    48         "background", "background-attachment", "background-clip", "background-color", "background-image",
    49         "background-origin", "background-position", "background-position-x", "background-position-y",
    50         "background-repeat", "background-repeat-x", "background-repeat-y", "background-size", "border",
    51         "border-bottom", "border-bottom-color", "border-bottom-left-radius", "border-bottom-right-radius",
    52         "border-bottom-style", "border-bottom-width", "border-collapse", "border-color", "border-left",
    53         "border-left-color", "border-left-style", "border-left-width", "border-radius", "border-right",
    54         "border-right-color", "border-right-style", "border-right-width", "border-spacing", "border-style",
    55         "border-top", "border-top-color", "border-top-left-radius", "border-top-right-radius", "border-top-style",
    56         "border-top-width", "border-width", "bottom", "caption-side", "clear", "clip", "color", "content",
    57         "counter-increment", "counter-reset", "cursor", "direction", "display", "empty-cells", "float",
    58         "font", "font-family", "font-size", "font-stretch", "font-style", "font-variant", "font-weight",
    59         "height", "left", "letter-spacing", "line-height", "list-style", "list-style-image", "list-style-position",
    60         "list-style-type", "margin", "margin-bottom", "margin-left", "margin-right", "margin-top", "max-height",
    61         "max-width", "min-height", "min-width", "opacity", "orphans", "outline", "outline-color", "outline-offset",
    62         "outline-style", "outline-width", "overflow", "overflow-x", "overflow-y", "padding", "padding-bottom",
    63         "padding-left", "padding-right", "padding-top", "page", "page-break-after", "page-break-before",
    64         "page-break-inside", "pointer-events", "position", "quotes", "resize", "right", "size", "src",
    65         "table-layout", "text-align", "text-decoration", "text-indent", "text-line-through", "text-line-through-color",
    66         "text-line-through-mode", "text-line-through-style", "text-line-through-width", "text-overflow", "text-overline",
    67         "text-overline-color", "text-overline-mode", "text-overline-style", "text-overline-width", "text-rendering",
    68         "text-shadow", "text-transform", "text-underline", "text-underline-color", "text-underline-mode",
    69         "text-underline-style", "text-underline-width", "top", "unicode-bidi", "unicode-range", "vertical-align",
    70         "visibility", "white-space", "widows", "width", "word-break", "word-spacing", "word-wrap", "z-index", "zoom",
    71         "-webkit-animation", "-webkit-animation-delay", "-webkit-animation-direction", "-webkit-animation-duration",
    72         "-webkit-animation-iteration-count", "-webkit-animation-name", "-webkit-animation-play-state",
    73         "-webkit-animation-timing-function", "-webkit-appearance", "-webkit-backface-visibility",
    74         "-webkit-background-clip", "-webkit-background-composite", "-webkit-background-origin", "-webkit-background-size",
    75         "-webkit-binding", "-webkit-border-fit", "-webkit-border-horizontal-spacing", "-webkit-border-image",
    76         "-webkit-border-radius", "-webkit-border-vertical-spacing", "-webkit-box-align", "-webkit-box-direction",
    77         "-webkit-box-flex", "-webkit-box-flex-group", "-webkit-box-lines", "-webkit-box-ordinal-group",
    78         "-webkit-box-orient", "-webkit-box-pack", "-webkit-box-reflect", "-webkit-box-shadow", "-webkit-box-sizing",
    79         "-webkit-column-break-after", "-webkit-column-break-before", "-webkit-column-break-inside", "-webkit-column-count",
    80         "-webkit-column-gap", "-webkit-column-rule", "-webkit-column-rule-color", "-webkit-column-rule-style",
    81         "-webkit-column-rule-width", "-webkit-column-width", "-webkit-columns", "-webkit-font-size-delta",
    82         "-webkit-font-smoothing", "-webkit-highlight", "-webkit-line-break", "-webkit-line-clamp",
    83         "-webkit-margin-bottom-collapse", "-webkit-margin-collapse", "-webkit-margin-start", "-webkit-margin-top-collapse",
    84         "-webkit-marquee", "-webkit-marquee-direction", "-webkit-marquee-increment", "-webkit-marquee-repetition",
    85         "-webkit-marquee-speed", "-webkit-marquee-style", "-webkit-mask", "-webkit-mask-attachment",
    86         "-webkit-mask-box-image", "-webkit-mask-clip", "-webkit-mask-composite", "-webkit-mask-image",
    87         "-webkit-mask-origin", "-webkit-mask-position", "-webkit-mask-position-x", "-webkit-mask-position-y",
    88         "-webkit-mask-repeat", "-webkit-mask-repeat-x", "-webkit-mask-repeat-y", "-webkit-mask-size",
    89         "-webkit-match-nearest-mail-blockquote-color", "-webkit-nbsp-mode", "-webkit-padding-start",
    90         "-webkit-perspective", "-webkit-perspective-origin", "-webkit-perspective-origin-x", "-webkit-perspective-origin-y",
    91         "-webkit-rtl-ordering", "-webkit-text-decorations-in-effect", "-webkit-text-fill-color", "-webkit-text-security",
    92         "-webkit-text-size-adjust", "-webkit-text-stroke", "-webkit-text-stroke-color", "-webkit-text-stroke-width",
    93         "-webkit-transform", "-webkit-transform-origin", "-webkit-transform-origin-x", "-webkit-transform-origin-y",
    94         "-webkit-transform-origin-z", "-webkit-transform-style", "-webkit-transition", "-webkit-transition-delay",
    95         "-webkit-transition-duration", "-webkit-transition-property", "-webkit-transition-timing-function",
    96         "-webkit-user-drag", "-webkit-user-modify", "-webkit-user-select", "-webkit-variable-declaration-block"
    97     ].keySet();
    98    
     47    this._propertyKeywords = WebInspector.CSSCompletions.keySet();
     48
    9949    this._valueKeywords = [
    10050        "above", "absolute", "activeborder", "activecaption", "afar", "after-white-space", "ahead", "alias", "all", "all-scroll",

  • trunk/WebCore/inspector/front-end/inspector.js

    r65939 r65942  
    581581
    582582    InspectorFrontendHost.loaded();
     583
     584    // As a DOMAgent method, this needs to happen after the frontend has loaded and the agent is available.
     585    InspectorBackend.getSupportedCSSProperties(WebInspector.Callback.wrap(WebInspector.CSSCompletions._load));
    583586}
    584587
Note: See TracChangeset for help on using the changeset viewer.