16193550997

Committed 10 Jul 2025 11:12AM UTC coverage: 4.657% (-87.0%) from 91.64%

Build # 16193550997

Build Type

Pull #16028

github

Committed by

web-flow

Commit Message

Merge f7a9963b8 into 87246e3ce

Pull Request Pull Request #16028: fix(radio-group): dynamically added radio buttons do not initialize

Run Details

178 of 15764 branches covered (1.13%)

18 of 19 new or added lines in 2 files covered. (94.74%)

25721 existing lines in 324 files now uncovered.

1377 of 29570 relevant lines covered (4.66%)

0.53 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

2.94

/projects/igniteui-angular/src/lib/carousel/carousel-base.ts

import { AnimationReferenceMetadata, useAnimation } from '@angular/animations';
import { ChangeDetectorRef, Directive, EventEmitter, Inject, OnDestroy } from '@angular/core';
import { IgxAngularAnimationService } from '../services/animation/angular-animation-service';
import { AnimationPlayer, AnimationService } from '../services/animation/animation';
import { fadeIn, slideInLeft } from 'igniteui-angular/animations';
import { CarouselAnimationType } from './enums';

export enum Direction { NONE, NEXT, PREV }

export interface CarouselAnimationSettings {
    enterAnimation: AnimationReferenceMetadata;
    leaveAnimation: AnimationReferenceMetadata;
}

/** @hidden */
export interface IgxSlideComponentBase {
    direction: Direction;
    previous: boolean;
}

/** @hidden */
@Directive()
export abstract class IgxCarouselComponentBase implements OnDestroy {
    /** @hidden */
    public animationType: CarouselAnimationType = CarouselAnimationType.slide;

    /** @hidden @internal */
    public enterAnimationDone = new EventEmitter();
    /** @hidden @internal */
    public leaveAnimationDone = new EventEmitter();

    /** @hidden */
    protected currentItem: IgxSlideComponentBase;
    /** @hidden */
    protected previousItem: IgxSlideComponentBase;
    /** @hidden */
    protected enterAnimationPlayer?: AnimationPlayer;
    /** @hidden */
    protected leaveAnimationPlayer?: AnimationPlayer;
    /** @hidden */
    protected defaultAnimationDuration = 320;
    /** @hidden */
    protected animationPosition = 0;
    /** @hidden */
    protected newDuration = 0;
    /** @hidden */
    protected vertical = false;

    constructor(
        @Inject(IgxAngularAnimationService) private animationService: AnimationService,
        protected cdr: ChangeDetectorRef) {
    }

    public ngOnDestroy(): void {
        if (this.enterAnimationPlayer) {
            this.enterAnimationPlayer.destroy();
            this.enterAnimationPlayer = null;
        }
        if (this.leaveAnimationPlayer) {
            this.leaveAnimationPlayer.destroy();
            this.leaveAnimationPlayer = null;
        }
    }

    /** @hidden */
    protected triggerAnimations() {
        if (this.animationType !== CarouselAnimationType.none) {
            if (this.animationStarted(this.leaveAnimationPlayer) || this.animationStarted(this.enterAnimationPlayer)) {
                requestAnimationFrame(() => {
                    this.resetAnimations();
                    this.playAnimations();
                });
            } else {
                this.playAnimations();
            }
        }
    }

    /** @hidden */
    protected animationStarted(animation: AnimationPlayer): boolean {
        return animation && animation.hasStarted();
    }

    /** @hidden */
    protected playAnimations() {
        this.playLeaveAnimation();
        this.playEnterAnimation();
    }

    private resetAnimations() {
        if (this.animationStarted(this.leaveAnimationPlayer)) {
            this.leaveAnimationPlayer.reset();
            this.leaveAnimationDone.emit();
        }

        if (this.animationStarted(this.enterAnimationPlayer)) {
            this.enterAnimationPlayer.reset();
            this.enterAnimationDone.emit();
            this.cdr.markForCheck();
        }
    }

    private getAnimation(): CarouselAnimationSettings {
        let duration;
        if (this.newDuration) {
            duration = this.animationPosition ? this.animationPosition * this.newDuration : this.newDuration;
        } else {
            duration = this.animationPosition ? this.animationPosition * this.defaultAnimationDuration : this.defaultAnimationDuration;
        }

        const trans = this.animationPosition ? this.animationPosition * 100 : 100;
        switch (this.animationType) {
            case CarouselAnimationType.slide:
                return {
                    enterAnimation: useAnimation(slideInLeft,
                        {
                            params: {
                                delay: '0s',
                                duration: `${duration}ms`,
                                endOpacity: 1,
                                startOpacity: 1,
                                fromPosition: `${this.vertical ? 'translateY' : 'translateX'}(${this.currentItem.direction === 1 ? trans : -trans}%)`,
                                toPosition: `${this.vertical ? 'translateY(0%)' : 'translateX(0%)'}`
                            }
                        }),
                    leaveAnimation: useAnimation(slideInLeft,
                        {
                            params: {
                                delay: '0s',
                                duration: `${duration}ms`,
                                endOpacity: 1,
                                startOpacity: 1,
                                fromPosition: `${this.vertical ? 'translateY(0%)' : 'translateX(0%)'}`,
                                toPosition: `${this.vertical ? 'translateY' : 'translateX'}(${this.currentItem.direction === 1 ? -trans : trans}%)`,
                            }
                        })
                };
            case CarouselAnimationType.fade:
                return {
                    enterAnimation: useAnimation(fadeIn,
                        { params: { duration: `${duration}ms`, startOpacity: `${this.animationPosition}` } }),
                    leaveAnimation: null
                };
        }
        return {
            enterAnimation: null,
            leaveAnimation: null
        };
    }

    private playEnterAnimation() {
        const animation = this.getAnimation().enterAnimation;
        if (!animation) {
            return;
        }

        this.enterAnimationPlayer = this.animationService.buildAnimation(animation, this.getCurrentElement());
        this.enterAnimationPlayer.animationEnd.subscribe(() => {
            // TODO: animation may never end. Find better way to clean up the player
            if (this.enterAnimationPlayer) {
                this.enterAnimationPlayer.destroy();
                this.enterAnimationPlayer = null;
            }
            this.animationPosition = 0;
            this.newDuration = 0;
            this.previousItem.previous = false;
            this.enterAnimationDone.emit();
            this.cdr.markForCheck();
        });
        this.previousItem.previous = true;
        this.enterAnimationPlayer.play();
    }

    private playLeaveAnimation() {
        const animation = this.getAnimation().leaveAnimation;
        if (!animation) {
            return;
        }

        this.leaveAnimationPlayer = this.animationService.buildAnimation(animation, this.getPreviousElement());
        this.leaveAnimationPlayer.animationEnd.subscribe(() => {
            // TODO: animation may never end. Find better way to clean up the player
            if (this.leaveAnimationPlayer) {
                this.leaveAnimationPlayer.destroy();
                this.leaveAnimationPlayer = null;
            }
            this.animationPosition = 0;
            this.newDuration = 0;
            this.leaveAnimationDone.emit();
        });
        this.leaveAnimationPlayer.play();
    }

    protected abstract getPreviousElement(): HTMLElement;

    protected abstract getCurrentElement(): HTMLElement;
}

1	import { AnimationReferenceMetadata, useAnimation } from '@angular/animations';
2	import { ChangeDetectorRef, Directive, EventEmitter, Inject, OnDestroy } from '@angular/core';
3	import { IgxAngularAnimationService } from '../services/animation/angular-animation-service';
4	import { AnimationPlayer, AnimationService } from '../services/animation/animation';
5	import { fadeIn, slideInLeft } from 'igniteui-angular/animations';
6	import { CarouselAnimationType } from './enums';
7
8	export enum Direction { NONE, NEXT, PREV }	3✔
9
10	export interface CarouselAnimationSettings {
11	enterAnimation: AnimationReferenceMetadata;
12	leaveAnimation: AnimationReferenceMetadata;
13	}
14
15	/** @hidden */
16	export interface IgxSlideComponentBase {
17	direction: Direction;
18	previous: boolean;
19	}
20
21	/** @hidden */
22	@Directive()
23	export abstract class IgxCarouselComponentBase implements OnDestroy {	3✔
24	/** @hidden */
UNCOV 25	public animationType: CarouselAnimationType = CarouselAnimationType.slide;	×
26
27	/** @hidden @internal */
UNCOV 28	public enterAnimationDone = new EventEmitter();	×
29	/** @hidden @internal */
UNCOV 30	public leaveAnimationDone = new EventEmitter();	×
31
32	/** @hidden */
33	protected currentItem: IgxSlideComponentBase;
34	/** @hidden */
35	protected previousItem: IgxSlideComponentBase;
36	/** @hidden */
37	protected enterAnimationPlayer?: AnimationPlayer;
38	/** @hidden */
39	protected leaveAnimationPlayer?: AnimationPlayer;
40	/** @hidden */
UNCOV 41	protected defaultAnimationDuration = 320;	×
42	/** @hidden */
UNCOV 43	protected animationPosition = 0;	×
44	/** @hidden */
UNCOV 45	protected newDuration = 0;	×
46	/** @hidden */
UNCOV 47	protected vertical = false;	×
48
49	constructor(
UNCOV 50	@Inject(IgxAngularAnimationService) private animationService: AnimationService,	×
UNCOV 51	protected cdr: ChangeDetectorRef) {	×
52	}
53
54	public ngOnDestroy(): void {
UNCOV 55	if (this.enterAnimationPlayer) {	×
UNCOV 56	this.enterAnimationPlayer.destroy();	×
UNCOV 57	this.enterAnimationPlayer = null;	×
58	}
UNCOV 59	if (this.leaveAnimationPlayer) {	×
UNCOV 60	this.leaveAnimationPlayer.destroy();	×
UNCOV 61	this.leaveAnimationPlayer = null;	×
62	}
63	}
64
65	/** @hidden */
66	protected triggerAnimations() {
UNCOV 67	if (this.animationType !== CarouselAnimationType.none) {	×
UNCOV 68	if (this.animationStarted(this.leaveAnimationPlayer) \|\| this.animationStarted(this.enterAnimationPlayer)) {	×
UNCOV 69	requestAnimationFrame(() => {	×
UNCOV 70	this.resetAnimations();	×
UNCOV 71	this.playAnimations();	×
72	});
73	} else {
UNCOV 74	this.playAnimations();	×
75	}
76	}
77	}
78
79	/** @hidden */
80	protected animationStarted(animation: AnimationPlayer): boolean {
UNCOV 81	return animation && animation.hasStarted();	×
82	}
83
84	/** @hidden */
85	protected playAnimations() {
UNCOV 86	this.playLeaveAnimation();	×
UNCOV 87	this.playEnterAnimation();	×
88	}
89
90	private resetAnimations() {
UNCOV 91	if (this.animationStarted(this.leaveAnimationPlayer)) {	×
92	this.leaveAnimationPlayer.reset();	×
93	this.leaveAnimationDone.emit();	×
94	}
95
UNCOV 96	if (this.animationStarted(this.enterAnimationPlayer)) {	×
97	this.enterAnimationPlayer.reset();	×
98	this.enterAnimationDone.emit();	×
99	this.cdr.markForCheck();	×
100	}
101	}
102
103	private getAnimation(): CarouselAnimationSettings {
104	let duration;
UNCOV 105	if (this.newDuration) {	×
106	duration = this.animationPosition ? this.animationPosition * this.newDuration : this.newDuration;	×
107	} else {
UNCOV 108	duration = this.animationPosition ? this.animationPosition * this.defaultAnimationDuration : this.defaultAnimationDuration;	×
109	}
110
UNCOV 111	const trans = this.animationPosition ? this.animationPosition * 100 : 100;	×
UNCOV 112	switch (this.animationType) {	×
113	case CarouselAnimationType.slide:
UNCOV 114	return {	×
115	enterAnimation: useAnimation(slideInLeft,
116	{
117	params: {
118	delay: '0s',
119	duration: `${duration}ms`,
120	endOpacity: 1,
121	startOpacity: 1,
122	fromPosition: `${this.vertical ? 'translateY' : 'translateX'}(${this.currentItem.direction === 1 ? trans : -trans}%)`,	×
123	toPosition: `${this.vertical ? 'translateY(0%)' : 'translateX(0%)'}`	×
124	}
125	}),
126	leaveAnimation: useAnimation(slideInLeft,
127	{
128	params: {
129	delay: '0s',
130	duration: `${duration}ms`,
131	endOpacity: 1,
132	startOpacity: 1,
133	fromPosition: `${this.vertical ? 'translateY(0%)' : 'translateX(0%)'}`,	×
134	toPosition: `${this.vertical ? 'translateY' : 'translateX'}(${this.currentItem.direction === 1 ? -trans : trans}%)`,	×
135	}
136	})
137	};
138	case CarouselAnimationType.fade:
UNCOV 139	return {	×
140	enterAnimation: useAnimation(fadeIn,
141	{ params: { duration: `${duration}ms`, startOpacity: `${this.animationPosition}` } }),
142	leaveAnimation: null
143	};
144	}
UNCOV 145	return {	×
146	enterAnimation: null,
147	leaveAnimation: null
148	};
149	}
150
151	private playEnterAnimation() {
UNCOV 152	const animation = this.getAnimation().enterAnimation;	×
UNCOV 153	if (!animation) {	×
UNCOV 154	return;	×
155	}
156
UNCOV 157	this.enterAnimationPlayer = this.animationService.buildAnimation(animation, this.getCurrentElement());	×
UNCOV 158	this.enterAnimationPlayer.animationEnd.subscribe(() => {	×
159	// TODO: animation may never end. Find better way to clean up the player
UNCOV 160	if (this.enterAnimationPlayer) {	×
UNCOV 161	this.enterAnimationPlayer.destroy();	×
UNCOV 162	this.enterAnimationPlayer = null;	×
163	}
UNCOV 164	this.animationPosition = 0;	×
UNCOV 165	this.newDuration = 0;	×
UNCOV 166	this.previousItem.previous = false;	×
UNCOV 167	this.enterAnimationDone.emit();	×
UNCOV 168	this.cdr.markForCheck();	×
169	});
UNCOV 170	this.previousItem.previous = true;	×
UNCOV 171	this.enterAnimationPlayer.play();	×
172	}
173
174	private playLeaveAnimation() {
UNCOV 175	const animation = this.getAnimation().leaveAnimation;	×
UNCOV 176	if (!animation) {	×
UNCOV 177	return;	×
178	}
179
UNCOV 180	this.leaveAnimationPlayer = this.animationService.buildAnimation(animation, this.getPreviousElement());	×
UNCOV 181	this.leaveAnimationPlayer.animationEnd.subscribe(() => {	×
182	// TODO: animation may never end. Find better way to clean up the player
UNCOV 183	if (this.leaveAnimationPlayer) {	×
UNCOV 184	this.leaveAnimationPlayer.destroy();	×
UNCOV 185	this.leaveAnimationPlayer = null;	×
186	}
UNCOV 187	this.animationPosition = 0;	×
UNCOV 188	this.newDuration = 0;	×
UNCOV 189	this.leaveAnimationDone.emit();	×
190	});
UNCOV 191	this.leaveAnimationPlayer.play();	×
192	}
193
194	protected abstract getPreviousElement(): HTMLElement;
195
196	protected abstract getCurrentElement(): HTMLElement;
197	}

IgniteUI / igniteui-angular / 16193550997

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous