Skip to content

Commit 42d8942

Browse files
kdinevkdinev
authored
Merge pull request #8594 from IgniteUI/dpetev/ssr-errors-fix
Resolve some possible ssr errors
2 parents a4c5f2f + 6c0e5a6 commit 42d8942

16 files changed

+105
-44
lines changed

‎projects/igniteui-angular/src/lib/directives/drag-drop/drag-drop.directive.ts‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
} from '@angular/core';
2121
import { animationFrameScheduler, fromEvent, interval, Subject } from 'rxjs';
2222
import { takeUntil, throttle } from 'rxjs/operators';
23-
import { IBaseEventArgs } from '../../core/utils';
23+
import { IBaseEventArgs, PlatformUtil } from '../../core/utils';
2424
import { IDropStrategy, IgxDefaultDropStrategy } from './drag-drop.strategy';
2525

2626
export enum DragDirection {
@@ -604,7 +604,8 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy {
604604
public element: ElementRef,
605605
public viewContainer: ViewContainerRef,
606606
public zone: NgZone,
607-
public renderer: Renderer2
607+
public renderer: Renderer2,
608+
protected platformUtil: PlatformUtil,
608609
) {
609610
}
610611

@@ -619,6 +620,9 @@ export class IgxDragDirective implements AfterContentInit, OnDestroy {
619620

620621
// Bind events
621622
this.zone.runOutsideAngular(() => {
623+
if (!this.platformUtil.isBrowser) {
624+
return;
625+
}
622626
const targetElements = this.dragHandles && this.dragHandles.length ?
623627
this.dragHandles.map((item) => item.element.nativeElement) : [this.element.nativeElement];
624628
targetElements.forEach((element) => {

‎projects/igniteui-angular/src/lib/directives/for-of/base.helper.component.ts‎

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
import { DOCUMENT } from '@angular/common';
1414
import { Subject } from 'rxjs';
1515
import { takeUntil, throttleTime } from 'rxjs/operators';
16-
import { resizeObservable, isIE } from '../../core/utils';
16+
import { resizeObservable, isIE, PlatformUtil } from '../../core/utils';
1717

1818
@Directive({
1919
selector: '[igxVirtualHelperBase]'
@@ -33,6 +33,9 @@ export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit {
3333

3434
ngAfterViewInit() {
3535
this._afterViewInit = true;
36+
if (!this.platformUtil.isBrowser) {
37+
return;
38+
}
3639
const delayTime = isIE() ? 40 : 0;
3740
this._zone.runOutsideAngular(() => {
3841
resizeObservable(this.nativeElement).pipe(
@@ -45,9 +48,15 @@ export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit {
4548
onScroll(event) {
4649
this.scrollAmount = event.target.scrollTop || event.target.scrollLeft;
4750
}
48-
constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef, protected _zone: NgZone, @Inject(DOCUMENT) public document) {
51+
constructor(
52+
public elementRef: ElementRef,
53+
public cdr: ChangeDetectorRef,
54+
protected _zone: NgZone,
55+
@Inject(DOCUMENT) public document: any,
56+
protected platformUtil: PlatformUtil,
57+
) {
4958
this._scrollNativeSize = this.calculateScrollNativeSize();
50-
}
59+
}
5160

5261
get nativeElement() {
5362
return this.elementRef.nativeElement;
@@ -95,17 +104,17 @@ export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit {
95104
protected restoreScroll() {}
96105

97106
public calculateScrollNativeSize() {
98-
const div = document.createElement('div');
107+
const div = this.document.createElement('div');
99108
const style = div.style;
100109
style.width = '100px';
101110
style.height = '100px';
102111
style.position = 'absolute';
103112
style.top = '-10000px';
104113
style.top = '-10000px';
105114
style.overflow = 'scroll';
106-
document.body.appendChild(div);
115+
this.document.body.appendChild(div);
107116
const scrollWidth = div.offsetWidth - div.clientWidth;
108-
document.body.removeChild(div);
117+
this.document.body.removeChild(div);
109118
return scrollWidth ? scrollWidth + 1 : 1;
110119
}
111120
}

‎projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import { UIInteractions, wait } from '../../test-utils/ui-interactions.spec';
2525
import { configureTestSuite } from '../../test-utils/configure-suite';
2626
import { IgxForOfScrollSyncService } from './for_of.sync.service';
2727
import { TestNgZone } from '../../test-utils/helper-utils.spec';
28+
import { PlatformUtil } from '../../core/utils';
2829

2930
describe('IgxForOf directive -', () => {
3031
const INACTIVE_VIRT_CONTAINER = 'igx-display-container--inactive';
@@ -1261,8 +1262,9 @@ export class TestIgxForOfDirective<T> extends IgxForOfDirective<T> {
12611262
public fResolver: ComponentFactoryResolver,
12621263
public changeDet: ChangeDetectorRef,
12631264
public zone: NgZone,
1264-
protected syncService: IgxForOfScrollSyncService) {
1265-
super(viewContainer, template, differs, fResolver, changeDet, zone, syncService);
1265+
protected syncService: IgxForOfScrollSyncService,
1266+
platformUtil: PlatformUtil) {
1267+
super(viewContainer, template, differs, fResolver, changeDet, zone, syncService, platformUtil, document);
12661268
}
12671269
public scrStepArray = [];
12681270
public scrTopArray = [];

‎projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts‎

Lines changed: 21 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { CommonModule, NgForOfContext } from '@angular/common';
1+
import { CommonModule, DOCUMENT, NgForOfContext } from '@angular/common';
22
import {
33
ChangeDetectorRef,
44
ComponentFactory,
@@ -22,7 +22,8 @@ import {
2222
TemplateRef,
2323
TrackByFunction,
2424
ViewContainerRef,
25-
AfterViewInit
25+
AfterViewInit,
26+
Inject
2627
} from '@angular/core';
2728

2829
import { DisplayContainerComponent } from './display.container';
@@ -33,7 +34,7 @@ import { IgxForOfSyncService, IgxForOfScrollSyncService } from './for_of.sync.se
3334
import { Subject } from 'rxjs';
3435
import { takeUntil, filter, throttleTime, first } from 'rxjs/operators';
3536
import ResizeObserver from 'resize-observer-polyfill';
36-
import { IBaseEventArgs } from '../../core/utils';
37+
import { IBaseEventArgs, PlatformUtil } from '../../core/utils';
3738
import { VirtualHelperBaseDirective } from './base.helper.component';
3839

3940
/**
@@ -335,7 +336,11 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
335336
private resolver: ComponentFactoryResolver,
336337
public cdr: ChangeDetectorRef,
337338
protected _zone: NgZone,
338-
protected syncScrollService: IgxForOfScrollSyncService) { }
339+
protected syncScrollService: IgxForOfScrollSyncService,
340+
protected platformUtil: PlatformUtil,
341+
@Inject(DOCUMENT)
342+
protected document: any,
343+
) { }
339344

340345
/**
341346
* @hidden
@@ -972,15 +977,15 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
972977
* Clears focus inside the virtualized container on small scroll swaps.
973978
*/
974979
protected scrollFocus(node?: HTMLElement): void {
975-
const activeElement = document.activeElement as HTMLElement;
980+
const activeElement = this.document.activeElement as HTMLElement;
976981

977982
// Remove focus in case the the active element is inside the view container.
978983
// Otherwise we hit an exception while doing the 'small' scrolls swapping.
979984
// For more information:
980985
//
981986
// https://developer.mozilla.org/en-US/docs/Web/API/Node/removeChild
982987
// https://bugs.chromium.org/p/chromium/issues/detail?id=432392
983-
if (node && node.contains(document.activeElement)) {
988+
if (node && node.contains(this.document.activeElement)) {
984989
activeElement.blur();
985990
}
986991
}
@@ -1060,13 +1065,16 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
10601065
* @hidden
10611066
*/
10621067
protected _calcMaxBrowserHeight(): number {
1063-
const div = document.createElement('div');
1068+
if (!this.platformUtil.isBrowser) {
1069+
return 0;
1070+
}
1071+
const div = this.document.createElement('div');
10641072
const style = div.style;
10651073
style.position = 'absolute';
10661074
style.top = '9999999999999999px';
1067-
document.body.appendChild(div);
1075+
this.document.body.appendChild(div);
10681076
const size = Math.abs(div.getBoundingClientRect()['top']);
1069-
document.body.removeChild(div);
1077+
this.document.body.removeChild(div);
10701078
return size;
10711079
}
10721080

@@ -1427,9 +1435,11 @@ export class IgxGridForOfDirective<T> extends IgxForOfDirective<T> implements On
14271435
resolver: ComponentFactoryResolver,
14281436
cdr: ChangeDetectorRef,
14291437
_zone: NgZone,
1438+
_platformUtil: PlatformUtil,
1439+
@Inject(DOCUMENT) _document: any,
14301440
protected syncScrollService: IgxForOfScrollSyncService,
14311441
protected syncService: IgxForOfSyncService) {
1432-
super(_viewContainer, _template, _differs, resolver, cdr, _zone, syncScrollService);
1442+
super(_viewContainer, _template, _differs, resolver, cdr, _zone, syncScrollService, _platformUtil, _document);
14331443
}
14341444

14351445
@Input()
@@ -1561,7 +1571,7 @@ export class IgxGridForOfDirective<T> extends IgxForOfDirective<T> implements On
15611571

15621572
// if data has been changed while container is scrolled
15631573
// should update scroll top/left according to change so that same startIndex is in view
1564-
if (Math.abs(diff) > 0) {
1574+
if (Math.abs(diff) > 0 && this.platformUtil.isBrowser) {
15651575
// TODO: This code can be removed. However tests need to be rewritten in a way that they wait for ResizeObserved to complete.
15661576
// So leaving as is for the moment.
15671577
requestAnimationFrame(() => {

‎projects/igniteui-angular/src/lib/directives/for-of/horizontal.virtual.helper.component.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef, ChangeDetectorRef, Inject, NgZone } from '@angular/core';
22
import { VirtualHelperBaseDirective } from './base.helper.component';
33
import { DOCUMENT } from '@angular/common';
4+
import { PlatformUtil } from '../../core/utils';
45

56
/**
67
* @hidden
@@ -15,8 +16,8 @@ export class HVirtualHelperComponent extends VirtualHelperBaseDirective {
1516
@HostBinding('class')
1617
public cssClasses = 'igx-vhelper--horizontal';
1718

18-
constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef, protected _zone: NgZone, @Inject(DOCUMENT) public document) {
19-
super(elementRef, cdr, _zone, document);
19+
constructor(elementRef: ElementRef, cdr: ChangeDetectorRef, zone: NgZone, @Inject(DOCUMENT) document, platformUtil: PlatformUtil) {
20+
super(elementRef, cdr, zone, document, platformUtil);
2021
}
2122

2223
protected restoreScroll() {

‎projects/igniteui-angular/src/lib/directives/for-of/virtual.helper.component.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef,
22
ChangeDetectorRef, OnDestroy, OnInit, Inject, NgZone } from '@angular/core';
33
import { VirtualHelperBaseDirective } from './base.helper.component';
44
import { DOCUMENT } from '@angular/common';
5+
import { PlatformUtil } from '../../core/utils';
56

67
@Component({
78
selector: 'igx-virtual-helper',
@@ -21,8 +22,8 @@ export class VirtualHelperComponent extends VirtualHelperBaseDirective implement
2122
@HostBinding('class')
2223
public cssClasses = 'igx-vhelper--vertical';
2324

24-
constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef, protected _zone: NgZone, @Inject(DOCUMENT) public document) {
25-
super(elementRef, cdr, _zone, document);
25+
constructor(elementRef: ElementRef, cdr: ChangeDetectorRef, zone: NgZone, @Inject(DOCUMENT) document, platformUtil: PlatformUtil) {
26+
super(elementRef, cdr, zone, document, platformUtil);
2627
}
2728

2829
ngOnInit() {

‎projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,9 @@ export class IgxScrollInertiaDirective implements OnInit, OnDestroy {
6868
ngOnInit(): void {
6969
this._zone.runOutsideAngular(() => {
7070
this.parentElement = this.element.nativeElement.parentElement || this.element.nativeElement.parentNode;
71+
if (!this.parentElement) {
72+
return;
73+
}
7174
const targetElem = this.parentElement;
7275
targetElem.addEventListener('wheel',
7376
(evt) => { this.onWheel(evt); });
@@ -482,6 +485,9 @@ export class IgxScrollInertiaDirective implements OnInit, OnDestroy {
482485
ngOnDestroy() {
483486
this._zone.runOutsideAngular(() => {
484487
const targetElem = this.parentElement;
488+
if (!targetElem) {
489+
return;
490+
}
485491
targetElem.removeEventListener('wheel',
486492
(evt) => { this.onWheel(evt); });
487493
targetElem.removeEventListener('touchstart',

‎projects/igniteui-angular/src/lib/grids/cell.component.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -599,7 +599,7 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
599599
this.nativeElement.addEventListener('pointerdown', this.pointerdown);
600600
this.addPointerListeners(this.cellSelectionMode);
601601
// IE 11 workarounds
602-
if (isIE()) {
602+
if (this.platformUtil.isBrowser && isIE()) { // TODO: Move isIE to platformUtil
603603
this.compositionStartHandler = () => this.crudService.isInCompositionMode = true;
604604
this.compositionEndHandler = () => this.crudService.isInCompositionMode = false;
605605
// Hitting Enter with IME submits and exits from edit mode instead of first closing the IME dialog
@@ -622,7 +622,7 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy {
622622
this.zone.runOutsideAngular(() => {
623623
this.nativeElement.removeEventListener('pointerdown', this.pointerdown);
624624
this.removePointerListeners(this.cellSelectionMode);
625-
if (isIE()) {
625+
if (this.platformUtil.isBrowser && isIE()) {
626626
this.nativeElement.removeEventListener('compositionstart', this.compositionStartHandler);
627627
this.nativeElement.removeEventListener('compositionend', this.compositionEndHandler);
628628
}

‎projects/igniteui-angular/src/lib/grids/column-actions/column-actions.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ <h4 [attr.id]='titleID' class="igx-column-actions__header-title" *ngIf="title">{
1414
<div class="igx-column-actions__columns" tabindex="0"
1515
[style.max-height]="columnsAreaMaxHeight">
1616
<igx-checkbox
17-
*ngFor="let column of columns
17+
*ngFor="let column of grid?.columns
1818
| columnActionEnabled:actionsDirective.actionEnabledColumnsFilter:pipeTrigger
1919
| filterActionColumns:filterCriteria:pipeTrigger
2020
| sortActionColumns:columnDisplayOrder:pipeTrigger;"

‎projects/igniteui-angular/src/lib/grids/column-actions/column-actions.component.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -366,7 +366,7 @@ export class IgxColumnActionsComponent implements DoCheck {
366366
*/
367367
public ngDoCheck() {
368368
if (this._differ) {
369-
const changes = this._differ.diff(this.columns);
369+
const changes = this._differ.diff(this.grid?.columns);
370370
if (changes) {
371371
this._pipeTrigger++;
372372
}

0 commit comments

Comments
 (0)