diff --git a/modules/@angular/compiler-cli/package.json b/modules/@angular/compiler-cli/package.json index 85ed03595d..9cf0d04f69 100644 --- a/modules/@angular/compiler-cli/package.json +++ b/modules/@angular/compiler-cli/package.json @@ -11,7 +11,7 @@ "dependencies": { "@angular/tsc-wrapped": "^0.3.0", "reflect-metadata": "^0.1.2", - "parse5": "1.3.2", + "parse5": "^2.2.1", "minimist": "^1.2.0" }, "peerDependencies": { diff --git a/modules/@angular/platform-server/package.json b/modules/@angular/platform-server/package.json index 4bb63dbada..9746b80167 100644 --- a/modules/@angular/platform-server/package.json +++ b/modules/@angular/platform-server/package.json @@ -14,7 +14,7 @@ "@angular/platform-browser": "0.0.0-PLACEHOLDER" }, "dependencies": { - "parse5": "1.3.2" + "parse5": "^2.2.1" }, "repository": { "type": "git", diff --git a/modules/@angular/platform-server/src/parse5_adapter.ts b/modules/@angular/platform-server/src/parse5_adapter.ts index 35c4969e39..44228eb65a 100644 --- a/modules/@angular/platform-server/src/parse5_adapter.ts +++ b/modules/@angular/platform-server/src/parse5_adapter.ts @@ -6,28 +6,27 @@ * found in the LICENSE file at https://angular.io/license */ -var parse5 = require('parse5/index'); +const parse5 = require('parse5'); import {ListWrapper, StringMapWrapper} from '../src/facade/collection'; import {DomAdapter, setRootDomAdapter} from './private_import_platform-browser'; -import {isPresent, isBlank, global, setValueOnPath, DateWrapper} from '../src/facade/lang'; +import {isPresent, isBlank, global, setValueOnPath} from '../src/facade/lang'; import {SelectorMatcher, CssSelector} from './private_import_compiler'; -var parser: any /** TODO #9100 */ = null; -var serializer: any /** TODO #9100 */ = null; -var treeAdapter: any /** TODO #9100 */ = null; +let treeAdapter: any; -var _attrToPropMap: {[key: string]: string} = { +const _attrToPropMap: {[key: string]: string} = { 'class': 'className', 'innerHtml': 'innerHTML', 'readonly': 'readOnly', 'tabindex': 'tabIndex', }; -var defDoc: any /** TODO #9100 */ = null; -var mapProps = ['attribs', 'x-attribsNamespace', 'x-attribsPrefix']; +let defDoc: any = null; -function _notImplemented(methodName: any /** TODO #9100 */) { +const mapProps = ['attribs', 'x-attribsNamespace', 'x-attribsPrefix']; + +function _notImplemented(methodName: string) { return new Error('This method is not implemented in Parse5DomAdapter: ' + methodName); } @@ -40,18 +39,16 @@ function _notImplemented(methodName: any /** TODO #9100 */) { */ export class Parse5DomAdapter extends DomAdapter { static makeCurrent() { - parser = new parse5.Parser(parse5.TreeAdapters.htmlparser2); - serializer = new parse5.Serializer(parse5.TreeAdapters.htmlparser2); - treeAdapter = parser.treeAdapter; + treeAdapter = parse5.treeAdapters.htmlparser2; setRootDomAdapter(new Parse5DomAdapter()); } - hasProperty(element: any /** TODO #9100 */, name: string): boolean { + hasProperty(element: any, name: string): boolean { return _HTMLElementPropertyList.indexOf(name) > -1; } // TODO(tbosch): don't even call this method when we run the tests on server side // by not using the DomRenderer in tests. Keeping this for now to make tests happy... - setProperty(el: /*element*/ any, name: string, value: any) { + setProperty(el: any, name: string, value: any) { if (name === 'innerHTML') { this.setInnerHTML(el, value); } else if (name === 'className') { @@ -62,173 +59,158 @@ export class Parse5DomAdapter extends DomAdapter { } // TODO(tbosch): don't even call this method when we run the tests on server side // by not using the DomRenderer in tests. Keeping this for now to make tests happy... - getProperty(el: /*element*/ any, name: string): any { return el[name]; } + getProperty(el: any, name: string): any { return el[name]; } - logError(error: any /** TODO #9100 */) { console.error(error); } + logError(error: string) { console.error(error); } - log(error: any /** TODO #9100 */) { console.log(error); } + log(error: string) { console.log(error); } - logGroup(error: any /** TODO #9100 */) { console.error(error); } + logGroup(error: string) { console.error(error); } logGroupEnd() {} get attrToPropMap() { return _attrToPropMap; } - query(selector: any /** TODO #9100 */) { throw _notImplemented('query'); } - querySelector(el: any /** TODO #9100 */, selector: string): any { - return this.querySelectorAll(el, selector)[0]; - } - querySelectorAll(el: any /** TODO #9100 */, selector: string): any[] { - var res: any[] /** TODO #9100 */ = []; - var _recursive = - (result: any /** TODO #9100 */, node: any /** TODO #9100 */, - selector: any /** TODO #9100 */, matcher: any /** TODO #9100 */) => { - var cNodes = node.childNodes; - if (cNodes && cNodes.length > 0) { - for (var i = 0; i < cNodes.length; i++) { - var childNode = cNodes[i]; - if (this.elementMatches(childNode, selector, matcher)) { - result.push(childNode); - } - _recursive(result, childNode, selector, matcher); - } + query(selector: any) { throw _notImplemented('query'); } + querySelector(el: any, selector: string): any { return this.querySelectorAll(el, selector)[0]; } + querySelectorAll(el: any, selector: string): any[] { + const res: any[] = []; + const _recursive = (result: any, node: any, selector: any, matcher: any) => { + let cNodes = node.childNodes; + if (cNodes && cNodes.length > 0) { + for (let i = 0; i < cNodes.length; i++) { + const childNode = cNodes[i]; + if (this.elementMatches(childNode, selector, matcher)) { + result.push(childNode); } - }; - var matcher = new SelectorMatcher(); + _recursive(result, childNode, selector, matcher); + } + } + }; + const matcher = new SelectorMatcher(); matcher.addSelectables(CssSelector.parse(selector)); _recursive(res, el, selector, matcher); return res; } - elementMatches( - node: any /** TODO #9100 */, selector: string, - matcher: any /** TODO #9100 */ = null): boolean { + elementMatches(node: any, selector: string, matcher: any = null): boolean { if (this.isElementNode(node) && selector === '*') { return true; } - var result = false; + let result = false; if (selector && selector.charAt(0) == '#') { result = this.getAttribute(node, 'id') == selector.substring(1); } else if (selector) { - var result = false; - if (matcher == null) { + if (!matcher) { matcher = new SelectorMatcher(); matcher.addSelectables(CssSelector.parse(selector)); } - var cssSelector = new CssSelector(); + const cssSelector = new CssSelector(); cssSelector.setElement(this.tagName(node)); if (node.attribs) { - for (var attrName in node.attribs) { + for (const attrName in node.attribs) { cssSelector.addAttribute(attrName, node.attribs[attrName]); } } - var classList = this.classList(node); - for (var i = 0; i < classList.length; i++) { + const classList = this.classList(node); + for (let i = 0; i < classList.length; i++) { cssSelector.addClassName(classList[i]); } - matcher.match( - cssSelector, - function(selector: any /** TODO #9100 */, cb: any /** TODO #9100 */) { result = true; }); + matcher.match(cssSelector, function(selector: any, cb: any) { result = true; }); } return result; } - on(el: any /** TODO #9100 */, evt: any /** TODO #9100 */, listener: any /** TODO #9100 */) { - var listenersMap: {[k: string]: any} = el._eventListenersMap; + on(el: any, evt: any, listener: any) { + let listenersMap: {[k: string]: any} = el._eventListenersMap; if (!listenersMap) { - var listenersMap: {[k: string]: any} = {}; + listenersMap = {}; el._eventListenersMap = listenersMap; } const listeners = listenersMap[evt] || []; listenersMap[evt] = [...listeners, listener]; } - onAndCancel( - el: any /** TODO #9100 */, evt: any /** TODO #9100 */, - listener: any /** TODO #9100 */): Function { + onAndCancel(el: any, evt: any, listener: any): Function { this.on(el, evt, listener); return () => { ListWrapper.remove((el._eventListenersMap[evt]), listener); }; } - dispatchEvent(el: any /** TODO #9100 */, evt: any /** TODO #9100 */) { - if (isBlank(evt.target)) { + dispatchEvent(el: any, evt: any) { + if (!evt.target) { evt.target = el; } - if (isPresent(el._eventListenersMap)) { - var listeners: any = el._eventListenersMap[evt.type]; - if (isPresent(listeners)) { - for (var i = 0; i < listeners.length; i++) { + if (el._eventListenersMap) { + const listeners: any = el._eventListenersMap[evt.type]; + if (listeners) { + for (let i = 0; i < listeners.length; i++) { listeners[i](evt); } } } - if (isPresent(el.parent)) { + if (el.parent) { this.dispatchEvent(el.parent, evt); } - if (isPresent(el._window)) { + if (el._window) { this.dispatchEvent(el._window, evt); } } - createMouseEvent(eventType: any /** TODO #9100 */): Event { return this.createEvent(eventType); } + createMouseEvent(eventType: any): Event { return this.createEvent(eventType); } createEvent(eventType: string): Event { - var evt = { + let event = { type: eventType, defaultPrevented: false, - preventDefault: () => { (evt).defaultPrevented = true; } + preventDefault: () => { (event).defaultPrevented = true; } }; - return evt; + return event; } - preventDefault(evt: any /** TODO #9100 */) { evt.returnValue = false; } - isPrevented(evt: any /** TODO #9100 */): boolean { - return isPresent(evt.returnValue) && !evt.returnValue; + preventDefault(event: any) { event.returnValue = false; } + isPrevented(event: any): boolean { return isPresent(event.returnValue) && !event.returnValue; } + getInnerHTML(el: any): string { + return parse5.serialize(this.templateAwareRoot(el), {treeAdapter}); } - getInnerHTML(el: any /** TODO #9100 */): string { - return serializer.serialize(this.templateAwareRoot(el)); + getTemplateContent(el: any): Node { return null; } + getOuterHTML(el: any): string { + const fragment = treeAdapter.createDocumentFragment(); + this.appendChild(fragment, el); + return parse5.serialize(fragment, {treeAdapter}); } - getTemplateContent(el: any /** TODO #9100 */): Node { - return null; // no