| 1 | export * from '@angular/material/form-field/testing/control';
|
|---|
| 2 | import { __awaiter } from 'tslib';
|
|---|
| 3 | import { ComponentHarness, parallel, HarnessPredicate } from '@angular/cdk/testing';
|
|---|
| 4 | import { MatDatepickerInputHarness, MatDateRangeInputHarness } from '@angular/material/datepicker/testing';
|
|---|
| 5 | import { MatInputHarness } from '@angular/material/input/testing';
|
|---|
| 6 | import { MatSelectHarness } from '@angular/material/select/testing';
|
|---|
| 7 |
|
|---|
| 8 | /**
|
|---|
| 9 | * @license
|
|---|
| 10 | * Copyright Google LLC All Rights Reserved.
|
|---|
| 11 | *
|
|---|
| 12 | * Use of this source code is governed by an MIT-style license that can be
|
|---|
| 13 | * found in the LICENSE file at https://angular.io/license
|
|---|
| 14 | */
|
|---|
| 15 | class _MatFormFieldHarnessBase extends ComponentHarness {
|
|---|
| 16 | /** Gets the label of the form-field. */
|
|---|
| 17 | getLabel() {
|
|---|
| 18 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 19 | const labelEl = yield this._label();
|
|---|
| 20 | return labelEl ? labelEl.text() : null;
|
|---|
| 21 | });
|
|---|
| 22 | }
|
|---|
| 23 | /** Whether the form-field has errors. */
|
|---|
| 24 | hasErrors() {
|
|---|
| 25 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 26 | return (yield this.getTextErrors()).length > 0;
|
|---|
| 27 | });
|
|---|
| 28 | }
|
|---|
| 29 | /** Whether the form-field is disabled. */
|
|---|
| 30 | isDisabled() {
|
|---|
| 31 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 32 | return (yield this.host()).hasClass('mat-form-field-disabled');
|
|---|
| 33 | });
|
|---|
| 34 | }
|
|---|
| 35 | /** Whether the form-field is currently autofilled. */
|
|---|
| 36 | isAutofilled() {
|
|---|
| 37 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 38 | return (yield this.host()).hasClass('mat-form-field-autofilled');
|
|---|
| 39 | });
|
|---|
| 40 | }
|
|---|
| 41 | // Implementation of the "getControl" method overload signatures.
|
|---|
| 42 | getControl(type) {
|
|---|
| 43 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 44 | if (type) {
|
|---|
| 45 | return this.locatorForOptional(type)();
|
|---|
| 46 | }
|
|---|
| 47 | const [select, input, datepickerInput, dateRangeInput] = yield parallel(() => [
|
|---|
| 48 | this._selectControl(),
|
|---|
| 49 | this._inputControl(),
|
|---|
| 50 | this._datepickerInputControl(),
|
|---|
| 51 | this._dateRangeInputControl()
|
|---|
| 52 | ]);
|
|---|
| 53 | // Match the datepicker inputs first since they can also have a `MatInput`.
|
|---|
| 54 | return datepickerInput || dateRangeInput || select || input;
|
|---|
| 55 | });
|
|---|
| 56 | }
|
|---|
| 57 | /** Gets the theme color of the form-field. */
|
|---|
| 58 | getThemeColor() {
|
|---|
| 59 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 60 | const hostEl = yield this.host();
|
|---|
| 61 | const [isAccent, isWarn] = yield parallel(() => {
|
|---|
| 62 | return [hostEl.hasClass('mat-accent'), hostEl.hasClass('mat-warn')];
|
|---|
| 63 | });
|
|---|
| 64 | if (isAccent) {
|
|---|
| 65 | return 'accent';
|
|---|
| 66 | }
|
|---|
| 67 | else if (isWarn) {
|
|---|
| 68 | return 'warn';
|
|---|
| 69 | }
|
|---|
| 70 | return 'primary';
|
|---|
| 71 | });
|
|---|
| 72 | }
|
|---|
| 73 | /** Gets error messages which are currently displayed in the form-field. */
|
|---|
| 74 | getTextErrors() {
|
|---|
| 75 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 76 | const errors = yield this._errors();
|
|---|
| 77 | return parallel(() => errors.map(e => e.text()));
|
|---|
| 78 | });
|
|---|
| 79 | }
|
|---|
| 80 | /** Gets hint messages which are currently displayed in the form-field. */
|
|---|
| 81 | getTextHints() {
|
|---|
| 82 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 83 | const hints = yield this._hints();
|
|---|
| 84 | return parallel(() => hints.map(e => e.text()));
|
|---|
| 85 | });
|
|---|
| 86 | }
|
|---|
| 87 | /**
|
|---|
| 88 | * Gets a reference to the container element which contains all projected
|
|---|
| 89 | * prefixes of the form-field.
|
|---|
| 90 | * @deprecated Use `getPrefixText` instead.
|
|---|
| 91 | * @breaking-change 11.0.0
|
|---|
| 92 | */
|
|---|
| 93 | getHarnessLoaderForPrefix() {
|
|---|
| 94 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 95 | return this._prefixContainer();
|
|---|
| 96 | });
|
|---|
| 97 | }
|
|---|
| 98 | /** Gets the text inside the prefix element. */
|
|---|
| 99 | getPrefixText() {
|
|---|
| 100 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 101 | const prefix = yield this._prefixContainer();
|
|---|
| 102 | return prefix ? prefix.text() : '';
|
|---|
| 103 | });
|
|---|
| 104 | }
|
|---|
| 105 | /**
|
|---|
| 106 | * Gets a reference to the container element which contains all projected
|
|---|
| 107 | * suffixes of the form-field.
|
|---|
| 108 | * @deprecated Use `getSuffixText` instead.
|
|---|
| 109 | * @breaking-change 11.0.0
|
|---|
| 110 | */
|
|---|
| 111 | getHarnessLoaderForSuffix() {
|
|---|
| 112 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 113 | return this._suffixContainer();
|
|---|
| 114 | });
|
|---|
| 115 | }
|
|---|
| 116 | /** Gets the text inside the suffix element. */
|
|---|
| 117 | getSuffixText() {
|
|---|
| 118 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 119 | const suffix = yield this._suffixContainer();
|
|---|
| 120 | return suffix ? suffix.text() : '';
|
|---|
| 121 | });
|
|---|
| 122 | }
|
|---|
| 123 | /**
|
|---|
| 124 | * Whether the form control has been touched. Returns "null"
|
|---|
| 125 | * if no form control is set up.
|
|---|
| 126 | */
|
|---|
| 127 | isControlTouched() {
|
|---|
| 128 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 129 | if (!(yield this._hasFormControl())) {
|
|---|
| 130 | return null;
|
|---|
| 131 | }
|
|---|
| 132 | return (yield this.host()).hasClass('ng-touched');
|
|---|
| 133 | });
|
|---|
| 134 | }
|
|---|
| 135 | /**
|
|---|
| 136 | * Whether the form control is dirty. Returns "null"
|
|---|
| 137 | * if no form control is set up.
|
|---|
| 138 | */
|
|---|
| 139 | isControlDirty() {
|
|---|
| 140 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 141 | if (!(yield this._hasFormControl())) {
|
|---|
| 142 | return null;
|
|---|
| 143 | }
|
|---|
| 144 | return (yield this.host()).hasClass('ng-dirty');
|
|---|
| 145 | });
|
|---|
| 146 | }
|
|---|
| 147 | /**
|
|---|
| 148 | * Whether the form control is valid. Returns "null"
|
|---|
| 149 | * if no form control is set up.
|
|---|
| 150 | */
|
|---|
| 151 | isControlValid() {
|
|---|
| 152 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 153 | if (!(yield this._hasFormControl())) {
|
|---|
| 154 | return null;
|
|---|
| 155 | }
|
|---|
| 156 | return (yield this.host()).hasClass('ng-valid');
|
|---|
| 157 | });
|
|---|
| 158 | }
|
|---|
| 159 | /**
|
|---|
| 160 | * Whether the form control is pending validation. Returns "null"
|
|---|
| 161 | * if no form control is set up.
|
|---|
| 162 | */
|
|---|
| 163 | isControlPending() {
|
|---|
| 164 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 165 | if (!(yield this._hasFormControl())) {
|
|---|
| 166 | return null;
|
|---|
| 167 | }
|
|---|
| 168 | return (yield this.host()).hasClass('ng-pending');
|
|---|
| 169 | });
|
|---|
| 170 | }
|
|---|
| 171 | /** Checks whether the form-field control has set up a form control. */
|
|---|
| 172 | _hasFormControl() {
|
|---|
| 173 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 174 | const hostEl = yield this.host();
|
|---|
| 175 | // If no form "NgControl" is bound to the form-field control, the form-field
|
|---|
| 176 | // is not able to forward any control status classes. Therefore if either the
|
|---|
| 177 | // "ng-touched" or "ng-untouched" class is set, we know that it has a form control
|
|---|
| 178 | const [isTouched, isUntouched] = yield parallel(() => [hostEl.hasClass('ng-touched'), hostEl.hasClass('ng-untouched')]);
|
|---|
| 179 | return isTouched || isUntouched;
|
|---|
| 180 | });
|
|---|
| 181 | }
|
|---|
| 182 | }
|
|---|
| 183 | /** Harness for interacting with a standard Material form-field's in tests. */
|
|---|
| 184 | class MatFormFieldHarness extends _MatFormFieldHarnessBase {
|
|---|
| 185 | constructor() {
|
|---|
| 186 | super(...arguments);
|
|---|
| 187 | this._prefixContainer = this.locatorForOptional('.mat-form-field-prefix');
|
|---|
| 188 | this._suffixContainer = this.locatorForOptional('.mat-form-field-suffix');
|
|---|
| 189 | this._label = this.locatorForOptional('.mat-form-field-label');
|
|---|
| 190 | this._errors = this.locatorForAll('.mat-error');
|
|---|
| 191 | this._hints = this.locatorForAll('mat-hint, .mat-hint');
|
|---|
| 192 | this._inputControl = this.locatorForOptional(MatInputHarness);
|
|---|
| 193 | this._selectControl = this.locatorForOptional(MatSelectHarness);
|
|---|
| 194 | this._datepickerInputControl = this.locatorForOptional(MatDatepickerInputHarness);
|
|---|
| 195 | this._dateRangeInputControl = this.locatorForOptional(MatDateRangeInputHarness);
|
|---|
| 196 | }
|
|---|
| 197 | /**
|
|---|
| 198 | * Gets a `HarnessPredicate` that can be used to search for a `MatFormFieldHarness` that meets
|
|---|
| 199 | * certain criteria.
|
|---|
| 200 | * @param options Options for filtering which form field instances are considered a match.
|
|---|
| 201 | * @return a `HarnessPredicate` configured with the given options.
|
|---|
| 202 | */
|
|---|
| 203 | static with(options = {}) {
|
|---|
| 204 | return new HarnessPredicate(MatFormFieldHarness, options)
|
|---|
| 205 | .addOption('floatingLabelText', options.floatingLabelText, (harness, text) => __awaiter(this, void 0, void 0, function* () { return HarnessPredicate.stringMatches(yield harness.getLabel(), text); }))
|
|---|
| 206 | .addOption('hasErrors', options.hasErrors, (harness, hasErrors) => __awaiter(this, void 0, void 0, function* () { return (yield harness.hasErrors()) === hasErrors; }));
|
|---|
| 207 | }
|
|---|
| 208 | /** Gets the appearance of the form-field. */
|
|---|
| 209 | getAppearance() {
|
|---|
| 210 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 211 | const hostClasses = yield (yield this.host()).getAttribute('class');
|
|---|
| 212 | if (hostClasses !== null) {
|
|---|
| 213 | const appearanceMatch = hostClasses.match(/mat-form-field-appearance-(legacy|standard|fill|outline)(?:$| )/);
|
|---|
| 214 | if (appearanceMatch) {
|
|---|
| 215 | return appearanceMatch[1];
|
|---|
| 216 | }
|
|---|
| 217 | }
|
|---|
| 218 | throw Error('Could not determine appearance of form-field.');
|
|---|
| 219 | });
|
|---|
| 220 | }
|
|---|
| 221 | /** Whether the form-field has a label. */
|
|---|
| 222 | hasLabel() {
|
|---|
| 223 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 224 | return (yield this.host()).hasClass('mat-form-field-has-label');
|
|---|
| 225 | });
|
|---|
| 226 | }
|
|---|
| 227 | /** Whether the label is currently floating. */
|
|---|
| 228 | isLabelFloating() {
|
|---|
| 229 | return __awaiter(this, void 0, void 0, function* () {
|
|---|
| 230 | const host = yield this.host();
|
|---|
| 231 | const [hasLabel, shouldFloat] = yield parallel(() => [
|
|---|
| 232 | this.hasLabel(),
|
|---|
| 233 | host.hasClass('mat-form-field-should-float'),
|
|---|
| 234 | ]);
|
|---|
| 235 | // If there is no label, the label conceptually can never float. The `should-float` class
|
|---|
| 236 | // is just always set regardless of whether the label is displayed or not.
|
|---|
| 237 | return hasLabel && shouldFloat;
|
|---|
| 238 | });
|
|---|
| 239 | }
|
|---|
| 240 | }
|
|---|
| 241 | MatFormFieldHarness.hostSelector = '.mat-form-field';
|
|---|
| 242 |
|
|---|
| 243 | /**
|
|---|
| 244 | * @license
|
|---|
| 245 | * Copyright Google LLC All Rights Reserved.
|
|---|
| 246 | *
|
|---|
| 247 | * Use of this source code is governed by an MIT-style license that can be
|
|---|
| 248 | * found in the LICENSE file at https://angular.io/license
|
|---|
| 249 | */
|
|---|
| 250 |
|
|---|
| 251 | /**
|
|---|
| 252 | * @license
|
|---|
| 253 | * Copyright Google LLC All Rights Reserved.
|
|---|
| 254 | *
|
|---|
| 255 | * Use of this source code is governed by an MIT-style license that can be
|
|---|
| 256 | * found in the LICENSE file at https://angular.io/license
|
|---|
| 257 | */
|
|---|
| 258 |
|
|---|
| 259 | /**
|
|---|
| 260 | * @license
|
|---|
| 261 | * Copyright Google LLC All Rights Reserved.
|
|---|
| 262 | *
|
|---|
| 263 | * Use of this source code is governed by an MIT-style license that can be
|
|---|
| 264 | * found in the LICENSE file at https://angular.io/license
|
|---|
| 265 | */
|
|---|
| 266 |
|
|---|
| 267 | export { MatFormFieldHarness, _MatFormFieldHarnessBase };
|
|---|
| 268 | //# sourceMappingURL=testing.js.map
|
|---|
