cd64db52-e563-41a3-85f3-a0adb87ce135

Committed 30 Oct 2024 08:03AM UTC coverage: 90.402% (-0.04%) from 90.438%

Build # cd64db52-e563-41a3-85f3-a0adb87ce135

Build Type

push

circleci

Committed by

web-flow

Commit Message

refactor: refactor constructor to the inject function (#3222)

Run Details

5503 of 6730 branches covered (81.77%)

Branch coverage included in aggregate %.

422 of 429 new or added lines in 170 files covered. (98.37%)

344 existing lines in 81 files now uncovered.

13184 of 13941 relevant lines covered (94.57%)

997.19 hits per line

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

93.33

/src/input/input.component.ts

import { take } from 'rxjs/operators';

import { NgTemplateOutlet } from '@angular/common';
import {
    Component,
    ContentChild,
    ElementRef,
    EventEmitter,
    forwardRef,
    Input,
    NgZone,
    OnInit,
    Output,
    TemplateRef,
    ViewChild,
    ViewEncapsulation,
    inject
} from '@angular/core';
import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
import { ThyIcon } from 'ngx-tethys/icon';
import { ThyAutofocusDirective } from 'ngx-tethys/shared';
import { ThyInputDirective, ThyInputSize } from './input.directive';
import { coerceBooleanProperty } from 'ngx-tethys/util';

export const CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR: any = {
    provide: NG_VALUE_ACCESSOR,
    useExisting: forwardRef(() => ThyInput),
    multi: true
};

const noop = () => {};

const password = 'password';

/**
 * 内部集成输入框组件，建议 thy-input-group 和 thyInput 组合使用
 * @name thy-input
 * @order 50
 */
@Component({
    selector: 'thy-input',
    templateUrl: './input.component.html',
    providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR],
    encapsulation: ViewEncapsulation.None,
    host: {
        class: 'thy-input form-control',
        '[class.form-control-active]': 'focused',
        '[class.disabled]': 'disabled'
    },
    standalone: true,
    imports: [NgTemplateOutlet, ThyInputDirective, ThyAutofocusDirective, FormsModule, ThyIcon]
})
export class ThyInput implements ControlValueAccessor, OnInit {
    private ngZone = inject(NgZone);
    private elementRef = inject(ElementRef);

    /**
     * Placeholder
     */
    @Input() placeholder = '';

    /**
     * 输入框大小
     * @type 'xs' | 'sm' | 'md' | 'default' | 'lg'
     * @default default
     */
    @Input() thySize: ThyInputSize;

    /**
     * 是否自动聚焦
     */
    @Input({ transform: coerceBooleanProperty }) thyAutofocus = false;

    /**
     * 输入框类型
     * @type 'number' | 'input'
     */
    @Input()
    set thyType(value: string) {
        this.type = value;
    }

    /**
     * @deprecated please use thyType
     */
    @Input() type: string;

    /**
     * 输入 Label 文本
     */
    @Input() thyLabelText: string;

    /**
     * 是否只读
     */
    @Input({ transform: coerceBooleanProperty }) readonly = false;

    /**
     * focus 聚焦事件
     */
    @Output() focus: EventEmitter<Event> = new EventEmitter<Event>();

    /**
     * blur 失焦事件
     */
    @Output() blur: EventEmitter<Event> = new EventEmitter<Event>();

    /**
     * 后置模板
     */
    @ContentChild('append') appendTemplate: TemplateRef<any>;

    /**
     * 前置模板
     */
    @ContentChild('prepend') prependTemplate: TemplateRef<any>;

    @ViewChild('eye', { static: true }) eyeTemplate: TemplateRef<any>;

    public _type = 'text';

    public value: string;

    public showLabel: boolean;

    public focused = false;

    public disabled = false;

    private onTouchedCallback: () => void = noop;

    private onChangeCallback: (_: any) => void = noop;

    ngOnInit() {
        this.ngZone.onStable.pipe(take(1)).subscribe(() => {
            if (this.isPassword(this.type)) {
                this.appendTemplate = this.eyeTemplate;
            }
        });
    }

    writeValue(value: any): void {
        this.value = value;
    }

    registerOnChange(fn: any): void {
        this.onChangeCallback = fn;
    }

    registerOnTouched(fn: any): void {
        this.onTouchedCallback = fn;
    }

    setDisabledState?(isDisabled: boolean): void {
        this.disabled = isDisabled;
    }

    onModelChange() {
        this.onChangeCallback(this.value);
    }

    onInputFocus(event: Event) {
        this.focused = true;
        this.showLabel = true;
        this.focus.emit(event);
    }

    onInputBlur(event: Event) {
        this.onTouchedCallback();
        if (this.elementRef.nativeElement.onblur) {
            this.elementRef.nativeElement.onblur(event);
        }
        this.focused = false;
        this.showLabel = false;
        this.blur.emit(event);
    }

    isPassword(value: string) {
        return value === password;
    }

    togglePasswordType() {
        this.type = this.isPassword(this.type) ? 'text' : 'password';
    }
}

1	import { take } from 'rxjs/operators';
2
3	import { NgTemplateOutlet } from '@angular/common';
4	import {
5	Component,
6	ContentChild,
7	ElementRef,
8	EventEmitter,
9	forwardRef,
10	Input,
11	NgZone,	1✔
12	OnInit,
13	Output,	28✔
14	TemplateRef,
15	ViewChild,
16	ViewEncapsulation,	1✔
17	inject	1✔
18	} from '@angular/core';
19	import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
20	import { ThyIcon } from 'ngx-tethys/icon';
21	import { ThyAutofocusDirective } from 'ngx-tethys/shared';
22	import { ThyInputDirective, ThyInputSize } from './input.directive';
23	import { coerceBooleanProperty } from 'ngx-tethys/util';	1✔
24
25	export const CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR: any = {	42✔
26	provide: NG_VALUE_ACCESSOR,	42✔
27	useExisting: forwardRef(() => ThyInput),	42✔
28	multi: true	42✔
29	};	42✔
30		42✔
31	const noop = () => {};	42✔
32		42✔
33	const password = 'password';	42✔
34		42✔
35	/**	42✔
36	* 内部集成输入框组件，建议 thy-input-group 和 thyInput 组合使用	42✔
37	* @name thy-input
38	* @order 50
39	*/	29✔
40	@Component({
41	selector: 'thy-input',
42	templateUrl: './input.component.html',	42✔
43	providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR],	42✔
44	encapsulation: ViewEncapsulation.None,	14✔
45	host: {
46	class: 'thy-input form-control',
47	'[class.form-control-active]': 'focused',
48	'[class.disabled]': 'disabled'
49	},	56✔
50	standalone: true,
51	imports: [NgTemplateOutlet, ThyInputDirective, ThyAutofocusDirective, FormsModule, ThyIcon]
52	})	28✔
53	export class ThyInput implements ControlValueAccessor, OnInit {
54	private ngZone = inject(NgZone);
55	private elementRef = inject(ElementRef);	28✔
56
57	/**
58	* Placeholder	29✔
59	*/
60	@Input() placeholder = '';
UNCOV 61		×
62	/**
63	* 输入框大小
64	* @type 'xs' \| 'sm' \| 'md' \| 'default' \| 'lg'	1✔
65	* @default default	1✔
66	*/	1✔
67	@Input() thySize: ThyInputSize;
68
69	/**	1✔
70	* 是否自动聚焦	1!
UNCOV 71	*/	×
72	@Input({ transform: coerceBooleanProperty }) thyAutofocus = false;
73		1✔
74	/**	1✔
75	* 输入框类型	1✔
76	* @type 'number' \| 'input'
77	*/
78	@Input()	68✔
79	set thyType(value: string) {
80	this.type = value;
81	}	2✔
82
83	/**	1✔
84	* @deprecated please use thyType
85	*/
86	@Input() type: string;
87
88	/**
89	* 输入 Label 文本
90	*/
91	@Input() thyLabelText: string;
92
93	/**
94	* 是否只读
95	*/
96	@Input({ transform: coerceBooleanProperty }) readonly = false;
97
98	/**	1✔
99	* focus 聚焦事件
100	*/
101	@Output() focus: EventEmitter<Event> = new EventEmitter<Event>();
102
103	/**
104	* blur 失焦事件
105	*/
106	@Output() blur: EventEmitter<Event> = new EventEmitter<Event>();
107
108	/**
109	* 后置模板
110	*/
111	@ContentChild('append') appendTemplate: TemplateRef<any>;
112
113	/**
114	* 前置模板
115	*/
116	@ContentChild('prepend') prependTemplate: TemplateRef<any>;
117
118	@ViewChild('eye', { static: true }) eyeTemplate: TemplateRef<any>;
119
120	public _type = 'text';
121
122	public value: string;
123
124	public showLabel: boolean;
125
126	public focused = false;
127
128	public disabled = false;
129
130	private onTouchedCallback: () => void = noop;
131
132	private onChangeCallback: (_: any) => void = noop;
133
134	ngOnInit() {
135	this.ngZone.onStable.pipe(take(1)).subscribe(() => {
136	if (this.isPassword(this.type)) {
137	this.appendTemplate = this.eyeTemplate;
138	}
139	});
140	}
141
142	writeValue(value: any): void {
143	this.value = value;
144	}
145
146	registerOnChange(fn: any): void {
147	this.onChangeCallback = fn;
148	}
149
150	registerOnTouched(fn: any): void {
151	this.onTouchedCallback = fn;
152	}
153
154	setDisabledState?(isDisabled: boolean): void {
155	this.disabled = isDisabled;
156	}
157
158	onModelChange() {
159	this.onChangeCallback(this.value);
160	}
161
162	onInputFocus(event: Event) {
163	this.focused = true;
164	this.showLabel = true;
165	this.focus.emit(event);
166	}
167
168	onInputBlur(event: Event) {
169	this.onTouchedCallback();
170	if (this.elementRef.nativeElement.onblur) {
171	this.elementRef.nativeElement.onblur(event);
172	}
173	this.focused = false;
174	this.showLabel = false;
175	this.blur.emit(event);
176	}
177
178	isPassword(value: string) {
179	return value === password;
180	}
181
182	togglePasswordType() {
183	this.type = this.isPassword(this.type) ? 'text' : 'password';
184	}
185	}

atinc / ngx-tethys / cd64db52-e563-41a3-85f3-a0adb87ce135

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