From d327ac4b434cff8eb5e510c99f8c503940339e4d Mon Sep 17 00:00:00 2001 From: Misko Hevery Date: Thu, 21 Apr 2016 15:11:14 -0700 Subject: [PATCH] feat(compiler): ElementSchema now has explicit DOM schema information This makes the schema available for offline compile compiler as well. Closes #8179 --- .../schema/dom_element_schema_registry.ts | 260 ++++++++++++++++-- .../dom_element_schema_registry_spec.ts | 48 +++- .../compiler/schema/schema_extractor.dart | 5 + .../test/compiler/schema/schema_extractor.ts | 140 ++++++++++ .../template_compiler/all_tests.dart | 4 +- 5 files changed, 423 insertions(+), 34 deletions(-) create mode 100644 modules/angular2/test/compiler/schema/schema_extractor.dart create mode 100644 modules/angular2/test/compiler/schema/schema_extractor.ts diff --git a/modules/angular2/src/compiler/schema/dom_element_schema_registry.ts b/modules/angular2/src/compiler/schema/dom_element_schema_registry.ts index 84a9230fe3..a3ecf6bc60 100644 --- a/modules/angular2/src/compiler/schema/dom_element_schema_registry.ts +++ b/modules/angular2/src/compiler/schema/dom_element_schema_registry.ts @@ -1,28 +1,243 @@ import {Injectable} from 'angular2/src/core/di'; -import {isPresent, isBlank, CONST_EXPR} from 'angular2/src/facade/lang'; +import {isPresent, CONST_EXPR} from 'angular2/src/facade/lang'; import {StringMapWrapper} from 'angular2/src/facade/collection'; -import {DOM} from 'angular2/src/platform/dom/dom_adapter'; -import {splitNsName} from 'angular2/src/compiler/html_tags'; - import {ElementSchemaRegistry} from './element_schema_registry'; -const NAMESPACE_URIS = - CONST_EXPR({'xlink': 'http://www.w3.org/1999/xlink', 'svg': 'http://www.w3.org/2000/svg'}); +const EVENT = 'event'; +const BOOLEAN = 'boolean'; +const NUMBER = 'number'; +const STRING = 'string'; +const OBJECT = 'object'; + +/** + * This array represents the DOM schema. It encodes inheritance, properties, and events. + * + * ## Overview + * + * Each line represents one kind of element. The `element_inheritance` and properties are joined + * using `element_inheritance|preperties` syntax. + * + * ## Element Inheritance + * + * The `element_inheritance` can be further subdivided as `element1,element2,...^parentElement`. + * Here the individual elements are separated by `,` (commas). Every element in the list + * has identical properties. + * + * An `element` may inherit additional properties from `parentElement` If no `^parentElement` is + * specified then `""` (blank) element is assumed. + * + * NOTE: The blank element inherits from root `*` element, the super element of all elements. + * + * NOTE an element prefix such as `@svg:` has no special meaning to the schema. + * + * ## Properties + * + * Each element has a set of properties separated by `,` (commas). Each property can be prefixed + * by a special character designating its type: + * + * - (no prefix): property is a string. + * - `*`: property represents an event. + * - `!`: property is a boolean. + * - `#`: property is a number. + * - `%`: property is an object. + * + * ## Query + * + * The class creates an internal squas representaino which allows to easily answer the query of + * if a given property exist on a given element. + * + * NOTE: We don't yet support querying for types or events. + * NOTE: This schema is auto extracted from `schema_extractor.ts` located in the test folder. + */ +const SCHEMA: string[] = + CONST_EXPR([ + '*|%classList,className,id,innerHTML,*beforecopy,*beforecut,*beforepaste,*copy,*cut,*paste,*search,*selectstart,*webkitfullscreenchange,*webkitfullscreenerror,*wheel,outerHTML,#scrollLeft,#scrollTop', + '^*|accessKey,contentEditable,dir,!draggable,!hidden,innerText,lang,*abort,*autocomplete,*autocompleteerror,*beforecopy,*beforecut,*beforepaste,*blur,*cancel,*canplay,*canplaythrough,*change,*click,*close,*contextmenu,*copy,*cuechange,*cut,*dblclick,*drag,*dragend,*dragenter,*dragleave,*dragover,*dragstart,*drop,*durationchange,*emptied,*ended,*error,*focus,*input,*invalid,*keydown,*keypress,*keyup,*load,*loadeddata,*loadedmetadata,*loadstart,*message,*mousedown,*mouseenter,*mouseleave,*mousemove,*mouseout,*mouseover,*mouseup,*mousewheel,*mozfullscreenchange,*mozfullscreenerror,*mozpointerlockchange,*mozpointerlockerror,*paste,*pause,*play,*playing,*progress,*ratechange,*reset,*resize,*scroll,*search,*seeked,*seeking,*select,*selectstart,*show,*stalled,*submit,*suspend,*timeupdate,*toggle,*volumechange,*waiting,*webglcontextcreationerror,*webglcontextlost,*webglcontextrestored,*webkitfullscreenchange,*webkitfullscreenerror,*wheel,outerText,!spellcheck,%style,#tabIndex,title,!translate', + 'media|!autoplay,!controls,%crossOrigin,#currentTime,!defaultMuted,#defaultPlaybackRate,!disableRemotePlayback,!loop,!muted,*encrypted,#playbackRate,preload,src,#volume', + '@svg:^*|*abort,*autocomplete,*autocompleteerror,*blur,*cancel,*canplay,*canplaythrough,*change,*click,*close,*contextmenu,*cuechange,*dblclick,*drag,*dragend,*dragenter,*dragleave,*dragover,*dragstart,*drop,*durationchange,*emptied,*ended,*error,*focus,*input,*invalid,*keydown,*keypress,*keyup,*load,*loadeddata,*loadedmetadata,*loadstart,*mousedown,*mouseenter,*mouseleave,*mousemove,*mouseout,*mouseover,*mouseup,*mousewheel,*pause,*play,*playing,*progress,*ratechange,*reset,*resize,*scroll,*seeked,*seeking,*select,*show,*stalled,*submit,*suspend,*timeupdate,*toggle,*volumechange,*waiting,%style,#tabIndex', + '@svg:graphics^@svg:|', + '@svg:animation^@svg:|*begin,*end,*repeat', + '@svg:geometry^@svg:|', + '@svg:componentTransferFunction^@svg:|', + '@svg:gradient^@svg:|', + '@svg:textContent^@svg:graphics|', + '@svg:textPositioning^@svg:textContent|', + 'a|charset,coords,download,hash,host,hostname,href,hreflang,name,password,pathname,ping,port,protocol,rel,rev,search,shape,target,text,type,username', + 'area|alt,coords,hash,host,hostname,href,!noHref,password,pathname,ping,port,protocol,search,shape,target,username', + 'audio^media|', + 'br|clear', + 'base|href,target', + 'body|aLink,background,bgColor,link,*beforeunload,*blur,*error,*focus,*hashchange,*languagechange,*load,*message,*offline,*online,*pagehide,*pageshow,*popstate,*rejectionhandled,*resize,*scroll,*storage,*unhandledrejection,*unload,text,vLink', + 'button|!autofocus,!disabled,formAction,formEnctype,formMethod,!formNoValidate,formTarget,name,type,value', + 'canvas|#height,#width', + 'content|select', + 'dl|!compact', + 'datalist|', + 'details|!open', + 'dialog|!open,returnValue', + 'dir|!compact', + 'div|align', + 'embed|align,height,name,src,type,width', + 'fieldset|!disabled,name', + 'font|color,face,size', + 'form|acceptCharset,action,autocomplete,encoding,enctype,method,name,!noValidate,target', + 'frame|frameBorder,longDesc,marginHeight,marginWidth,name,!noResize,scrolling,src', + 'frameset|cols,*beforeunload,*blur,*error,*focus,*hashchange,*languagechange,*load,*message,*offline,*online,*pagehide,*pageshow,*popstate,*rejectionhandled,*resize,*scroll,*storage,*unhandledrejection,*unload,rows', + 'hr|align,color,!noShade,size,width', + 'head|', + 'h1,h2,h3,h4,h5,h6|align', + 'html|version', + 'iframe|align,!allowFullscreen,frameBorder,height,longDesc,marginHeight,marginWidth,name,%sandbox,scrolling,src,srcdoc,width', + 'img|align,alt,border,%crossOrigin,#height,#hspace,!isMap,longDesc,lowsrc,name,sizes,src,srcset,useMap,#vspace,#width', + 'input|accept,align,alt,autocapitalize,autocomplete,!autofocus,!checked,!defaultChecked,defaultValue,dirName,!disabled,%files,formAction,formEnctype,formMethod,!formNoValidate,formTarget,#height,!incremental,!indeterminate,max,#maxLength,min,#minLength,!multiple,name,pattern,placeholder,!readOnly,!required,selectionDirection,#selectionEnd,#selectionStart,#size,src,step,type,useMap,value,%valueAsDate,#valueAsNumber,#width', + 'keygen|!autofocus,challenge,!disabled,keytype,name', + 'li|type,#value', + 'label|htmlFor', + 'legend|align', + 'link|as,charset,%crossOrigin,!disabled,href,hreflang,integrity,media,rel,%relList,rev,%sizes,target,type', + 'map|name', + 'marquee|behavior,bgColor,direction,height,#hspace,#loop,#scrollAmount,#scrollDelay,!trueSpeed,#vspace,width', + 'menu|!compact', + 'meta|content,httpEquiv,name,scheme', + 'meter|#high,#low,#max,#min,#optimum,#value', + 'ins,del|cite,dateTime', + 'ol|!compact,!reversed,#start,type', + 'object|align,archive,border,code,codeBase,codeType,data,!declare,height,#hspace,name,standby,type,useMap,#vspace,width', + 'optgroup|!disabled,label', + 'option|!defaultSelected,!disabled,label,!selected,text,value', + 'output|defaultValue,%htmlFor,name,value', + 'p|align', + 'param|name,type,value,valueType', + 'picture|', + 'pre|#width', + 'progress|#max,#value', + 'q,blockquote,cite|', + 'script|!async,charset,%crossOrigin,!defer,event,htmlFor,integrity,src,text,type', + 'select|!autofocus,!disabled,#length,!multiple,name,!required,#selectedIndex,#size,value', + 'shadow|', + 'source|media,sizes,src,srcset,type', + 'span|', + 'style|!disabled,media,type', + 'caption|align', + 'th,td|abbr,align,axis,bgColor,ch,chOff,#colSpan,headers,height,!noWrap,#rowSpan,scope,vAlign,width', + 'col,colgroup|align,ch,chOff,#span,vAlign,width', + 'table|align,bgColor,border,%caption,cellPadding,cellSpacing,frame,rules,summary,%tFoot,%tHead,width', + 'tr|align,bgColor,ch,chOff,vAlign', + 'tfoot,thead,tbody|align,ch,chOff,vAlign', + 'template|', + 'textarea|autocapitalize,!autofocus,#cols,defaultValue,dirName,!disabled,#maxLength,#minLength,name,placeholder,!readOnly,!required,#rows,selectionDirection,#selectionEnd,#selectionStart,value,wrap', + 'title|text', + 'track|!default,kind,label,src,srclang', + 'ul|!compact,type', + 'unknown|', + 'video^media|#height,poster,#width', + '@svg:a^@svg:graphics|', + '@svg:animate^@svg:animation|', + '@svg:animateMotion^@svg:animation|', + '@svg:animateTransform^@svg:animation|', + '@svg:circle^@svg:geometry|', + '@svg:clipPath^@svg:graphics|', + '@svg:cursor^@svg:|', + '@svg:defs^@svg:graphics|', + '@svg:desc^@svg:|', + '@svg:discard^@svg:|', + '@svg:ellipse^@svg:geometry|', + '@svg:feBlend^@svg:|', + '@svg:feColorMatrix^@svg:|', + '@svg:feComponentTransfer^@svg:|', + '@svg:feComposite^@svg:|', + '@svg:feConvolveMatrix^@svg:|', + '@svg:feDiffuseLighting^@svg:|', + '@svg:feDisplacementMap^@svg:|', + '@svg:feDistantLight^@svg:|', + '@svg:feDropShadow^@svg:|', + '@svg:feFlood^@svg:|', + '@svg:feFuncA^@svg:componentTransferFunction|', + '@svg:feFuncB^@svg:componentTransferFunction|', + '@svg:feFuncG^@svg:componentTransferFunction|', + '@svg:feFuncR^@svg:componentTransferFunction|', + '@svg:feGaussianBlur^@svg:|', + '@svg:feImage^@svg:|', + '@svg:feMerge^@svg:|', + '@svg:feMergeNode^@svg:|', + '@svg:feMorphology^@svg:|', + '@svg:feOffset^@svg:|', + '@svg:fePointLight^@svg:|', + '@svg:feSpecularLighting^@svg:|', + '@svg:feSpotLight^@svg:|', + '@svg:feTile^@svg:|', + '@svg:feTurbulence^@svg:|', + '@svg:filter^@svg:|', + '@svg:foreignObject^@svg:graphics|', + '@svg:g^@svg:graphics|', + '@svg:image^@svg:graphics|', + '@svg:line^@svg:geometry|', + '@svg:linearGradient^@svg:gradient|', + '@svg:mpath^@svg:|', + '@svg:marker^@svg:|', + '@svg:mask^@svg:|', + '@svg:metadata^@svg:|', + '@svg:path^@svg:geometry|', + '@svg:pattern^@svg:|', + '@svg:polygon^@svg:geometry|', + '@svg:polyline^@svg:geometry|', + '@svg:radialGradient^@svg:gradient|', + '@svg:rect^@svg:geometry|', + '@svg:svg^@svg:graphics|#currentScale,#zoomAndPan', + '@svg:script^@svg:|type', + '@svg:set^@svg:animation|', + '@svg:stop^@svg:|', + '@svg:style^@svg:|!disabled,media,title,type', + '@svg:switch^@svg:graphics|', + '@svg:symbol^@svg:|', + '@svg:tspan^@svg:textPositioning|', + '@svg:text^@svg:textPositioning|', + '@svg:textPath^@svg:textContent|', + '@svg:title^@svg:|', + '@svg:use^@svg:graphics|', + '@svg:view^@svg:|#zoomAndPan' + ]); + +var attrToPropMap: {[name: string]: string} = { + 'class': 'className', + 'innerHtml': 'innerHTML', + 'readonly': 'readOnly', + 'tabindex': 'tabIndex' +}; + @Injectable() -export class DomElementSchemaRegistry extends ElementSchemaRegistry { - private _protoElements = new Map(); +export class DomElementSchemaRegistry implements ElementSchemaRegistry { + schema = <{[element: string]: {[property: string]: string}}>{}; - private _getProtoElement(tagName: string): Element { - var element = this._protoElements.get(tagName); - if (isBlank(element)) { - var nsAndName = splitNsName(tagName); - element = isPresent(nsAndName[0]) ? - DOM.createElementNS(NAMESPACE_URIS[nsAndName[0]], nsAndName[1]) : - DOM.createElement(nsAndName[1]); - this._protoElements.set(tagName, element); - } - return element; + constructor() { + SCHEMA.forEach(encodedType => { + var parts = encodedType.split('|'); + var properties = parts[1].split(','); + var typeParts = (parts[0] + '^').split('^'); + var typeName = typeParts[0]; + var type = <{[property: string]: string}>{}; + typeName.split(',').forEach(tag => this.schema[tag] = type); + var superType = this.schema[typeParts[1]]; + if (isPresent(superType)) { + StringMapWrapper.forEach(superType, (v, k) => type[k] = v); + } + properties.forEach((property: string) => { + if (property == '') { + } else if (property.startsWith('*')) { + // We don't yet support events. + // type[property.substring(1)] = EVENT; + } else if (property.startsWith('!')) { + type[property.substring(1)] = BOOLEAN; + } else if (property.startsWith('#')) { + type[property.substring(1)] = NUMBER; + } else if (property.startsWith('%')) { + type[property.substring(1)] = OBJECT; + } else { + type[property] = STRING; + } + }); + }); } hasProperty(tagName: string, propName: string): boolean { @@ -31,13 +246,16 @@ export class DomElementSchemaRegistry extends ElementSchemaRegistry { // once it is instantiated return true; } else { - var elm = this._getProtoElement(tagName); - return DOM.hasProperty(elm, propName); + var elementProperties = this.schema[tagName.toLowerCase()]; + if (!isPresent(elementProperties)) { + elementProperties = this.schema['unknown']; + } + return isPresent(elementProperties[propName]); } } getMappedPropName(propName: string): string { - var mappedPropName = StringMapWrapper.get(DOM.attrToPropMap, propName); + var mappedPropName = StringMapWrapper.get(attrToPropMap, propName); return isPresent(mappedPropName) ? mappedPropName : propName; } } diff --git a/modules/angular2/test/compiler/schema/dom_element_schema_registry_spec.ts b/modules/angular2/test/compiler/schema/dom_element_schema_registry_spec.ts index 57c32b8a76..8534641e77 100644 --- a/modules/angular2/test/compiler/schema/dom_element_schema_registry_spec.ts +++ b/modules/angular2/test/compiler/schema/dom_element_schema_registry_spec.ts @@ -9,29 +9,45 @@ import { it, xit } from 'angular2/testing_internal'; -import {IS_DART} from 'angular2/src/facade/lang'; import {DomElementSchemaRegistry} from 'angular2/src/compiler/schema/dom_element_schema_registry'; +import {extractSchema} from './schema_extractor'; export function main() { - // DOMElementSchema can only be used on the JS side where we can safely - // use reflection for DOM elements - if (IS_DART) return; - - var registry: DomElementSchemaRegistry; - - beforeEach(() => { registry = new DomElementSchemaRegistry(); }); - describe('DOMElementSchema', () => { + var registry: DomElementSchemaRegistry; + beforeEach(() => { registry = new DomElementSchemaRegistry(); }); it('should detect properties on regular elements', () => { expect(registry.hasProperty('div', 'id')).toBeTruthy(); expect(registry.hasProperty('div', 'title')).toBeTruthy(); + expect(registry.hasProperty('h1', 'align')).toBeTruthy(); + expect(registry.hasProperty('h2', 'align')).toBeTruthy(); + expect(registry.hasProperty('h3', 'align')).toBeTruthy(); + expect(registry.hasProperty('h4', 'align')).toBeTruthy(); + expect(registry.hasProperty('h5', 'align')).toBeTruthy(); + expect(registry.hasProperty('h6', 'align')).toBeTruthy(); + expect(registry.hasProperty('h7', 'align')).toBeFalsy(); + expect(registry.hasProperty('textarea', 'disabled')).toBeTruthy(); + expect(registry.hasProperty('input', 'disabled')).toBeTruthy(); expect(registry.hasProperty('div', 'unknown')).toBeFalsy(); }); - it('should return true for custom-like elements', - () => { expect(registry.hasProperty('custom-like', 'unknown')).toBeTruthy(); }); + it('should detect different kinds of types', + () => { + // inheritance: video => media => * + expect(registry.hasProperty('video', 'className')).toBeTruthy(); // from * + expect(registry.hasProperty('video', 'id')).toBeTruthy(); // string + expect(registry.hasProperty('video', 'scrollLeft')).toBeTruthy(); // number + expect(registry.hasProperty('video', 'height')).toBeTruthy(); // number + expect(registry.hasProperty('video', 'autoplay')).toBeTruthy(); // boolean + expect(registry.hasProperty('video', 'classList')).toBeTruthy(); // object + // from *; but events are not properties + expect(registry.hasProperty('video', 'click')).toBeFalsy(); + }) + + it('should return true for custom-like elements', + () => { expect(registry.hasProperty('custom-like', 'unknown')).toBeTruthy(); }); it('should re-map property names that are specified in DOM facade', () => { expect(registry.getMappedPropName('readonly')).toEqual('readOnly'); }); @@ -43,5 +59,15 @@ export function main() { it('should detect properties on namespaced elements', () => { expect(registry.hasProperty('@svg:g', 'id')).toBeTruthy(); }); + + it('generate a new schema', () => { + // console.log(JSON.stringify(registry.properties)); + extractSchema( + (descriptors) => { + // Uncomment this line to see: + // the generated schema which can then be pasted to the DomElementSchemaRegistry + // console.log(descriptors); + }); + }); }); } diff --git a/modules/angular2/test/compiler/schema/schema_extractor.dart b/modules/angular2/test/compiler/schema/schema_extractor.dart new file mode 100644 index 0000000000..07a47a3b89 --- /dev/null +++ b/modules/angular2/test/compiler/schema/schema_extractor.dart @@ -0,0 +1,5 @@ +/** + * We don't know how to extract schema in dart, so do nothing. + */ +extractSchema(fn(List descriptors)) { +} diff --git a/modules/angular2/test/compiler/schema/schema_extractor.ts b/modules/angular2/test/compiler/schema/schema_extractor.ts new file mode 100644 index 0000000000..f60869c519 --- /dev/null +++ b/modules/angular2/test/compiler/schema/schema_extractor.ts @@ -0,0 +1,140 @@ +import {isString, isPresent} from '../../../src/facade/lang'; + +const SVG_PREFIX = '@svg:'; + +var document = typeof global['document'] == 'object' ? global['document'] : null; + +export function extractSchema(fn: (descriptors: string[]) => void): string[] { + var SVGGraphicsElement = global['SVGGraphicsElement']; + var SVGAnimationElement = global['SVGAnimationElement']; + var SVGGeometryElement = global['SVGGeometryElement']; + var SVGComponentTransferFunctionElement = global['SVGComponentTransferFunctionElement']; + var SVGGradientElement = global['SVGGradientElement']; + var SVGTextContentElement = global['SVGTextContentElement']; + var SVGTextPositioningElement = global['SVGTextPositioningElement']; + if (!document || !SVGGraphicsElement) return null; + var descriptors: string[] = []; + var visited: {[name: string]: boolean} = {}; + var element = document.createElement('video'); + var svgAnimation = document.createElementNS('http://www.w3.org/2000/svg', 'set'); + var svgPath = document.createElementNS('http://www.w3.org/2000/svg', 'path'); + var svgFeFuncA = document.createElementNS('http://www.w3.org/2000/svg', 'feFuncA'); + var svgGradient = document.createElementNS('http://www.w3.org/2000/svg', 'linearGradient'); + var svgText = document.createElementNS('http://www.w3.org/2000/svg', 'text'); + + extractProperties(Element, element, visited, descriptors, '*', ''); + extractProperties(HTMLElement, element, visited, descriptors, '', '*'); + extractProperties(HTMLMediaElement, element, visited, descriptors, 'media', ''); + extractProperties(SVGElement, svgText, visited, descriptors, SVG_PREFIX, '*'); + extractProperties(SVGGraphicsElement, svgText, visited, descriptors, SVG_PREFIX + 'graphics', + SVG_PREFIX); + extractProperties(SVGAnimationElement, svgAnimation, visited, descriptors, + SVG_PREFIX + 'animation', SVG_PREFIX); + extractProperties(SVGGeometryElement, svgPath, visited, descriptors, SVG_PREFIX + 'geometry', + SVG_PREFIX); + extractProperties(SVGComponentTransferFunctionElement, svgFeFuncA, visited, descriptors, + SVG_PREFIX + 'componentTransferFunction', SVG_PREFIX); + extractProperties(SVGGradientElement, svgGradient, visited, descriptors, SVG_PREFIX + 'gradient', + SVG_PREFIX); + extractProperties(SVGTextContentElement, svgText, visited, descriptors, + SVG_PREFIX + 'textContent', SVG_PREFIX + 'graphics'); + extractProperties(SVGTextPositioningElement, svgText, visited, descriptors, + SVG_PREFIX + 'textPositioning', SVG_PREFIX + 'textContent'); + var keys = Object.getOwnPropertyNames(window).filter( + k => k.endsWith('Element') && (k.startsWith('HTML') || k.startsWith('SVG'))); + keys.sort(); + keys.forEach(name => extractRecursiveProperties(visited, descriptors, window[name])); + fn(descriptors); +} + +function extractRecursiveProperties(visited: {[name: string]: boolean}, descriptors: string[], + type: Function): string { + var name = extractName(type); + if (visited[name]) return name; // already been here + var superName = ''; + if (name != '*') { + superName = + extractRecursiveProperties(visited, descriptors, type.prototype.__proto__.constructor); + } + + var instance: HTMLElement = null; + name.split(',').forEach(tagName => { + instance = isSVG(type) ? + document.createElementNS('http://www.w3.org/2000/svg', + tagName.replace(SVG_PREFIX, '')) : + document.createElement(tagName); + var htmlType = type; + if (tagName == 'cite') htmlType = HTMLElement; + if (!(instance instanceof htmlType)) { + throw new Error(`Tag <${tagName}> is not an instance of ${htmlType['name']}`); + } + }); + extractProperties(type, instance, visited, descriptors, name, superName); + return name; +} + +function extractProperties(type: Function, instance: any, visited: {[name: string]: boolean}, + descriptors: string[], name: string, superName: string) { + if (!type) return; + visited[name] = true; + var props = []; + var prototype = type.prototype; + var keys = Object.getOwnPropertyNames(prototype); + keys.sort(); + keys.forEach((n) => { + if (n.startsWith('on')) { + props.push('*' + n.substr(2)); + } else { + var typeCh = typeMap[typeof instance[n]]; + var descriptor = Object.getOwnPropertyDescriptor(prototype, n); + var isSetter = descriptor && isPresent(descriptor.set); + if (isString(typeCh) && !n.startsWith('webkit') && isSetter) { + props.push(typeCh + n); + } + } + }); + descriptors.push(name + (superName ? '^' + superName : '') + '|' + props.join(',')); +} + +function extractName(type: Function): string { + var name = type['name']; + if (name == 'Element') return '*'; + if (name == 'HTMLImageElement') return 'img'; + if (name == 'HTMLAnchorElement') return 'a'; + if (name == 'HTMLDListElement') return 'dl'; + if (name == 'HTMLDirectoryElement') return 'dir'; + if (name == 'HTMLHeadingElement') return 'h1,h2,h3,h4,h5,h6'; + if (name == 'HTMLModElement') return 'ins,del'; + if (name == 'HTMLOListElement') return 'ol'; + if (name == 'HTMLParagraphElement') return 'p'; + if (name == 'HTMLQuoteElement') return 'q,blockquote,cite'; + if (name == 'HTMLTableCaptionElement') return 'caption'; + if (name == 'HTMLTableCellElement') return 'th,td'; + if (name == 'HTMLTableColElement') return 'col,colgroup'; + if (name == 'HTMLTableRowElement') return 'tr'; + if (name == 'HTMLTableSectionElement') return 'tfoot,thead,tbody'; + if (name == 'HTMLUListElement') return 'ul'; + if (name == 'SVGGraphicsElement') return SVG_PREFIX + 'graphics'; + if (name == 'SVGMPathElement') return SVG_PREFIX + 'mpath'; + if (name == 'SVGSVGElement') return SVG_PREFIX + 'svg'; + if (name == 'SVGTSpanElement') return SVG_PREFIX + 'tspan'; + var isSVG = name.startsWith('SVG'); + if (name.startsWith('HTML') || isSVG) { + name = name.replace('HTML', '').replace('SVG', '').replace('Element', ''); + if (isSVG && name.startsWith('FE')) { + name = 'fe' + name.substring(2); + } else if (name) { + name = name.charAt(0).toLowerCase() + name.substring(1); + } + return isSVG ? SVG_PREFIX + name : name.toLowerCase(); + } else { + return null; + } +} + +function isSVG(type: Function): boolean { + return type['name'].startsWith('SVG'); +} + +const typeMap = + <{[type: string]: string}>{'string': '', 'number': '#', 'boolean': '!', 'object': '%'}; diff --git a/modules_dart/transform/test/transform/template_compiler/all_tests.dart b/modules_dart/transform/test/transform/template_compiler/all_tests.dart index 4db15d1bc3..9c16786c58 100644 --- a/modules_dart/transform/test/transform/template_compiler/all_tests.dart +++ b/modules_dart/transform/test/transform/template_compiler/all_tests.dart @@ -105,7 +105,7 @@ void allTests() { it('should parse simple expressions in inline templates.', () async { fooComponentMeta.template = new CompileTemplateMetadata( - template: '
{{greeting}}
', + template: '
{{greeting}}
', templateUrl: 'template.html'); updateReader(); @@ -226,7 +226,7 @@ void allTests() { it('should create the same output for multiple calls.', () async { fooComponentMeta.template = new CompileTemplateMetadata( - template: '
{{greeting}}
', + template: '
{{greeting}}
', templateUrl: 'template.html'); updateReader();