refactor(core): introduce NgModule.schemas
This allows Angular to error on unknown properties, allowing applications that don’t use custom elements to get better error reporting. Part of #10043 BREAKING CHANGE: - By default, Angular will error during parsing on unknown properties, even if they are on elements with a `-` in their name (aka custom elements). If you application is using custom elements, fill the new parameter `@NgModule.schemas` with the value `[CUSTOM_ELEMENTS_SCHEMA]`. E.g. for bootstrap: ``` bootstrap(MyComponent, {schemas: [CUSTOM_ELEMENTS_SCHEMA]}); ```
This commit is contained in:
Tobias Bosch
@ -6,7 +6,7 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {ChangeDetectionStrategy, ViewEncapsulation} from '@angular/core';
|
||||
import {ChangeDetectionStrategy, SchemaMetadata, ViewEncapsulation} from '@angular/core';
|
||||
|
||||
import {CHANGE_DETECTION_STRATEGY_VALUES, LIFECYCLE_HOOKS_VALUES, LifecycleHooks, VIEW_ENCAPSULATION_VALUES, reflector} from '../core_private';
|
||||
import {ListWrapper, StringMapWrapper} from '../src/facade/collection';
|
||||
@ -18,6 +18,7 @@ import {getUrlScheme} from './url_resolver';
|
||||
import {sanitizeIdentifier, splitAtColon} from './util';
|
||||
|
||||
|
||||
|
||||
// group 0: "[prop] or (event) or @trigger"
|
||||
// group 1: "prop" from "[prop]"
|
||||
// group 2: "event" from "(event)"
|
||||
@ -625,12 +626,13 @@ export class CompileNgModuleMetadata implements CompileMetadataWithIdentifier {
|
||||
|
||||
importedModules: CompileNgModuleMetadata[];
|
||||
exportedModules: CompileNgModuleMetadata[];
|
||||
schemas: SchemaMetadata[];
|
||||
|
||||
transitiveModule: TransitiveCompileNgModuleMetadata;
|
||||
|
||||
constructor(
|
||||
{type, providers, declaredDirectives, exportedDirectives, declaredPipes, exportedPipes,
|
||||
entryComponents, importedModules, exportedModules, transitiveModule}: {
|
||||
entryComponents, importedModules, exportedModules, schemas, transitiveModule}: {
|
||||
type?: CompileTypeMetadata,
|
||||
providers?:
|
||||
Array<CompileProviderMetadata|CompileTypeMetadata|CompileIdentifierMetadata|any[]>,
|
||||
@ -641,7 +643,8 @@ export class CompileNgModuleMetadata implements CompileMetadataWithIdentifier {
|
||||
entryComponents?: CompileTypeMetadata[],
|
||||
importedModules?: CompileNgModuleMetadata[],
|
||||
exportedModules?: CompileNgModuleMetadata[],
|
||||
transitiveModule?: TransitiveCompileNgModuleMetadata
|
||||
transitiveModule?: TransitiveCompileNgModuleMetadata,
|
||||
schemas?: SchemaMetadata[]
|
||||
} = {}) {
|
||||
this.type = type;
|
||||
this.declaredDirectives = _normalizeArray(declaredDirectives);
|
||||
@ -652,6 +655,7 @@ export class CompileNgModuleMetadata implements CompileMetadataWithIdentifier {
|
||||
this.entryComponents = _normalizeArray(entryComponents);
|
||||
this.importedModules = _normalizeArray(importedModules);
|
||||
this.exportedModules = _normalizeArray(exportedModules);
|
||||
this.schemas = _normalizeArray(schemas);
|
||||
this.transitiveModule = transitiveModule;
|
||||
}
|
||||
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {AnimationAnimateMetadata, AnimationEntryMetadata, AnimationGroupMetadata, AnimationKeyframesSequenceMetadata, AnimationMetadata, AnimationStateDeclarationMetadata, AnimationStateMetadata, AnimationStateTransitionMetadata, AnimationStyleMetadata, AnimationWithStepsMetadata, AttributeMetadata, ChangeDetectionStrategy, ComponentMetadata, HostMetadata, Inject, InjectMetadata, Injectable, ModuleWithProviders, NgModule, NgModuleMetadata, Optional, OptionalMetadata, Provider, QueryMetadata, SelfMetadata, SkipSelfMetadata, ViewMetadata, ViewQueryMetadata, resolveForwardRef} from '@angular/core';
|
||||
import {AnimationAnimateMetadata, AnimationEntryMetadata, AnimationGroupMetadata, AnimationKeyframesSequenceMetadata, AnimationMetadata, AnimationStateDeclarationMetadata, AnimationStateMetadata, AnimationStateTransitionMetadata, AnimationStyleMetadata, AnimationWithStepsMetadata, AttributeMetadata, ChangeDetectionStrategy, ComponentMetadata, HostMetadata, Inject, InjectMetadata, Injectable, ModuleWithProviders, NgModule, NgModuleMetadata, Optional, OptionalMetadata, Provider, QueryMetadata, SchemaMetadata, SelfMetadata, SkipSelfMetadata, ViewMetadata, ViewQueryMetadata, resolveForwardRef} from '@angular/core';
|
||||
|
||||
import {Console, LIFECYCLE_HOOKS_VALUES, ReflectorReader, createProvider, isProviderLiteral, reflector} from '../core_private';
|
||||
import {MapWrapper, StringMapWrapper} from '../src/facade/collection';
|
||||
@ -208,6 +208,19 @@ export class CompileMetadataResolver {
|
||||
const exportedModules: cpl.CompileNgModuleMetadata[] = [];
|
||||
const providers: any[] = [];
|
||||
const entryComponents: cpl.CompileTypeMetadata[] = [];
|
||||
const schemas: SchemaMetadata[] = [];
|
||||
|
||||
if (meta.providers) {
|
||||
providers.push(...this.getProvidersMetadata(meta.providers, entryComponents));
|
||||
}
|
||||
if (meta.entryComponents) {
|
||||
entryComponents.push(
|
||||
...flattenArray(meta.entryComponents)
|
||||
.map(type => this.getTypeMetadata(type, staticTypeModuleUrl(type))));
|
||||
}
|
||||
if (meta.schemas) {
|
||||
schemas.push(...flattenArray(meta.schemas));
|
||||
}
|
||||
|
||||
if (meta.imports) {
|
||||
flattenArray(meta.imports).forEach((importedType) => {
|
||||
@ -282,15 +295,6 @@ export class CompileMetadataResolver {
|
||||
});
|
||||
}
|
||||
|
||||
if (meta.providers) {
|
||||
providers.push(...this.getProvidersMetadata(meta.providers, entryComponents));
|
||||
}
|
||||
if (meta.entryComponents) {
|
||||
entryComponents.push(
|
||||
...flattenArray(meta.entryComponents)
|
||||
.map(type => this.getTypeMetadata(type, staticTypeModuleUrl(type))));
|
||||
}
|
||||
|
||||
transitiveModule.entryComponents.push(...entryComponents);
|
||||
transitiveModule.providers.push(...providers);
|
||||
|
||||
@ -298,6 +302,7 @@ export class CompileMetadataResolver {
|
||||
type: this.getTypeMetadata(moduleType, staticTypeModuleUrl(moduleType)),
|
||||
providers: providers,
|
||||
entryComponents: entryComponents,
|
||||
schemas: schemas,
|
||||
declaredDirectives: declaredDirectives,
|
||||
exportedDirectives: exportedDirectives,
|
||||
declaredPipes: declaredPipes,
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {SchemaMetadata} from '@angular/core';
|
||||
import {CompileDirectiveMetadata, CompileIdentifierMetadata, CompileNgModuleMetadata, CompilePipeMetadata, StaticSymbol, createHostComponentMeta} from './compile_metadata';
|
||||
import {DirectiveNormalizer} from './directive_normalizer';
|
||||
import {ListWrapper} from './facade/collection';
|
||||
@ -91,7 +92,7 @@ export class OfflineCompiler {
|
||||
// compile components
|
||||
exportedVars.push(this._compileComponentFactory(compMeta, fileSuffix, statements));
|
||||
exportedVars.push(this._compileComponent(
|
||||
compMeta, dirMetas, ngModule.transitiveModule.pipes,
|
||||
compMeta, dirMetas, ngModule.transitiveModule.pipes, ngModule.schemas,
|
||||
stylesCompileResults.componentStylesheet, fileSuffix, statements));
|
||||
});
|
||||
}))
|
||||
@ -120,7 +121,7 @@ export class OfflineCompiler {
|
||||
targetStatements: o.Statement[]): string {
|
||||
var hostMeta = createHostComponentMeta(compMeta);
|
||||
var hostViewFactoryVar =
|
||||
this._compileComponent(hostMeta, [compMeta], [], null, fileSuffix, targetStatements);
|
||||
this._compileComponent(hostMeta, [compMeta], [], [], null, fileSuffix, targetStatements);
|
||||
var compFactoryVar = _componentFactoryName(compMeta.type);
|
||||
targetStatements.push(
|
||||
o.variable(compFactoryVar)
|
||||
@ -139,10 +140,10 @@ export class OfflineCompiler {
|
||||
|
||||
private _compileComponent(
|
||||
compMeta: CompileDirectiveMetadata, directives: CompileDirectiveMetadata[],
|
||||
pipes: CompilePipeMetadata[], componentStyles: CompiledStylesheet, fileSuffix: string,
|
||||
targetStatements: o.Statement[]): string {
|
||||
pipes: CompilePipeMetadata[], schemas: SchemaMetadata[], componentStyles: CompiledStylesheet,
|
||||
fileSuffix: string, targetStatements: o.Statement[]): string {
|
||||
var parsedTemplate = this._templateParser.parse(
|
||||
compMeta, compMeta.template.template, directives, pipes, compMeta.type.name);
|
||||
compMeta, compMeta.template.template, directives, pipes, schemas, compMeta.type.name);
|
||||
var stylesExpr = componentStyles ? o.variable(componentStyles.stylesVar) : o.literalArr([]);
|
||||
var viewResult =
|
||||
this._viewCompiler.compileComponent(compMeta, parsedTemplate, stylesExpr, pipes);
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Compiler, ComponentFactory, ComponentResolver, ComponentStillLoadingError, Injectable, Injector, NgModule, NgModuleFactory, NgModuleMetadata, OptionalMetadata, Provider, SkipSelfMetadata} from '@angular/core';
|
||||
import {Compiler, ComponentFactory, ComponentResolver, ComponentStillLoadingError, Injectable, Injector, NgModule, NgModuleFactory, NgModuleMetadata, OptionalMetadata, Provider, SchemaMetadata, SkipSelfMetadata} from '@angular/core';
|
||||
|
||||
import {Console} from '../core_private';
|
||||
import {BaseException} from '../src/facade/exceptions';
|
||||
@ -143,9 +143,7 @@ export class RuntimeCompiler implements Compiler {
|
||||
ngModule.transitiveModule.modules.forEach((localModuleMeta) => {
|
||||
localModuleMeta.declaredDirectives.forEach((dirMeta) => {
|
||||
if (dirMeta.isComponent) {
|
||||
templates.add(this._createCompiledTemplate(
|
||||
dirMeta, localModuleMeta.transitiveModule.directives,
|
||||
localModuleMeta.transitiveModule.pipes));
|
||||
templates.add(this._createCompiledTemplate(dirMeta, localModuleMeta));
|
||||
dirMeta.entryComponents.forEach((entryComponentType) => {
|
||||
templates.add(this._createCompiledHostTemplate(entryComponentType.runtime));
|
||||
});
|
||||
@ -200,7 +198,7 @@ export class RuntimeCompiler implements Compiler {
|
||||
assertComponent(compMeta);
|
||||
var hostMeta = createHostComponentMeta(compMeta);
|
||||
compiledTemplate = new CompiledTemplate(
|
||||
true, compMeta.selector, compMeta.type, [compMeta], [],
|
||||
true, compMeta.selector, compMeta.type, [compMeta], [], [],
|
||||
this._templateNormalizer.normalizeDirective(hostMeta));
|
||||
this._compiledHostTemplateCache.set(compType, compiledTemplate);
|
||||
}
|
||||
@ -208,13 +206,13 @@ export class RuntimeCompiler implements Compiler {
|
||||
}
|
||||
|
||||
private _createCompiledTemplate(
|
||||
compMeta: CompileDirectiveMetadata, directives: CompileDirectiveMetadata[],
|
||||
pipes: CompilePipeMetadata[]): CompiledTemplate {
|
||||
compMeta: CompileDirectiveMetadata, ngModule: CompileNgModuleMetadata): CompiledTemplate {
|
||||
var compiledTemplate = this._compiledTemplateCache.get(compMeta.type.runtime);
|
||||
if (isBlank(compiledTemplate)) {
|
||||
assertComponent(compMeta);
|
||||
compiledTemplate = new CompiledTemplate(
|
||||
false, compMeta.selector, compMeta.type, directives, pipes,
|
||||
false, compMeta.selector, compMeta.type, ngModule.transitiveModule.directives,
|
||||
ngModule.transitiveModule.pipes, ngModule.schemas,
|
||||
this._templateNormalizer.normalizeDirective(compMeta));
|
||||
this._compiledTemplateCache.set(compMeta.type.runtime, compiledTemplate);
|
||||
}
|
||||
@ -255,7 +253,7 @@ export class RuntimeCompiler implements Compiler {
|
||||
(compType) => this._assertComponentLoaded(compType, false).normalizedCompMeta);
|
||||
const parsedTemplate = this._templateParser.parse(
|
||||
compMeta, compMeta.template.template, template.viewDirectives.concat(viewCompMetas),
|
||||
template.viewPipes, compMeta.type.name);
|
||||
template.viewPipes, template.schemas, compMeta.type.name);
|
||||
const compileResult = this._viewCompiler.compileComponent(
|
||||
compMeta, parsedTemplate, ir.variable(stylesCompileResult.componentStylesheet.stylesVar),
|
||||
template.viewPipes);
|
||||
@ -322,7 +320,7 @@ class CompiledTemplate {
|
||||
constructor(
|
||||
public isHost: boolean, selector: string, public compType: CompileIdentifierMetadata,
|
||||
viewDirectivesAndComponents: CompileDirectiveMetadata[],
|
||||
public viewPipes: CompilePipeMetadata[],
|
||||
public viewPipes: CompilePipeMetadata[], public schemas: SchemaMetadata[],
|
||||
_normalizeResult: SyncAsyncResult<CompileDirectiveMetadata>) {
|
||||
viewDirectivesAndComponents.forEach((dirMeta) => {
|
||||
if (dirMeta.isComponent) {
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Injectable, SecurityContext} from '@angular/core';
|
||||
import {CUSTOM_ELEMENTS_SCHEMA, Injectable, SchemaMetadata, SecurityContext} from '@angular/core';
|
||||
|
||||
import {StringMapWrapper} from '../facade/collection';
|
||||
import {isPresent} from '../facade/lang';
|
||||
@ -270,7 +270,9 @@ export class DomElementSchemaRegistry extends ElementSchemaRegistry {
|
||||
});
|
||||
}
|
||||
|
||||
hasProperty(tagName: string, propName: string): boolean {
|
||||
hasProperty(tagName: string, propName: string, schemaMetas: SchemaMetadata[]): boolean {
|
||||
const hasCustomElementSchema =
|
||||
schemaMetas.some((schema) => schema.name === CUSTOM_ELEMENTS_SCHEMA.name);
|
||||
if (tagName.indexOf('-') !== -1) {
|
||||
if (tagName === 'ng-container' || tagName === 'ng-content') {
|
||||
return false;
|
||||
@ -278,7 +280,7 @@ export class DomElementSchemaRegistry extends ElementSchemaRegistry {
|
||||
|
||||
// Can't tell now as we don't know which properties a custom element will get
|
||||
// once it is instantiated
|
||||
return true;
|
||||
return hasCustomElementSchema;
|
||||
} else {
|
||||
var elementProperties = this.schema[tagName.toLowerCase()];
|
||||
if (!isPresent(elementProperties)) {
|
||||
|
||||
@ -6,8 +6,10 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {SchemaMetadata} from '@angular/core';
|
||||
|
||||
export abstract class ElementSchemaRegistry {
|
||||
abstract hasProperty(tagName: string, propName: string): boolean;
|
||||
abstract hasProperty(tagName: string, propName: string, schemaMetas: SchemaMetadata[]): boolean;
|
||||
abstract securityContext(tagName: string, propName: string): any;
|
||||
abstract getMappedPropName(propName: string): string;
|
||||
}
|
||||
|
||||
@ -6,8 +6,10 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {Inject, Injectable, OpaqueToken, Optional, SecurityContext} from '@angular/core';
|
||||
import {Inject, Injectable, OpaqueToken, Optional, SchemaMetadata, SecurityContext} from '@angular/core';
|
||||
|
||||
import {Console, MAX_INTERPOLATION_VALUES} from '../core_private';
|
||||
|
||||
import {ListWrapper, StringMapWrapper, SetWrapper,} from '../src/facade/collection';
|
||||
import {RegExpWrapper, isPresent, StringWrapper, isBlank} from '../src/facade/lang';
|
||||
import {BaseException} from '../src/facade/exceptions';
|
||||
@ -83,8 +85,8 @@ export class TemplateParser {
|
||||
|
||||
parse(
|
||||
component: CompileDirectiveMetadata, template: string, directives: CompileDirectiveMetadata[],
|
||||
pipes: CompilePipeMetadata[], templateUrl: string): TemplateAst[] {
|
||||
const result = this.tryParse(component, template, directives, pipes, templateUrl);
|
||||
pipes: CompilePipeMetadata[], schemas: SchemaMetadata[], templateUrl: string): TemplateAst[] {
|
||||
const result = this.tryParse(component, template, directives, pipes, schemas, templateUrl);
|
||||
const warnings = result.errors.filter(error => error.level === ParseErrorLevel.WARNING);
|
||||
const errors = result.errors.filter(error => error.level === ParseErrorLevel.FATAL);
|
||||
if (warnings.length > 0) {
|
||||
@ -100,7 +102,8 @@ export class TemplateParser {
|
||||
|
||||
tryParse(
|
||||
component: CompileDirectiveMetadata, template: string, directives: CompileDirectiveMetadata[],
|
||||
pipes: CompilePipeMetadata[], templateUrl: string): TemplateParseResult {
|
||||
pipes: CompilePipeMetadata[], schemas: SchemaMetadata[],
|
||||
templateUrl: string): TemplateParseResult {
|
||||
let interpolationConfig: any;
|
||||
if (component.template) {
|
||||
interpolationConfig = InterpolationConfig.fromArray(component.template.interpolation);
|
||||
@ -123,7 +126,8 @@ export class TemplateParser {
|
||||
const providerViewContext =
|
||||
new ProviderViewContext(component, htmlAstWithErrors.rootNodes[0].sourceSpan);
|
||||
const parseVisitor = new TemplateParseVisitor(
|
||||
providerViewContext, uniqDirectives, uniqPipes, this._exprParser, this._schemaRegistry);
|
||||
providerViewContext, uniqDirectives, uniqPipes, schemas, this._exprParser,
|
||||
this._schemaRegistry);
|
||||
|
||||
result = htmlVisitAll(parseVisitor, htmlAstWithErrors.rootNodes, EMPTY_ELEMENT_CONTEXT);
|
||||
errors.push(...parseVisitor.errors, ...providerViewContext.errors);
|
||||
@ -175,7 +179,7 @@ class TemplateParseVisitor implements HtmlAstVisitor {
|
||||
|
||||
constructor(
|
||||
public providerViewContext: ProviderViewContext, directives: CompileDirectiveMetadata[],
|
||||
pipes: CompilePipeMetadata[], private _exprParser: Parser,
|
||||
pipes: CompilePipeMetadata[], private _schemas: SchemaMetadata[], private _exprParser: Parser,
|
||||
private _schemaRegistry: ElementSchemaRegistry) {
|
||||
this.selectorMatcher = new SelectorMatcher();
|
||||
|
||||
@ -801,10 +805,14 @@ class TemplateParseVisitor implements HtmlAstVisitor {
|
||||
boundPropertyName = this._schemaRegistry.getMappedPropName(partValue);
|
||||
securityContext = this._schemaRegistry.securityContext(elementName, boundPropertyName);
|
||||
bindingType = PropertyBindingType.Property;
|
||||
if (!this._schemaRegistry.hasProperty(elementName, boundPropertyName)) {
|
||||
this._reportError(
|
||||
`Can't bind to '${boundPropertyName}' since it isn't a known native property`,
|
||||
sourceSpan);
|
||||
if (!this._schemaRegistry.hasProperty(elementName, boundPropertyName, this._schemas)) {
|
||||
let errorMsg =
|
||||
`Can't bind to '${boundPropertyName}' since it isn't a known native property`;
|
||||
if (elementName.indexOf('-') !== -1) {
|
||||
errorMsg +=
|
||||
`. To ignore this error on custom elements, add the "CUSTOM_ELEMENTS_SCHEMA" to the NgModule of this component`;
|
||||
}
|
||||
this._reportError(errorMsg, sourceSpan);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
import {HtmlElementAst} from '@angular/compiler/src/html_ast';
|
||||
import {HtmlParser} from '@angular/compiler/src/html_parser';
|
||||
import {DomElementSchemaRegistry} from '@angular/compiler/src/schema/dom_element_schema_registry';
|
||||
import {SecurityContext} from '@angular/core';
|
||||
import {CUSTOM_ELEMENTS_SCHEMA, SecurityContext} from '@angular/core';
|
||||
import {beforeEach, ddescribe, describe, expect, iit, inject, it, xdescribe, xit} from '@angular/core/testing/testing_internal';
|
||||
import {browserDetection} from '@angular/platform-browser/testing/browser_util';
|
||||
|
||||
@ -21,34 +21,38 @@ export function main() {
|
||||
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();
|
||||
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 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
|
||||
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();
|
||||
expect(registry.hasProperty('video', 'click', [])).toBeFalsy();
|
||||
});
|
||||
|
||||
it('should return true for custom-like elements',
|
||||
() => { expect(registry.hasProperty('custom-like', 'unknown')).toBeTruthy(); });
|
||||
it('should return false for custom-like elements by default',
|
||||
() => { expect(registry.hasProperty('custom-like', 'unknown', [])).toBe(false); });
|
||||
|
||||
it('should return true for custom-like elements if the CUSTOM_ELEMENTS_SCHEMA was used', () => {
|
||||
expect(registry.hasProperty('custom-like', 'unknown', [CUSTOM_ELEMENTS_SCHEMA])).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should re-map property names that are specified in DOM facade',
|
||||
() => { expect(registry.getMappedPropName('readonly')).toEqual('readOnly'); });
|
||||
@ -70,7 +74,7 @@ export function main() {
|
||||
it('should detect properties on namespaced elements', () => {
|
||||
const htmlAst = new HtmlParser().parse('<svg:style>', 'TestComp');
|
||||
const nodeName = (<HtmlElementAst>htmlAst.rootNodes[0]).name;
|
||||
expect(registry.hasProperty(nodeName, 'type')).toBeTruthy();
|
||||
expect(registry.hasProperty(nodeName, 'type', [])).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should check security contexts case insensitive', () => {
|
||||
@ -81,11 +85,11 @@ export function main() {
|
||||
|
||||
describe('Angular custom elements', () => {
|
||||
it('should support <ng-container>',
|
||||
() => { expect(registry.hasProperty('ng-container', 'id')).toBeFalsy(); });
|
||||
() => { expect(registry.hasProperty('ng-container', 'id', [])).toBeFalsy(); });
|
||||
|
||||
it('should support <ng-content>', () => {
|
||||
expect(registry.hasProperty('ng-content', 'id')).toBeFalsy();
|
||||
expect(registry.hasProperty('ng-content', 'select')).toBeFalsy();
|
||||
expect(registry.hasProperty('ng-content', 'id', [])).toBeFalsy();
|
||||
expect(registry.hasProperty('ng-content', 'select', [])).toBeFalsy();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@ -12,7 +12,7 @@ import {ElementSchemaRegistry} from '@angular/compiler/src/schema/element_schema
|
||||
import {AttrAst, BoundDirectivePropertyAst, BoundElementPropertyAst, BoundEventAst, BoundTextAst, DirectiveAst, ElementAst, EmbeddedTemplateAst, NgContentAst, PropertyBindingType, ProviderAstType, ReferenceAst, TemplateAst, TemplateAstVisitor, TextAst, VariableAst, templateVisitAll} from '@angular/compiler/src/template_ast';
|
||||
import {TEMPLATE_TRANSFORMS, TemplateParser, splitClasses} from '@angular/compiler/src/template_parser';
|
||||
import {MockSchemaRegistry} from '@angular/compiler/testing';
|
||||
import {SecurityContext} from '@angular/core';
|
||||
import {SchemaMetadata, SecurityContext} from '@angular/core';
|
||||
import {Console} from '@angular/core/src/console';
|
||||
import {configureCompiler} from '@angular/core/testing';
|
||||
import {afterEach, beforeEach, beforeEachProviders, ddescribe, describe, expect, iit, inject, it, xit} from '@angular/core/testing/testing_internal';
|
||||
@ -56,11 +56,11 @@ export function main() {
|
||||
|
||||
parse =
|
||||
(template: string, directives: CompileDirectiveMetadata[],
|
||||
pipes: CompilePipeMetadata[] = null): TemplateAst[] => {
|
||||
pipes: CompilePipeMetadata[] = null, schemas: SchemaMetadata[] = []): TemplateAst[] => {
|
||||
if (pipes === null) {
|
||||
pipes = [];
|
||||
}
|
||||
return parser.parse(component, template, directives, pipes, 'TestComp');
|
||||
return parser.parse(component, template, directives, pipes, schemas, 'TestComp');
|
||||
};
|
||||
}));
|
||||
}
|
||||
@ -181,7 +181,7 @@ export function main() {
|
||||
isComponent: true,
|
||||
template: new CompileTemplateMetadata({interpolation: ['{%', '%}']})
|
||||
});
|
||||
expect(humanizeTplAst(parser.parse(component, '{%a%}', [], [], 'TestComp'), {
|
||||
expect(humanizeTplAst(parser.parse(component, '{%a%}', [], [], [], 'TestComp'), {
|
||||
start: '{%',
|
||||
end: '%}'
|
||||
})).toEqual([[BoundTextAst, '{% a %}']]);
|
||||
|
||||
@ -6,7 +6,8 @@
|
||||
* found in the LICENSE file at https://angular.io/license
|
||||
*/
|
||||
|
||||
import {SecurityContext} from '@angular/core';
|
||||
import {SchemaMetadata, SecurityContext} from '@angular/core';
|
||||
|
||||
import {ElementSchemaRegistry} from '../index';
|
||||
import {isPresent} from '../src/facade/lang';
|
||||
|
||||
@ -15,7 +16,7 @@ export class MockSchemaRegistry implements ElementSchemaRegistry {
|
||||
public existingProperties: {[key: string]: boolean},
|
||||
public attrPropMapping: {[key: string]: string}) {}
|
||||
|
||||
hasProperty(tagName: string, property: string): boolean {
|
||||
hasProperty(tagName: string, property: string, schemas: SchemaMetadata[]): boolean {
|
||||
var result = this.existingProperties[property];
|
||||
return isPresent(result) ? result : true;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user