71d2d27b-3e74-4086-8c85-ee638c1a0de6

Committed 20 Nov 2024 10:23AM UTC coverage: 90.355%. First build

Build # 71d2d27b-3e74-4086-8c85-ee638c1a0de6

Build Type

Pull #3264

circleci

Committed by

xinglu01

Commit Message

feat(dialog): support overlay sticky with dialogRef(#TINFR-602)

Pull Request Pull Request #3264: feat(dialog): support overlay toTop with dialogRef(#TINFR-602)

Run Details

5526 of 6766 branches covered (81.67%)

Branch coverage included in aggregate %.

6 of 6 new or added lines in 4 files covered. (100.0%)

13238 of 14001 relevant lines covered (94.55%)

994.38 hits per line

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

61.76

/src/shared/directives/thy-scroll.directive.ts

import { Directive, ElementRef, OnInit, NgZone, OnDestroy, Output, EventEmitter, Input, inject } from '@angular/core';
import { Subject, Observable, Observer, fromEvent, Subscription } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
import { coerceBooleanProperty } from 'ngx-tethys/util';

const passiveEventListenerOptions = <AddEventListenerOptions>normalizePassiveListenerOptions({ passive: true });

/**
 * @name thyScroll
 */
@Directive({
    selector: '[thyScroll]',
    standalone: true
})
export class ThyScrollDirective implements OnInit, OnDestroy {
    private elementRef = inject<ElementRef<any>>(ElementRef);
    private ngZone = inject(NgZone);

    private _destroyed = new Subject<void>();
    private _enable = true;
    private _initialled = false;
    private _subscription: Subscription;

    private _elementScrolled: Observable<Event> = new Observable((observer: Observer<Event>) =>
        this.ngZone.runOutsideAngular(() =>
            fromEvent(this.elementRef.nativeElement, 'scroll', passiveEventListenerOptions)
                .pipe(takeUntil(this._destroyed))
                .subscribe(observer)
        )
    );

    @Input({ transform: coerceBooleanProperty })
    set thyEnable(value: boolean) {
        this._enable = value;
        if (this._initialled) {
            if (this._enable && this._subscription === null) {
                this._subscription = this._elementScrolled.subscribe(() => this.thyOnScrolled.emit(this.elementRef));
            } else {
                if (this._subscription) {
                    this._subscription.unsubscribe();
                    this._subscription = null;
                }
            }
        }
    }

    /**
     * @description
     *
     * Note: the `thyOnScrolled` emits outside of the Angular zone since the `scroll` listener
     * is installed within the `<root>` zone.
     *
     * Consumers need to re-enter the Angular zone theirselves when the change detection is needeed to be run:
     * ```ts
     * @Component({
     *   template: '<div thyScroll (thyOnScrolled)="onScrolled()"></div>'
     * })
     * class ThyScrollComponent {
     *   onScrolled(): void {
     *     console.log(Zone.current); // <root>
     *     console.log(NgZone.isInAngularZone()); // false
     *   }
     * }
     * ```
     */
    @Output() thyOnScrolled: EventEmitter<ElementRef> = new EventEmitter<ElementRef>();

    ngOnInit() {
        if (this._enable) {
            this._subscription = this._elementScrolled.subscribe(() => this.thyOnScrolled.emit(this.elementRef));
        }
        this._initialled = true;
    }

    ngOnDestroy() {
        this._destroyed.next();
        this._destroyed.complete();
    }

    getElementRef(): ElementRef<HTMLElement> {
        return this.elementRef;
    }
}

1	import { Directive, ElementRef, OnInit, NgZone, OnDestroy, Output, EventEmitter, Input, inject } from '@angular/core';
2	import { Subject, Observable, Observer, fromEvent, Subscription } from 'rxjs';
3	import { takeUntil } from 'rxjs/operators';
4	import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
5	import { coerceBooleanProperty } from 'ngx-tethys/util';
6
7	const passiveEventListenerOptions = <AddEventListenerOptions>normalizePassiveListenerOptions({ passive: true });	1✔
8
9	/**
10	* @name thyScroll
11	*/	1✔
12	@Directive({
13	selector: '[thyScroll]',	72✔
14	standalone: true	72✔
15	})	72✔
16	export class ThyScrollDirective implements OnInit, OnDestroy {	72✔
17	private elementRef = inject<ElementRef<any>>(ElementRef);	72✔
18	private ngZone = inject(NgZone);	72✔
19
20	private _destroyed = new Subject<void>();
21	private _enable = true;	72✔
22	private _initialled = false;
23	private _subscription: Subscription;
24		72✔
25	private _elementScrolled: Observable<Event> = new Observable((observer: Observer<Event>) =>	72!
26	this.ngZone.runOutsideAngular(() =>	×
27	fromEvent(this.elementRef.nativeElement, 'scroll', passiveEventListenerOptions)	×
28	.pipe(takeUntil(this._destroyed))
29	.subscribe(observer)
30	)	×
31	);	×
32		×
33	@Input({ transform: coerceBooleanProperty })
34	set thyEnable(value: boolean) {
35	this._enable = value;
36	if (this._initialled) {
37	if (this._enable && this._subscription === null) {
38	this._subscription = this._elementScrolled.subscribe(() => this.thyOnScrolled.emit(this.elementRef));	72✔
39	} else {	6✔
40	if (this._subscription) {
41	this._subscription.unsubscribe();	72✔
42	this._subscription = null;
43	}
44	}	72✔
45	}	72✔
46	}
47
48	/**	×
49	* @description
50	*	1✔
51	* Note: the `thyOnScrolled` emits outside of the Angular zone since the `scroll` listener
52	* is installed within the `<root>` zone.
53	*
54	* Consumers need to re-enter the Angular zone theirselves when the change detection is needeed to be run:
55	* ```ts	1✔
56	* @Component({
57	* template: '<div thyScroll (thyOnScrolled)="onScrolled()"></div>'
58	* })
59	* class ThyScrollComponent {
60	* onScrolled(): void {
61	* console.log(Zone.current); // <root>
62	* console.log(NgZone.isInAngularZone()); // false
63	* }
64	* }
65	* ```
66	*/
67	@Output() thyOnScrolled: EventEmitter<ElementRef> = new EventEmitter<ElementRef>();
68
69	ngOnInit() {
70	if (this._enable) {
71	this._subscription = this._elementScrolled.subscribe(() => this.thyOnScrolled.emit(this.elementRef));
72	}
73	this._initialled = true;
74	}
75
76	ngOnDestroy() {
77	this._destroyed.next();
78	this._destroyed.complete();
79	}
80
81	getElementRef(): ElementRef<HTMLElement> {
82	return this.elementRef;
83	}
84	}

atinc / ngx-tethys / 71d2d27b-3e74-4086-8c85-ee638c1a0de6

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