@@ -25,6 +25,7 @@ import { IgxTabsGroupComponent } from './tabs-group.component';
25
25
import { IgxLeftButtonStyleDirective , IgxRightButtonStyleDirective , IgxTabItemTemplateDirective } from './tabs.directives' ;
26
26
import { IgxTabsBase , IgxTabItemBase } from './tabs.common' ;
27
27
import ResizeObserver from 'resize-observer-polyfill' ;
28
+ import { PlatformUtil } from '../core/utils' ;
28
29
29
30
export enum TabsType {
30
31
FIXED = 'fixed' ,
@@ -298,7 +299,7 @@ export class IgxTabsComponent implements IgxTabsBase, AfterViewInit, OnDestroy {
298
299
}
299
300
}
300
301
301
- constructor ( private _element : ElementRef , private _ngZone : NgZone ) {
302
+ constructor ( private _element : ElementRef , private _ngZone : NgZone , private platformUtil : PlatformUtil ) {
302
303
}
303
304
304
305
/**
@@ -317,28 +318,29 @@ export class IgxTabsComponent implements IgxTabsBase, AfterViewInit, OnDestroy {
317
318
this . _selectedIndex = 0 ;
318
319
}
319
320
320
- requestAnimationFrame ( ( ) => {
321
- const newTab = this . tabs . toArray ( ) [ this . _selectedIndex ] ;
322
- if ( newTab ) {
323
- this . performSelection ( newTab ) ;
324
- } else {
325
- this . hideIndicator ( ) ;
326
- }
327
- } ) ;
328
-
329
- this . _groupChanges$ = this . groups . changes . subscribe ( ( ) => {
330
- this . resetSelectionOnCollectionChanged ( ) ;
331
- } ) ;
332
-
333
- this . _ngZone . runOutsideAngular ( ( ) => {
334
- this . _resizeObserver = new ResizeObserver ( ( ) => {
335
- if ( ! this . hasContentTabs && this . _selectedIndex >= 0 && this . _selectedIndex < this . tabs . length ) {
336
- const newTab = this . tabs . toArray ( ) [ this . _selectedIndex ] ;
337
- this . transformContentAnimation ( newTab , 0 ) ;
321
+ if ( this . platformUtil . isBrowser ) {
322
+ requestAnimationFrame ( ( ) => {
323
+ const newTab = this . tabs . toArray ( ) [ this . _selectedIndex ] ;
324
+ if ( newTab ) {
325
+ this . performSelection ( newTab ) ;
326
+ } else {
327
+ this . hideIndicator ( ) ;
338
328
}
339
329
} ) ;
330
+ this . _ngZone . runOutsideAngular ( ( ) => {
331
+ this . _resizeObserver = new ResizeObserver ( ( ) => {
332
+ if ( ! this . hasContentTabs && this . _selectedIndex >= 0 && this . _selectedIndex < this . tabs . length ) {
333
+ const newTab = this . tabs . toArray ( ) [ this . _selectedIndex ] ;
334
+ this . transformContentAnimation ( newTab , 0 ) ;
335
+ }
336
+ } ) ;
337
+
338
+ this . _resizeObserver . observe ( this . tabsContainer . nativeElement ) ;
339
+ } ) ;
340
+ }
340
341
341
- this . _resizeObserver . observe ( this . tabsContainer . nativeElement ) ;
342
+ this . _groupChanges$ = this . groups . changes . subscribe ( ( ) => {
343
+ this . resetSelectionOnCollectionChanged ( ) ;
342
344
} ) ;
343
345
}
344
346
@@ -349,10 +351,11 @@ export class IgxTabsComponent implements IgxTabsBase, AfterViewInit, OnDestroy {
349
351
if ( this . _groupChanges$ ) {
350
352
this . _groupChanges$ . unsubscribe ( ) ;
351
353
}
352
-
353
- this . _ngZone . runOutsideAngular ( ( ) => {
354
- this . _resizeObserver . disconnect ( ) ;
355
- } ) ;
354
+ if ( this . _resizeObserver ) {
355
+ this . _ngZone . runOutsideAngular ( ( ) => {
356
+ this . _resizeObserver . disconnect ( ) ;
357
+ } ) ;
358
+ }
356
359
}
357
360
358
361
private resetSelectionOnCollectionChanged ( ) : void {
0 commit comments