webkit在win32下的编译规则（七）

首先看$(JS_DOM_HEADERS)，这些文件都是以JS开头的，对其做处理的是如下规则：

JS%.h : %.idl $(JS_BINDINGS_SCRIPTS)
    $(call generator_script, $(JS_BINDINGS_SCRIPTS)) $(IDL_COMMON_ARGS) --defines "$(FEATURE_DEFINES) $(ADDITIONAL_IDL_DEFINES) LANGUAGE_JAVASCRIPT" --generator JS $<

这条规则要处理大约450个文件，所以在编译WebCoreGenerated这个工程时大部分都是类似的输出，这条规则的command展开后的形式如下：

perl -I /cygdrive/d/tools/cygwin/home/xufan/WebKit/WebCore/bindings/scripts/ /cygdrive/d/tools/cygwin/home/xufan/WebKit/WebCore/bindings/scripts/generate-bindings.pl --include dom --include html --include css --include page --include notifications --include xml --include svg --write-dependencies --outputDir . --defines " ENABLE_3D_CANVAS ENABLE_3D_RENDERING ENABLE_CHANNEL_MESSAGING ENABLE_DATABASE ENABLE_DATAGRID ENABLE_DATALIST ENABLE_DIRECTORY_UPLOAD ENABLE_DOM_STORAGE ENABLE_EVENTSOURCE ENABLE_FILTERS ENABLE_ICONDATABASE ENABLE_JAVASCRIPT_DEBUGGER ENABLE_NOTIFICATIONS ENABLE_OFFLINE_WEB_APPLICATIONS ENABLE_SHARED_WORKERS ENABLE_SVG ENABLE_SVG_ANIMATION ENABLE_SVG_AS_IMAGE ENABLE_SVG_FONTS ENABLE_SVG_FOREIGN_OBJECT ENABLE_SVG_USE ENABLE_WEB_SOCKETS ENABLE_WORKERS ENABLE_XPATH ENABLE_XSLT  LANGUAGE_JAVASCRIPT" --generator JS /cygdrive/d/tools/cygwin/home/xufan/WebKit/Source/WebCore/page/DOMWindow.idl

command主要是调用d：/tools/cygwin/home/xufan/WebKit/WebCore/bindings/scripts/generate-bindings.pl这个perl脚本对IDL文件做处理，即根据IDL文件生成h和cpp文件，例如DOMWindow.idl就生成了D:/tools/cygwin/home/xufan/WebKit/WebKitBuild/Debug_Cairo_CFLite/obj/WebCore/DerivedSources/JSDOMWindow.cpp和D:/tools/cygwin/home/xufan/WebKit/WebKitBuild/Debug_Cairo_CFLite/obj/WebCore/DerivedSources/JSDOMWindow.h这两个文件。DOMWindow.idl里面定义了window对象的方法，属性和事件等，对此感兴趣的可以看看DOMWindow.idl，JSDOMWindow.cpp和JSDOMWindow.h这3个文件，看这几个文件比看html参考手册有用。generate-bindings.pl的实现细节后面会专门进行介绍，个人感觉用antlr等工具处理应该更方便点。

在这里需要特别说明的是DOMWindow.idl等IDL文件并不是微软COM技术里面的IDL文件格式，而是IDL文件的一个变种WebIDL（http://www.w3.org/TR/WebIDL/）。IDL有很多形式，可以参考http://en.wikipedia.org/wiki/Interface_description_language里面的描述，例如XPIDL，Microsoft Interface Definition Language等，这里面还将Google的Protocol Buffers也归为了一种IDL。在关于web idl的中文介绍中，比较多的都说到了“周杰伦”（http://www.pbdigg.net/show.php?tid=5227），堪称出现在W3C规范里的第一人。

webkit对web idl做了一些改动，相关改动可以参考https://trac.webkit.org/wiki/IdlAttributes。

$(WEB_DOM_HEADERS)，这些文件都是以WebDOM开头的，对其做处理的是如下规则：

WebDOM%.h : %.idl $(CPP_BINDINGS_SCRIPTS)
    $(call generator_script, $(CPP_BINDINGS_SCRIPTS)) $(IDL_COMMON_ARGS) --defines "$(FEATURE_DEFINES) $(ADDITIONAL_IDL_DEFINES) LANGUAGE_CPP" --generator CPP $<

这些的处理基本与JS_DOM_HEADERS一样，只是一些选项不一样。

JSJavaScriptCallFrame.h和JSSVGElementWrapperFactory.cpp的处理和JS_DOM_HEADERS一样，因为其是以JS开头的。

CSSGrammar.cpp由如下规则生成：

CSSGrammar.cpp : css/CSSGrammar.y
    bison -d -p cssyy $< -o $@
    touch CSSGrammar.cpp.h
    touch CSSGrammar.hpp
    echo '#ifndef CSSGrammar_h' > CSSGrammar.h
    echo '#define CSSGrammar_h' >> CSSGrammar.h
    cat CSSGrammar.cpp.h CSSGrammar.hpp >> CSSGrammar.h
    echo '#endif' >> CSSGrammar.h
    rm -f CSSGrammar.cpp.h CSSGrammar.hpp

从上面可以看出，CSSGrammar.cpp通过使用bison工具处理D:/tools/cygwin/home/xufan/WebKit/Source/WebCore/css/CSSGrammar.y这个文件而生成。Bison是一个与yacc类似的工具，主页在http://www.gnu.org/software/bison/，中文文档可以参考http://blog.csdn.net/sirouni2003/archive/2005/06/22/400672.aspx。大家可以通过看CSSGrammar.y这个文件来了解webkit的css语法规则。

CSSPropertyNames.h 由如下规则生成：

CSSPropertyNames.h : $(WEBCORE_CSS_PROPERTY_NAMES) css/makeprop.pl
    if sort $(WEBCORE_CSS_PROPERTY_NAMES) | uniq -d | grep -E -v '(^#)|(^[[:space:]]*$$)'; then echo 'Duplicate value!'; exit 1; fi
    cat $(WEBCORE_CSS_PROPERTY_NAMES) > CSSPropertyNames.in
    perl "$(WebCore)/css/makeprop.pl"

展开这条规则的command后可以看出，CSSPropertyNames.h是由CSSPropertyNames.in，SVGCSSPropertyNames.in，DashboardSupportCSSPropertyNames.in等文件通过makeprop.pl这个perl脚本生成。CSSPropertyNames.in等文件定义了css属性里面的关键字，例如的内容如下：

CSSPropertyNames.in#
# CSS property names
#
# Some properties are used internally, but are not part of CSS. They are used to get
# HTML4 compatibility in the rendering engine.
#
# Microsoft extensions are documented here:
# http://msdn.microsoft.com/workshop/author/css/reference/attributes.asp
#

# high-priority property names have to be listed first, to simplify the check
# for applying them first.
color
direction
display
font
font-family
font-size
font-style
font-variant
font-weight
text-rendering
-webkit-font-smoothing
-webkit-text-size-adjust
-webkit-writing-mode
zoom

# line height needs to be right after the above high-priority properties
line-height

# The remaining properties are listed in alphabetical order
background
background-attachment
background-clip
background-color
background-image
background-origin
background-position
background-position-x
background-position-y
background-repeat
background-repeat-x
background-repeat-y
background-size
border
border-bottom
border-bottom-color
border-bottom-left-radius
border-bottom-right-radius
border-bottom-style
border-bottom-width
border-collapse
border-color
border-left
border-left-color
border-left-style
border-left-width
border-radius
border-right
border-right-color
border-right-style
border-right-width
border-spacing
border-style
border-top
border-top-color
border-top-left-radius
border-top-right-radius
border-top-style
border-top-width
border-width
bottom
box-shadow
box-sizing
caption-side
clear
clip
content
counter-increment
counter-reset
cursor
empty-cells
float
font-stretch
height
left
letter-spacing
list-style
list-style-image
list-style-position
list-style-type
margin
margin-bottom
margin-left
margin-right
margin-top
max-height
max-width
min-height
min-width
opacity
orphans
outline
outline-color
outline-offset
outline-style
outline-width
overflow
overflow-x
overflow-y
padding
padding-bottom
padding-left
padding-right
padding-top
page
page-break-after
page-break-before
page-break-inside
pointer-events
position
quotes
resize
right
size
src
speak
table-layout
text-align
text-decoration
text-indent
text-line-through
text-line-through-color
text-line-through-mode
text-line-through-style
text-line-through-width
text-overflow
text-overline
text-overline-color
text-overline-mode
text-overline-style
text-overline-width
text-shadow
text-transform
text-underline
text-underline-color
text-underline-mode
text-underline-style
text-underline-width
top
unicode-bidi
unicode-range
vertical-align
visibility
white-space
widows
width
word-break
word-spacing
word-wrap
z-index
-webkit-animation
-webkit-animation-delay
-webkit-animation-direction
-webkit-animation-duration
-webkit-animation-fill-mode
-webkit-animation-iteration-count
-webkit-animation-name
-webkit-animation-play-state
-webkit-animation-timing-function
-webkit-appearance
-webkit-backface-visibility
-webkit-background-clip
-webkit-background-composite
-webkit-background-origin
# -webkit-background-size differs from background-size only in the interpretation of
# a single value: -webkit-background-size: l; is equivalent to background-size: l l;
# whereas background-size: l; is equivalent to background-size: l auto;
-webkit-background-size
-webkit-border-after
-webkit-border-after-color
-webkit-border-after-style
-webkit-border-after-width
-webkit-border-before
-webkit-border-before-color
-webkit-border-before-style
-webkit-border-before-width
-webkit-border-end
-webkit-border-end-color
-webkit-border-end-style
-webkit-border-end-width
-webkit-border-fit
-webkit-border-horizontal-spacing
-webkit-border-image
# -webkit-border-radius differs from border-radius only in the interpretation of
# a value consisting of two lengths: "-webkit-border-radius: l1 l2;" is equivalent
# to "border-radius: l1 / l2;"
-webkit-border-radius
-webkit-border-start
-webkit-border-start-color
-webkit-border-start-style
-webkit-border-start-width
-webkit-border-vertical-spacing
-webkit-box-align
-webkit-box-direction
-webkit-box-flex
-webkit-box-flex-group
-webkit-box-lines
-webkit-box-ordinal-group
-webkit-box-orient
-webkit-box-pack
-webkit-box-reflect
-webkit-box-shadow
-webkit-color-correction
-webkit-column-break-after
-webkit-column-break-before
-webkit-column-break-inside
-webkit-column-count
-webkit-column-gap
-webkit-column-rule
-webkit-column-rule-color
-webkit-column-rule-style
-webkit-column-rule-width
-webkit-column-span
-webkit-column-width
-webkit-columns
-webkit-font-size-delta
-webkit-highlight
-webkit-hyphenate-character
-webkit-hyphenate-locale
-webkit-hyphens
-webkit-line-break
-webkit-line-clamp
-webkit-logical-width
-webkit-logical-height
-webkit-margin-after-collapse
-webkit-margin-before-collapse
-webkit-margin-bottom-collapse
-webkit-margin-top-collapse
-webkit-margin-collapse
-webkit-margin-after
-webkit-margin-before
-webkit-margin-end
-webkit-margin-start
-webkit-marquee
-webkit-marquee-direction
-webkit-marquee-increment
-webkit-marquee-repetition
-webkit-marquee-speed
-webkit-marquee-style
-webkit-mask
-webkit-mask-attachment
-webkit-mask-box-image
-webkit-mask-clip
-webkit-mask-composite
-webkit-mask-image
-webkit-mask-origin
-webkit-mask-position
-webkit-mask-position-x
-webkit-mask-position-y
-webkit-mask-repeat
-webkit-mask-repeat-x
-webkit-mask-repeat-y
-webkit-mask-size
-webkit-match-nearest-mail-blockquote-color
-webkit-max-logical-width
-webkit-max-logical-height
-webkit-min-logical-width
-webkit-min-logical-height
-webkit-nbsp-mode
-webkit-padding-after
-webkit-padding-before
-webkit-padding-end
-webkit-padding-start
-webkit-perspective
-webkit-perspective-origin
-webkit-perspective-origin-x
-webkit-perspective-origin-y
-webkit-rtl-ordering
-webkit-text-combine
-webkit-text-decorations-in-effect
-webkit-text-emphasis
-webkit-text-emphasis-color
-webkit-text-emphasis-position
-webkit-text-emphasis-style
-webkit-text-fill-color
-webkit-text-security
-webkit-text-stroke
-webkit-text-stroke-color
-webkit-text-stroke-width
-webkit-transform
-webkit-transform-origin
-webkit-transform-origin-x
-webkit-transform-origin-y
-webkit-transform-origin-z
-webkit-transform-style
-webkit-transition
-webkit-transition-delay
-webkit-transition-duration
-webkit-transition-property
-webkit-transition-timing-function
-webkit-user-drag
-webkit-user-modify
-webkit-user-select

CSSValueKeywords.h的处理规则和CSSPropertyNames.h的处理规则类似，如下：

CSSValueKeywords.h : $(WEBCORE_CSS_VALUE_KEYWORDS) css/makevalues.pl
    # Lower case all the values, as CSS values are case-insensitive
    perl -ne 'print lc' $(WEBCORE_CSS_VALUE_KEYWORDS) > CSSValueKeywords.in
    if sort CSSValueKeywords.in | uniq -d | grep -E -v '(^#)|(^[[:space:]]*$$)'; then echo 'Duplicate value!'; exit 1; fi
    perl "$(WebCore)/css/makevalues.pl"

CSSValueKeywords.h主要定义了css的值中可以使用的关键字，例如style=”align:middle”里面的middle。

ColorData.cpp由如下规则生成：

ColorData.cpp : platform/ColorData.gperf $(WebCore)/make-hash-tools.pl
    perl $(WebCore)/make-hash-tools.pl . $(WebCore)/platform/ColorData.gperf

从上面可以看到，ColorData.cpp是将D:/tools/cygwin/home/xufan/WebKit/Source/WebCore/platform/ColorData.gperf这个文件用make-hash-tools.pl生成的。ColorData.gperf主要定义了一些css里面支持的带名字的颜色，例如red，white，black等。

DocTypeStrings.cpp与ColorData.cpp一样，都是通过make-hash-tools.pl生成，如下：

DocTypeStrings.cpp : html/DocTypeStrings.gperf $(WebCore)/make-hash-tools.pl
    perl $(WebCore)/make-hash-tools.pl . $(WebCore)/html/DocTypeStrings.gperf

DocTypeStrings.gperf（D:/tools/cygwin/home/xufan/WebKit/Source/WebCore/html/DocTypeStrings.gperf）定义了webkit支持的DocType，例如//w3c//dtd html 4.01 transitional//en，以及如何用什么模式来解析，例如PubIDInfo::eQuirks3，PubIDInfo::eAlmostStandards，PubIDInfo::eQuirks等。doctype的验证可以参考http://htmlhelp.com/tools/validator/doctype.html和http://www.w3.org/QA/2002/04/valid-dtd-list.html。IE的doctype处理可以参考http://blog.csdn.net/WinGeek/archive/2011/02/22/6198996.aspx，超级复杂，看的人头晕。PubIDInfo 的定义在D:/tools/cygwin/home/xufan/WebKit/Source/WebCore/platform/HashTools.h，可以看出webkit现在只有3种模式，如下：

struct PubIDInfo {
    enum eMode {
        eQuirks,
        eQuirks3,
        eAlmostStandards
    };

    const char* name;
    eMode mode_if_no_sysid;
    eMode mode_if_sysid;
};