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

fix(core): log error instead of warning for unknown properties and elements (#35798)

Browse Source 
Changes the Ivy unknown element/property messages from being logged with `console.warn` to `console.error`. This should make them a bit more visible without breaking existing apps. Furthermore, a lot of folks filter out warning messages in the dev tools' console, whereas errors are usually still shown.

Fixes #35699.

PR Close #35798
This commit is contained in:
crisbeto
2020-03-03 17:42:44 +01:00
committed by atscott
parent ed44073a58
commit 00f3c58bb9
7 changed files with 47 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -36,7 +36,7 @@ function elementStartFirstCreatePass(
const hasDirectives =
resolveDirectives(tView, lView, tNode, getConstant<string[]>(tViewConsts, localRefsIndex));
ngDevMode && warnAboutUnknownElement(tView, lView, native, tNode, hasDirectives);
ngDevMode && logUnknownElementError(tView, lView, native, tNode, hasDirectives);
if (tNode.mergedAttrs !== null) {
computeStaticStyling(tNode, tNode.mergedAttrs);
@ -171,7 +171,7 @@ export function ɵɵelement(
ɵɵelementEnd();
}
function warnAboutUnknownElement(
function logUnknownElementError(
tView: TView, lView: LView, element: RElement, tNode: TNode, hasDirectives: boolean): void {
const schemas = tView.schemas;
@ -197,17 +197,17 @@ function warnAboutUnknownElement(
!customElements.get(tagName));
if (isUnknown && !matchingSchemas(tView, lView, tagName)) {
let warning = `'${tagName}' is not a known element:\n`;
warning +=
let message = `'${tagName}' is not a known element:\n`;
message +=
`1. If '${tagName}' is an Angular component, then verify that it is part of this module.\n`;
if (tagName && tagName.indexOf('-') > -1) {
warning +=
message +=
`2. If '${tagName}' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.`;
} else {
warning +=
message +=
`2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.`;
}
console.warn(warning);
console.error(message);
}
}
}

10
packages/core/src/render3/instructions/shared.ts
View File

@ -962,7 +962,7 @@ export function elementPropertyInternal<T>(
validateAgainstEventProperties(propName);
if (!validateProperty(tView, lView, element, propName, tNode)) {
// Return here since we only log warnings for unknown properties.
warnAboutUnknownProperty(propName, tNode);
logUnknownPropertyError(propName, tNode);
return;
}
ngDevMode.rendererSetProperty++;
@ -982,7 +982,7 @@ export function elementPropertyInternal<T>(
// If the node is a container and the property didn't
// match any of the inputs or schemas we should throw.
if (ngDevMode && !matchingSchemas(tView, lView, tNode.tagName)) {
warnAboutUnknownProperty(propName, tNode);
logUnknownPropertyError(propName, tNode);
}
}
}
@ -1070,12 +1070,12 @@ export function matchingSchemas(tView: TView, lView: LView, tagName: string | nu
}
/**
* Logs a warning that a property is not supported on an element.
* Logs an error that a property is not supported on an element.
* @param propName Name of the invalid property.
* @param tNode Node on which we encountered the property.
*/
function warnAboutUnknownProperty(propName: string, tNode: TNode): void {
console.warn(
function logUnknownPropertyError(propName: string, tNode: TNode): void {
console.error(
`Can't bind to '${propName}' since it isn't a known property of '${tNode.tagName}'.`);
}