fix(module:core): fix global config not working in prod mode (#4325)

* fix(module:core): fix global config not working in prod mode * chore: cleanup code close #4319
NG-ZORRO · Oct 23, 2019 · cc9308d · cc9308d
1 parent 29e6e3e
commit cc9308d
Show file tree

Hide file tree

Showing 31 changed files with 176 additions and 134 deletions.
diff --git a/components/affix/nz-affix.component.ts b/components/affix/nz-affix.component.ts
@@ -46,6 +46,7 @@ interface SimpleRect {
   bottom?: number;
 }
 
+const NZ_CONFIG_COMPONENT_NAME = 'affix';
 const NZ_AFFIX_CLS_PREFIX = 'ant-affix';
 const NZ_AFFIX_DEFAULT_SCROLL_TIME = 20;
 const NZ_AFFIX_RESPOND_EVENTS = ['resize', 'scroll', 'touchstart', 'touchmove', 'touchend', 'pageshow', 'load'];
@@ -68,8 +69,16 @@ export class NzAffixComponent implements AfterViewInit, OnChanges, OnDestroy {
   @ViewChild('fixedEl', { static: true }) private fixedEl: ElementRef<HTMLDivElement>;
 
   @Input() nzTarget: string | Element | Window;
-  @Input() @WithConfig<number | null>(0) @InputNumber() nzOffsetTop: null | number;
-  @Input() @WithConfig<number | null>(null) @InputNumber() nzOffsetBottom: null | number;
+
+  @Input()
+  @WithConfig<number | null>(NZ_CONFIG_COMPONENT_NAME, 0)
+  @InputNumber()
+  nzOffsetTop: null | number;
+
+  @Input()
+  @WithConfig<number | null>(NZ_CONFIG_COMPONENT_NAME, null)
+  @InputNumber()
+  nzOffsetBottom: null | number;
 
   @Output() readonly nzChange = new EventEmitter<boolean>();
 
@@ -153,7 +162,13 @@ export class NzAffixComponent implements AfterViewInit, OnChanges, OnDestroy {
   }
 
   private getTargetRect(target: Element | Window): SimpleRect {
-    return !isTargetWindow(target) ? target.getBoundingClientRect() : { top: 0, left: 0, bottom: 0 };
+    return !isTargetWindow(target)
+      ? target.getBoundingClientRect()
+      : {
+          top: 0,
+          left: 0,
+          bottom: 0
+        };
   }
 
   private setAffixStyle(e: Event, affixStyle?: NgStyleInterface): void {
@@ -196,7 +211,10 @@ export class NzAffixComponent implements AfterViewInit, OnChanges, OnDestroy {
     }
     this.placeholderNode.style.cssText = '';
     this.placeholderStyle = undefined;
-    const styleObj = { width: this.placeholderNode.offsetWidth, height: this.fixedEl.nativeElement.offsetHeight };
+    const styleObj = {
+      width: this.placeholderNode.offsetWidth,
+      height: this.fixedEl.nativeElement.offsetHeight
+    };
     this.setAffixStyle(e, {
       ...this.affixStyle,
       ...styleObj
@@ -269,7 +287,10 @@ export class NzAffixComponent implements AfterViewInit, OnChanges, OnDestroy {
         this.affixStyle.position === 'fixed' &&
         this.placeholderNode.offsetWidth
       ) {
-        this.setAffixStyle(e, { ...this.affixStyle, width: this.placeholderNode.offsetWidth });
+        this.setAffixStyle(e, {
+          ...this.affixStyle,
+          width: this.placeholderNode.offsetWidth
+        });
       } else {
         this.setAffixStyle(e);
       }

diff --git a/components/alert/nz-alert.component.ts b/components/alert/nz-alert.component.ts
@@ -19,6 +19,8 @@ import {
 } from '@angular/core';
 import { slideAlertMotion, InputBoolean, NgClassType, NzConfigService, WithConfig } from 'ng-zorro-antd/core';
 
+const NZ_CONFIG_COMPONENT_NAME = 'alert';
+
 @Component({
   selector: 'nz-alert',
   exportAs: 'nzAlert',
@@ -41,8 +43,8 @@ export class NzAlertComponent implements OnChanges {
   @Input() nzMessage: string | TemplateRef<void>;
   @Input() nzDescription: string | TemplateRef<void>;
   @Input() nzType: 'success' | 'info' | 'warning' | 'error' = 'info';
-  @Input() @WithConfig(false) @InputBoolean() nzCloseable: boolean;
-  @Input() @WithConfig(false) @InputBoolean() nzShowIcon: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, false) @InputBoolean() nzCloseable: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, false) @InputBoolean() nzShowIcon: boolean;
   @Input() @InputBoolean() nzBanner = false;
   @Output() readonly nzOnClose = new EventEmitter<boolean>();
 

diff --git a/components/anchor/nz-anchor.component.ts b/components/anchor/nz-anchor.component.ts
@@ -42,6 +42,7 @@ interface Section {
   top: number;
 }
 
+const NZ_CONFIG_COMPONENT_NAME = 'anchor';
 const sharpMatcherRegx = /#([^#]+)$/;
 
 @Component({
@@ -56,11 +57,19 @@ export class NzAnchorComponent implements OnDestroy, AfterViewInit {
   @ViewChild('ink', { static: false }) private ink: ElementRef;
 
   @Input() @InputBoolean() nzAffix = true;
-  @Input() @WithConfig(false) @InputBoolean() nzShowInkInFixed: boolean;
-  @Input() @WithConfig(5) @InputNumber() nzBounds: number;
 
   @Input()
-  @WithConfig<number>()
+  @WithConfig(NZ_CONFIG_COMPONENT_NAME, false)
+  @InputBoolean()
+  nzShowInkInFixed: boolean;
+
+  @Input()
+  @WithConfig(NZ_CONFIG_COMPONENT_NAME, 5)
+  @InputNumber()
+  nzBounds: number;
+
+  @Input()
+  @WithConfig<number>(NZ_CONFIG_COMPONENT_NAME)
   set nzOffsetTop(value: number) {
     this._offsetTop = toNumber(value, 0);
     this.wrapperStyle = {

diff --git a/components/avatar/nz-avatar.component.ts b/components/avatar/nz-avatar.component.ts
@@ -31,6 +31,8 @@ import {
   WithConfig
 } from 'ng-zorro-antd/core';
 
+const NZ_CONFIG_COMPONENT_NAME = 'avatar';
+
 @Component({
   selector: 'nz-avatar',
   exportAs: 'nzAvatar',
@@ -41,8 +43,8 @@ import {
   encapsulation: ViewEncapsulation.None
 })
 export class NzAvatarComponent implements OnChanges {
-  @Input() @WithConfig('circle') nzShape: NzShapeSCType;
-  @Input() @WithConfig('default') nzSize: NzSizeLDSType | number;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 'circle') nzShape: NzShapeSCType;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 'default') nzSize: NzSizeLDSType | number;
   @Input() nzText: string;
   @Input() nzSrc: string;
   @Input() nzSrcSet: string;

diff --git a/components/back-top/nz-back-top.component.ts b/components/back-top/nz-back-top.component.ts
@@ -26,6 +26,8 @@ import { fadeMotion, InputNumber, NzConfigService, NzScrollService, WithConfig }
 import { fromEvent, Subscription } from 'rxjs';
 import { distinctUntilChanged, throttleTime } from 'rxjs/operators';
 
+const NZ_CONFIG_COMPONENT_NAME = 'backTop';
+
 @Component({
   selector: 'nz-back-top',
   exportAs: 'nzBackTop',
@@ -42,7 +44,7 @@ export class NzBackTopComponent implements OnInit, OnDestroy {
   visible: boolean = false;
 
   @Input() nzTemplate: TemplateRef<void>;
-  @Input() @WithConfig(400) @InputNumber() nzVisibilityHeight: number;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 400) @InputNumber() nzVisibilityHeight: number;
 
   @Input()
   set nzTarget(el: string | HTMLElement) {

diff --git a/components/badge/nz-badge.component.ts b/components/badge/nz-badge.component.ts
@@ -30,6 +30,8 @@ import { startWith, take, takeUntil } from 'rxjs/operators';
 
 export type NzBadgeStatusType = 'success' | 'processing' | 'default' | 'error' | 'warning';
 
+const NZ_CONFIG_COMPONENT_NAME = 'backTop';
+
 @Component({
   selector: 'nz-badge',
   exportAs: 'nzBadge',
@@ -70,9 +72,9 @@ export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges, OnDes
   @Input() @InputBoolean() nzShowZero: boolean = false;
   @Input() @InputBoolean() nzShowDot = true;
   @Input() @InputBoolean() nzDot = false;
-  @Input() @WithConfig(99) nzOverflowCount: number;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 99) nzOverflowCount: number;
   @Input() nzText: string;
-  @Input() @WithConfig() nzColor: string;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME) nzColor: string;
   @Input() nzTitle: string;
   @Input() nzStyle: { [key: string]: string };
   @Input() nzStatus: NzBadgeStatusType;

diff --git a/components/button/nz-button.component.ts b/components/button/nz-button.component.ts
@@ -35,7 +35,6 @@ import {
   findFirstNotEmptyNode,
   findLastNotEmptyNode,
   isEmpty,
-  trimComponentName,
   InputBoolean,
   NzConfigService,
   NzSizeLDSType,
@@ -53,6 +52,8 @@ import { startWith, takeUntil } from 'rxjs/operators';
 export type NzButtonType = 'primary' | 'dashed' | 'danger' | 'default' | 'link';
 export type NzButtonShape = 'circle' | 'round' | null;
 
+const NZ_CONFIG_COMPONENT_NAME = 'button';
+
 @Component({
   selector: '[nz-button]',
   exportAs: 'nzButton',
@@ -78,7 +79,7 @@ export class NzButtonComponent implements AfterContentInit, OnInit, OnDestroy, O
   @Input() @InputBoolean() nzLoading: boolean = false;
   @Input() nzType: NzButtonType = 'default';
   @Input() nzShape: NzButtonShape = null;
-  @Input() @WithConfig('default') nzSize: NzSizeLDSType;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 'default') nzSize: NzSizeLDSType;
 
   readonly el: HTMLElement = this.elementRef.nativeElement;
   isInDropdown = false;
@@ -155,7 +156,7 @@ export class NzButtonComponent implements AfterContentInit, OnInit, OnDestroy, O
   ) {
     this.renderer.addClass(elementRef.nativeElement, 'ant-btn');
     this.nzConfigService
-      .getConfigChangeEventForComponent(trimComponentName(this.constructor.name))
+      .getConfigChangeEventForComponent(NZ_CONFIG_COMPONENT_NAME)
       .pipe(takeUntil(this.destroy$))
       .subscribe(() => {
         this.setClassMap();

diff --git a/components/card/nz-card.component.ts b/components/card/nz-card.component.ts
@@ -22,6 +22,8 @@ import { InputBoolean, NzConfigService, NzSizeDSType, WithConfig } from 'ng-zorr
 import { NzCardGridDirective } from './nz-card-grid.directive';
 import { NzCardTabComponent } from './nz-card-tab.component';
 
+const NZ_CONFIG_COMPONENT_NAME = 'card';
+
 @Component({
   selector: 'nz-card',
   exportAs: 'nzCard',
@@ -47,14 +49,14 @@ import { NzCardTabComponent } from './nz-card-tab.component';
   }
 })
 export class NzCardComponent {
-  @Input() @WithConfig(true) @InputBoolean() nzBordered: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, true) @InputBoolean() nzBordered: boolean;
   @Input() @InputBoolean() nzLoading = false;
-  @Input() @WithConfig(false) @InputBoolean() nzHoverable: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, false) @InputBoolean() nzHoverable: boolean;
   @Input() nzBodyStyle: { [key: string]: string };
   @Input() nzCover: TemplateRef<void>;
   @Input() nzActions: Array<TemplateRef<void>> = [];
   @Input() nzType: string;
-  @Input() @WithConfig('default') nzSize: NzSizeDSType;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 'default') nzSize: NzSizeDSType;
   @Input() nzTitle: string | TemplateRef<void>;
   @Input() nzExtra: string | TemplateRef<void>;
   @ContentChild(NzCardTabComponent, { static: false }) tab: NzCardTabComponent;

diff --git a/components/carousel/nz-carousel.component.ts b/components/carousel/nz-carousel.component.ts
@@ -57,6 +57,8 @@ import { NzCarouselBaseStrategy } from './strategies/base-strategy';
 import { NzCarouselOpacityStrategy } from './strategies/opacity-strategy';
 import { NzCarouselTransformStrategy } from './strategies/transform-strategy';
 
+const NZ_CONFIG_COMPONENT_NAME = 'carousel';
+
 @Component({
   changeDetection: ChangeDetectionStrategy.OnPush,
   encapsulation: ViewEncapsulation.None,
@@ -94,11 +96,11 @@ export class NzCarouselComponent implements AfterContentInit, AfterViewInit, OnD
   @ViewChild('slickTrack', { static: false }) slickTrack: ElementRef;
 
   @Input() nzDotRender: TemplateRef<{ $implicit: number }>;
-  @Input() @WithConfig('scrollx') nzEffect: NzCarouselEffects;
-  @Input() @WithConfig(true) @InputBoolean() nzEnableSwipe: boolean;
-  @Input() @WithConfig(true) @InputBoolean() nzDots: boolean;
-  @Input() @WithConfig(false) @InputBoolean() nzAutoPlay: boolean;
-  @Input() @WithConfig(3000) @InputNumber() nzAutoPlaySpeed: number;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 'scrollx') nzEffect: NzCarouselEffects;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, true) @InputBoolean() nzEnableSwipe: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, true) @InputBoolean() nzDots: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, false) @InputBoolean() nzAutoPlay: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 3000) @InputNumber() nzAutoPlaySpeed: number;
   @Input() @InputNumber() nzTransitionSpeed = 500;
 
   @Input()
@@ -113,7 +115,7 @@ export class NzCarouselComponent implements AfterContentInit, AfterViewInit, OnD
   }
 
   @Input()
-  @WithConfig('bottom')
+  @WithConfig(NZ_CONFIG_COMPONENT_NAME, 'bottom')
   set nzDotPosition(value: NzCarouselDotPosition) {
     this._dotPosition = value;
     if (value === 'left' || value === 'right') {

diff --git a/components/cascader/nz-cascader.component.ts b/components/cascader/nz-cascader.component.ts
@@ -36,7 +36,6 @@ import { startWith, takeUntil } from 'rxjs/operators';
 import {
   slideMotion,
   toArray,
-  trimComponentName,
   warnDeprecation,
   DEFAULT_DROPDOWN_POSITIONS,
   InputBoolean,
@@ -60,6 +59,7 @@ import {
 import { NzCascaderOptionComponent } from './nz-cascader-li.component';
 import { NzCascaderService } from './nz-cascader.service';
 
+const NZ_CONFIG_COMPONENT_NAME = 'cascader';
 const defaultDisplayRender = (labels: string[]) => labels.join(' / ');
 
 @Component({
@@ -119,7 +119,7 @@ export class NzCascaderComponent implements NzCascaderComponentAsSource, OnInit,
   @Input() nzLabelRender: TemplateRef<void>;
   @Input() nzLabelProperty = 'label';
   @Input() nzNotFoundContent: string | TemplateRef<void>;
-  @Input() @WithConfig('default') nzSize: NzCascaderSize;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, 'default') nzSize: NzCascaderSize;
   @Input() nzShowSearch: boolean | NzShowSearchOptions;
   @Input() nzPlaceHolder: string;
   @Input() nzMenuClassName: string;
@@ -274,7 +274,7 @@ export class NzCascaderComponent implements NzCascaderComponentAsSource, OnInit,
       });
 
     this.nzConfigService
-      .getConfigChangeEventForComponent(trimComponentName(this.constructor.name))
+      .getConfigChangeEventForComponent(NZ_CONFIG_COMPONENT_NAME)
       .pipe(takeUntil(this.$destroy))
       .subscribe(() => {
         this.cdr.markForCheck();

diff --git a/components/collapse/nz-collapse-panel.component.ts b/components/collapse/nz-collapse-panel.component.ts
@@ -26,6 +26,8 @@ import { collapseMotion, InputBoolean, NzConfigService, WithConfig } from 'ng-zo
 
 import { NzCollapseComponent } from './nz-collapse.component';
 
+const NZ_CONFIG_COMPONENT_NAME = 'collapsePanel';
+
 @Component({
   selector: 'nz-collapse-panel',
   exportAs: 'nzCollapsePanel',
@@ -49,7 +51,7 @@ import { NzCollapseComponent } from './nz-collapse.component';
 export class NzCollapsePanelComponent implements OnInit, OnDestroy {
   @Input() @InputBoolean() nzActive = false;
   @Input() @InputBoolean() nzDisabled = false;
-  @Input() @WithConfig(true) @InputBoolean() nzShowArrow: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, true) @InputBoolean() nzShowArrow: boolean;
   @Input() nzExtra: string | TemplateRef<void>;
   @Input() nzHeader: string | TemplateRef<void>;
   @Input() nzExpandedIcon: string | TemplateRef<void>;

diff --git a/components/collapse/nz-collapse.component.ts b/components/collapse/nz-collapse.component.ts
@@ -12,6 +12,8 @@ import { InputBoolean, NzConfigService, WithConfig } from 'ng-zorro-antd/core';
 
 import { NzCollapsePanelComponent } from './nz-collapse-panel.component';
 
+const NZ_CONFIG_COMPONENT_NAME = 'collapse';
+
 @Component({
   selector: 'nz-collapse',
   exportAs: 'nzCollapse',
@@ -28,8 +30,8 @@ import { NzCollapsePanelComponent } from './nz-collapse-panel.component';
 })
 export class NzCollapseComponent {
   private listOfNzCollapsePanelComponent: NzCollapsePanelComponent[] = [];
-  @Input() @WithConfig(false) @InputBoolean() nzAccordion: boolean;
-  @Input() @WithConfig(true) @InputBoolean() nzBordered: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, false) @InputBoolean() nzAccordion: boolean;
+  @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME, true) @InputBoolean() nzBordered: boolean;
 
   constructor(public nzConfigService: NzConfigService) {}
 

diff --git a/components/core/config/config.service.ts b/components/core/config/config.service.ts
@@ -52,28 +52,14 @@ export class NzConfigService {
 // tslint:disable:no-invalid-this
 // tslint:disable:no-any
 
-const lowercaseFirstLetter = (s: string): string => {
-  return s.charAt(0).toLowerCase() + s.slice(1);
-};
-
-export const trimComponentName = (componentName: string): NzConfigKey => {
-  return lowercaseFirstLetter(
-    componentName
-      .replace('Nz', '')
-      .replace(/(Component|Directive|Service|ContainerComponent)$/g, '')
-      .toLowerCase()
-  ) as NzConfigKey;
-};
-
 /**
  * This decorator is used to decorate properties. If a property is decorated, it would try to load default value from
  * config.
  */
 // tslint:disable-next-line:typedef
-export function WithConfig<T>(innerDefaultValue?: T) {
+export function WithConfig<T>(componentName: NzConfigKey, innerDefaultValue?: T) {
   return function ConfigDecorator(target: any, propName: any, originalDescriptor?: TypedPropertyDescriptor<T>): any {
     const privatePropName = `$$__assignedValue__${propName}`;
-    const componentName = trimComponentName(target.constructor.name) as NzConfigKey;
 
     if (Object.prototype.hasOwnProperty.call(target, privatePropName)) {
       console.warn(

diff --git a/components/core/config/config.spec.ts b/components/core/config/config.spec.ts
@@ -9,7 +9,7 @@ import { NzConfigService, NZ_CONFIG, WithConfig } from 'ng-zorro-antd/core';
   template: ''
 })
 export class NzGlobalConfigTestBindTwiceComponent {
-  @WithConfig('b') @WithConfig('a') v: string;
+  @WithConfig('button', 'b') @WithConfig('button', 'a') v: string;
 
   constructor(public nzConfigService: NzConfigService) {}
 }