cargdev/angular
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ivy): warn instead of throwing for unknown elements (#34524)

Browse Source 
Follow-up from [this discussion](https://github.com/angular/angular/pull/33419#discussion_r339296216). In Ivy we don't use the schema to validate tag names, but instead we use feature detection to figure out whether an element is supported. While this should generally be more accurate, it'll also end up throwing for some more innocent cases. E.g. now Ivy throws an error for `main` elements in IE which is accurate since IE doesn't support the element, but is annoying since there is no functionality attached.

These changes switch to logging a warning instead, similarly to what we're doing for unknown properties.

PR Close #34524
This commit is contained in:
crisbeto
2020-01-07 06:26:47 +01:00
committed by Alex Rickabaugh
parent 7c3172a469
commit d9ae70e883
2 changed files with 205 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
packages/core/src/render3/instructions/element.ts
View File

@ -40,7 +40,7 @@ function elementStartFirstCreatePass(
const hasDirectives =
resolveDirectives(tView, lView, tNode, getConstant<string[]>(tViewConsts, localRefsIndex));
ngDevMode && validateElement(lView, native, tNode, hasDirectives);
ngDevMode && warnAboutUnknownElement(lView, native, tNode, hasDirectives);
if (tView.queries !== null) {
tView.queries.elementStart(tView, tNode);
@ -253,7 +253,7 @@ function setDirectiveStylingInput(
setInputsForProperty(lView, stylingInputs, propName, value);
}
function validateElement(
function warnAboutUnknownElement(
hostView: LView, element: RElement, tNode: TNode, hasDirectives: boolean): void {
const schemas = hostView[TVIEW].schemas;
@ -279,17 +279,17 @@ function validateElement(
!customElements.get(tagName));
if (isUnknown && !matchingSchemas(hostView, tagName)) {
let errorMessage = `'${tagName}' is not a known element:\n`;
errorMessage +=
let warning = `'${tagName}' is not a known element:\n`;
warning +=
`1. If '${tagName}' is an Angular component, then verify that it is part of this module.\n`;
if (tagName && tagName.indexOf('-') > -1) {
errorMessage +=
warning +=
`2. If '${tagName}' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.`;
} else {
errorMessage +=
warning +=
`2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.`;
}
throw new Error(errorMessage);
console.warn(warning);
}
}
}