1 | import { __awaiter } from 'tslib';
|
---|
2 | import { HarnessPredicate, parallel, ComponentHarness } from '@angular/cdk/testing';
|
---|
3 | import { MatFormFieldControlHarness } from '@angular/material/form-field/testing/control';
|
---|
4 |
|
---|
5 | /**
|
---|
6 | * @license
|
---|
7 | * Copyright Google LLC All Rights Reserved.
|
---|
8 | *
|
---|
9 | * Use of this source code is governed by an MIT-style license that can be
|
---|
10 | * found in the LICENSE file at https://angular.io/license
|
---|
11 | */
|
---|
12 | /** Harness for interacting with a standard Material inputs in tests. */
|
---|
13 | class MatInputHarness extends MatFormFieldControlHarness {
|
---|
14 | /**
|
---|
15 | * Gets a `HarnessPredicate` that can be used to search for a `MatInputHarness` that meets
|
---|
16 | * certain criteria.
|
---|
17 | * @param options Options for filtering which input instances are considered a match.
|
---|
18 | * @return a `HarnessPredicate` configured with the given options.
|
---|
19 | */
|
---|
20 | static with(options = {}) {
|
---|
21 | return new HarnessPredicate(MatInputHarness, options)
|
---|
22 | .addOption('value', options.value, (harness, value) => {
|
---|
23 | return HarnessPredicate.stringMatches(harness.getValue(), value);
|
---|
24 | })
|
---|
25 | .addOption('placeholder', options.placeholder, (harness, placeholder) => {
|
---|
26 | return HarnessPredicate.stringMatches(harness.getPlaceholder(), placeholder);
|
---|
27 | });
|
---|
28 | }
|
---|
29 | /** Whether the input is disabled. */
|
---|
30 | isDisabled() {
|
---|
31 | return __awaiter(this, void 0, void 0, function* () {
|
---|
32 | return (yield this.host()).getProperty('disabled');
|
---|
33 | });
|
---|
34 | }
|
---|
35 | /** Whether the input is required. */
|
---|
36 | isRequired() {
|
---|
37 | return __awaiter(this, void 0, void 0, function* () {
|
---|
38 | return (yield this.host()).getProperty('required');
|
---|
39 | });
|
---|
40 | }
|
---|
41 | /** Whether the input is readonly. */
|
---|
42 | isReadonly() {
|
---|
43 | return __awaiter(this, void 0, void 0, function* () {
|
---|
44 | return (yield this.host()).getProperty('readOnly');
|
---|
45 | });
|
---|
46 | }
|
---|
47 | /** Gets the value of the input. */
|
---|
48 | getValue() {
|
---|
49 | return __awaiter(this, void 0, void 0, function* () {
|
---|
50 | // The "value" property of the native input is never undefined.
|
---|
51 | return (yield (yield this.host()).getProperty('value'));
|
---|
52 | });
|
---|
53 | }
|
---|
54 | /** Gets the name of the input. */
|
---|
55 | getName() {
|
---|
56 | return __awaiter(this, void 0, void 0, function* () {
|
---|
57 | // The "name" property of the native input is never undefined.
|
---|
58 | return (yield (yield this.host()).getProperty('name'));
|
---|
59 | });
|
---|
60 | }
|
---|
61 | /**
|
---|
62 | * Gets the type of the input. Returns "textarea" if the input is
|
---|
63 | * a textarea.
|
---|
64 | */
|
---|
65 | getType() {
|
---|
66 | return __awaiter(this, void 0, void 0, function* () {
|
---|
67 | // The "type" property of the native input is never undefined.
|
---|
68 | return (yield (yield this.host()).getProperty('type'));
|
---|
69 | });
|
---|
70 | }
|
---|
71 | /** Gets the placeholder of the input. */
|
---|
72 | getPlaceholder() {
|
---|
73 | return __awaiter(this, void 0, void 0, function* () {
|
---|
74 | const host = yield this.host();
|
---|
75 | const [nativePlaceholder, fallback] = yield parallel(() => [
|
---|
76 | host.getProperty('placeholder'),
|
---|
77 | host.getAttribute('data-placeholder')
|
---|
78 | ]);
|
---|
79 | return nativePlaceholder || fallback || '';
|
---|
80 | });
|
---|
81 | }
|
---|
82 | /** Gets the id of the input. */
|
---|
83 | getId() {
|
---|
84 | return __awaiter(this, void 0, void 0, function* () {
|
---|
85 | // The input directive always assigns a unique id to the input in
|
---|
86 | // case no id has been explicitly specified.
|
---|
87 | return (yield (yield this.host()).getProperty('id'));
|
---|
88 | });
|
---|
89 | }
|
---|
90 | /**
|
---|
91 | * Focuses the input and returns a promise that indicates when the
|
---|
92 | * action is complete.
|
---|
93 | */
|
---|
94 | focus() {
|
---|
95 | return __awaiter(this, void 0, void 0, function* () {
|
---|
96 | return (yield this.host()).focus();
|
---|
97 | });
|
---|
98 | }
|
---|
99 | /**
|
---|
100 | * Blurs the input and returns a promise that indicates when the
|
---|
101 | * action is complete.
|
---|
102 | */
|
---|
103 | blur() {
|
---|
104 | return __awaiter(this, void 0, void 0, function* () {
|
---|
105 | return (yield this.host()).blur();
|
---|
106 | });
|
---|
107 | }
|
---|
108 | /** Whether the input is focused. */
|
---|
109 | isFocused() {
|
---|
110 | return __awaiter(this, void 0, void 0, function* () {
|
---|
111 | return (yield this.host()).isFocused();
|
---|
112 | });
|
---|
113 | }
|
---|
114 | /**
|
---|
115 | * Sets the value of the input. The value will be set by simulating
|
---|
116 | * keypresses that correspond to the given value.
|
---|
117 | */
|
---|
118 | setValue(newValue) {
|
---|
119 | return __awaiter(this, void 0, void 0, function* () {
|
---|
120 | const inputEl = yield this.host();
|
---|
121 | yield inputEl.clear();
|
---|
122 | // We don't want to send keys for the value if the value is an empty
|
---|
123 | // string in order to clear the value. Sending keys with an empty string
|
---|
124 | // still results in unnecessary focus events.
|
---|
125 | if (newValue) {
|
---|
126 | yield inputEl.sendKeys(newValue);
|
---|
127 | }
|
---|
128 | // Some input types won't respond to key presses (e.g. `color`) so to be sure that the
|
---|
129 | // value is set, we also set the property after the keyboard sequence. Note that we don't
|
---|
130 | // want to do it before, because it can cause the value to be entered twice.
|
---|
131 | yield inputEl.setInputValue(newValue);
|
---|
132 | });
|
---|
133 | }
|
---|
134 | }
|
---|
135 | // TODO: We do not want to handle `select` elements with `matNativeControl` because
|
---|
136 | // not all methods of this harness work reasonably for native select elements.
|
---|
137 | // For more details. See: https://github.com/angular/components/pull/18221.
|
---|
138 | MatInputHarness.hostSelector = '[matInput], input[matNativeControl], textarea[matNativeControl]';
|
---|
139 |
|
---|
140 | /**
|
---|
141 | * @license
|
---|
142 | * Copyright Google LLC All Rights Reserved.
|
---|
143 | *
|
---|
144 | * Use of this source code is governed by an MIT-style license that can be
|
---|
145 | * found in the LICENSE file at https://angular.io/license
|
---|
146 | */
|
---|
147 |
|
---|
148 | /**
|
---|
149 | * @license
|
---|
150 | * Copyright Google LLC All Rights Reserved.
|
---|
151 | *
|
---|
152 | * Use of this source code is governed by an MIT-style license that can be
|
---|
153 | * found in the LICENSE file at https://angular.io/license
|
---|
154 | */
|
---|
155 | /** Harness for interacting with a native `option` in tests. */
|
---|
156 | class MatNativeOptionHarness extends ComponentHarness {
|
---|
157 | /**
|
---|
158 | * Gets a `HarnessPredicate` that can be used to search for a `MatNativeOptionHarness` that meets
|
---|
159 | * certain criteria.
|
---|
160 | * @param options Options for filtering which option instances are considered a match.
|
---|
161 | * @return a `HarnessPredicate` configured with the given options.
|
---|
162 | */
|
---|
163 | static with(options = {}) {
|
---|
164 | return new HarnessPredicate(MatNativeOptionHarness, options)
|
---|
165 | .addOption('text', options.text, (harness, title) => __awaiter(this, void 0, void 0, function* () { return HarnessPredicate.stringMatches(yield harness.getText(), title); }))
|
---|
166 | .addOption('index', options.index, (harness, index) => __awaiter(this, void 0, void 0, function* () { return (yield harness.getIndex()) === index; }))
|
---|
167 | .addOption('isSelected', options.isSelected, (harness, isSelected) => __awaiter(this, void 0, void 0, function* () { return (yield harness.isSelected()) === isSelected; }));
|
---|
168 | }
|
---|
169 | /** Gets the option's label text. */
|
---|
170 | getText() {
|
---|
171 | return __awaiter(this, void 0, void 0, function* () {
|
---|
172 | return (yield this.host()).getProperty('label');
|
---|
173 | });
|
---|
174 | }
|
---|
175 | /** Index of the option within the native `select` element. */
|
---|
176 | getIndex() {
|
---|
177 | return __awaiter(this, void 0, void 0, function* () {
|
---|
178 | return (yield this.host()).getProperty('index');
|
---|
179 | });
|
---|
180 | }
|
---|
181 | /** Gets whether the option is disabled. */
|
---|
182 | isDisabled() {
|
---|
183 | return __awaiter(this, void 0, void 0, function* () {
|
---|
184 | return (yield this.host()).getProperty('disabled');
|
---|
185 | });
|
---|
186 | }
|
---|
187 | /** Gets whether the option is selected. */
|
---|
188 | isSelected() {
|
---|
189 | return __awaiter(this, void 0, void 0, function* () {
|
---|
190 | return (yield this.host()).getProperty('selected');
|
---|
191 | });
|
---|
192 | }
|
---|
193 | }
|
---|
194 | /** Selector used to locate option instances. */
|
---|
195 | MatNativeOptionHarness.hostSelector = 'select[matNativeControl] option';
|
---|
196 |
|
---|
197 | /**
|
---|
198 | * @license
|
---|
199 | * Copyright Google LLC All Rights Reserved.
|
---|
200 | *
|
---|
201 | * Use of this source code is governed by an MIT-style license that can be
|
---|
202 | * found in the LICENSE file at https://angular.io/license
|
---|
203 | */
|
---|
204 | /** Harness for interacting with a native `select` in tests. */
|
---|
205 | class MatNativeSelectHarness extends MatFormFieldControlHarness {
|
---|
206 | /**
|
---|
207 | * Gets a `HarnessPredicate` that can be used to search for a `MatNativeSelectHarness` that meets
|
---|
208 | * certain criteria.
|
---|
209 | * @param options Options for filtering which select instances are considered a match.
|
---|
210 | * @return a `HarnessPredicate` configured with the given options.
|
---|
211 | */
|
---|
212 | static with(options = {}) {
|
---|
213 | return new HarnessPredicate(MatNativeSelectHarness, options);
|
---|
214 | }
|
---|
215 | /** Gets a boolean promise indicating if the select is disabled. */
|
---|
216 | isDisabled() {
|
---|
217 | return __awaiter(this, void 0, void 0, function* () {
|
---|
218 | return (yield this.host()).getProperty('disabled');
|
---|
219 | });
|
---|
220 | }
|
---|
221 | /** Gets a boolean promise indicating if the select is required. */
|
---|
222 | isRequired() {
|
---|
223 | return __awaiter(this, void 0, void 0, function* () {
|
---|
224 | return (yield this.host()).getProperty('required');
|
---|
225 | });
|
---|
226 | }
|
---|
227 | /** Gets a boolean promise indicating if the select is in multi-selection mode. */
|
---|
228 | isMultiple() {
|
---|
229 | return __awaiter(this, void 0, void 0, function* () {
|
---|
230 | return (yield this.host()).getProperty('multiple');
|
---|
231 | });
|
---|
232 | }
|
---|
233 | /** Gets the name of the select. */
|
---|
234 | getName() {
|
---|
235 | return __awaiter(this, void 0, void 0, function* () {
|
---|
236 | // The "name" property of the native select is never undefined.
|
---|
237 | return (yield (yield this.host()).getProperty('name'));
|
---|
238 | });
|
---|
239 | }
|
---|
240 | /** Gets the id of the select. */
|
---|
241 | getId() {
|
---|
242 | return __awaiter(this, void 0, void 0, function* () {
|
---|
243 | // We're guaranteed to have an id, because the `matNativeControl` always assigns one.
|
---|
244 | return (yield (yield this.host()).getProperty('id'));
|
---|
245 | });
|
---|
246 | }
|
---|
247 | /** Focuses the select and returns a void promise that indicates when the action is complete. */
|
---|
248 | focus() {
|
---|
249 | return __awaiter(this, void 0, void 0, function* () {
|
---|
250 | return (yield this.host()).focus();
|
---|
251 | });
|
---|
252 | }
|
---|
253 | /** Blurs the select and returns a void promise that indicates when the action is complete. */
|
---|
254 | blur() {
|
---|
255 | return __awaiter(this, void 0, void 0, function* () {
|
---|
256 | return (yield this.host()).blur();
|
---|
257 | });
|
---|
258 | }
|
---|
259 | /** Whether the select is focused. */
|
---|
260 | isFocused() {
|
---|
261 | return __awaiter(this, void 0, void 0, function* () {
|
---|
262 | return (yield this.host()).isFocused();
|
---|
263 | });
|
---|
264 | }
|
---|
265 | /** Gets the options inside the select panel. */
|
---|
266 | getOptions(filter = {}) {
|
---|
267 | return __awaiter(this, void 0, void 0, function* () {
|
---|
268 | return this.locatorForAll(MatNativeOptionHarness.with(filter))();
|
---|
269 | });
|
---|
270 | }
|
---|
271 | /**
|
---|
272 | * Selects the options that match the passed-in filter. If the select is in multi-selection
|
---|
273 | * mode all options will be clicked, otherwise the harness will pick the first matching option.
|
---|
274 | */
|
---|
275 | selectOptions(filter = {}) {
|
---|
276 | return __awaiter(this, void 0, void 0, function* () {
|
---|
277 | const [isMultiple, options] = yield parallel(() => {
|
---|
278 | return [this.isMultiple(), this.getOptions(filter)];
|
---|
279 | });
|
---|
280 | if (options.length === 0) {
|
---|
281 | throw Error('Select does not have options matching the specified filter');
|
---|
282 | }
|
---|
283 | const [host, optionIndexes] = yield parallel(() => [
|
---|
284 | this.host(),
|
---|
285 | parallel(() => options.slice(0, isMultiple ? undefined : 1).map(option => option.getIndex()))
|
---|
286 | ]);
|
---|
287 | yield host.selectOptions(...optionIndexes);
|
---|
288 | });
|
---|
289 | }
|
---|
290 | }
|
---|
291 | MatNativeSelectHarness.hostSelector = 'select[matNativeControl]';
|
---|
292 |
|
---|
293 | /**
|
---|
294 | * @license
|
---|
295 | * Copyright Google LLC All Rights Reserved.
|
---|
296 | *
|
---|
297 | * Use of this source code is governed by an MIT-style license that can be
|
---|
298 | * found in the LICENSE file at https://angular.io/license
|
---|
299 | */
|
---|
300 |
|
---|
301 | /**
|
---|
302 | * @license
|
---|
303 | * Copyright Google LLC All Rights Reserved.
|
---|
304 | *
|
---|
305 | * Use of this source code is governed by an MIT-style license that can be
|
---|
306 | * found in the LICENSE file at https://angular.io/license
|
---|
307 | */
|
---|
308 |
|
---|
309 | /**
|
---|
310 | * @license
|
---|
311 | * Copyright Google LLC All Rights Reserved.
|
---|
312 | *
|
---|
313 | * Use of this source code is governed by an MIT-style license that can be
|
---|
314 | * found in the LICENSE file at https://angular.io/license
|
---|
315 | */
|
---|
316 |
|
---|
317 | export { MatInputHarness, MatNativeOptionHarness, MatNativeSelectHarness };
|
---|
318 | //# sourceMappingURL=testing.js.map
|
---|