@skbkontur/playwright-react-ui-components 1.13.2 → 1.14.0-beta.2

package/build/src/components/RadioGroup.js

@@ -50,6 +50,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RadioGroup = void 0;
 var react_ui_1 = require("@skbkontur/react-ui");
@@ -59,20 +60,22 @@ var ComponentList_1 = require("./ComponentList");
 var Radio_1 = require("./Radio");
 var utils_1 = require("../utils");
 var dataTidSelector_1 = require("../utils/dataTidSelector");
+var LocatorSymbols_1 = require("../matchers/component/LocatorSymbols");
 var RadioGroup = /** @class */ (function (_super) {
     __extends(RadioGroup, _super);
     function RadioGroup(rootLocator) {
         var _this = _super.call(this, rootLocator) || this;
         _this.rootLocator = rootLocator;
+        _this[_a] = function () { return _this.rootLocator; };
         _this.list = new ComponentList_1.ComponentList(rootLocator, function (rootLocator) { return rootLocator.locator((0, dataTidSelector_1.getDataTidSelector)(react_ui_1.RadioDataTids.root)); }, function (rootLocator) { return new Radio_1.Radio(rootLocator); });
         return _this;
     }
     RadioGroup.prototype.getItems = function () {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.list.getItems()];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _b.sent()];
                 }
             });
         });
@@ -80,22 +83,22 @@ var RadioGroup = /** @class */ (function (_super) {
     RadioGroup.prototype.isDisabled = function () {
         return __awaiter(this, void 0, void 0, function () {
             var radioList, _i, radioList_1, radio;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.getItems()];
                     case 1:
-                        radioList = _a.sent();
+                        radioList = _b.sent();
                         _i = 0, radioList_1 = radioList;
-                        _a.label = 2;
+                        _b.label = 2;
                     case 2:
                         if (!(_i < radioList_1.length)) return [3 /*break*/, 5];
                         radio = radioList_1[_i];
                         return [4 /*yield*/, radio.isDisabled()];
                     case 3:
-                        if (!(_a.sent())) {
+                        if (!(_b.sent())) {
                             return [2 /*return*/, false];
                         }
-                        _a.label = 4;
+                        _b.label = 4;
                     case 4:
                         _i++;
                         return [3 /*break*/, 2];
@@ -107,14 +110,14 @@ var RadioGroup = /** @class */ (function (_super) {
     RadioGroup.prototype.checkByValue = function (value) {
         return __awaiter(this, void 0, void 0, function () {
             var radio;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.getByValue(value)];
                     case 1:
-                        radio = _a.sent();
+                        radio = _b.sent();
                         return [4 /*yield*/, radio.check()];
                     case 2:
-                        _a.sent();
+                        _b.sent();
                         return [2 /*return*/];
                 }
             });
@@ -123,14 +126,14 @@ var RadioGroup = /** @class */ (function (_super) {
     RadioGroup.prototype.checkByIndex = function (index) {
         return __awaiter(this, void 0, void 0, function () {
             var radio;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.getByIndex(index)];
                     case 1:
-                        radio = _a.sent();
+                        radio = _b.sent();
                         return [4 /*yield*/, radio.check()];
                     case 2:
-                        _a.sent();
+                        _b.sent();
                         return [2 /*return*/];
                 }
             });
@@ -139,14 +142,14 @@ var RadioGroup = /** @class */ (function (_super) {
     RadioGroup.prototype.checkByText = function (text) {
         return __awaiter(this, void 0, void 0, function () {
             var radio;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.getByText(text)];
                     case 1:
-                        radio = _a.sent();
+                        radio = _b.sent();
                         return [4 /*yield*/, radio.check()];
                     case 2:
-                        _a.sent();
+                        _b.sent();
                         return [2 /*return*/];
                 }
             });
@@ -155,15 +158,15 @@ var RadioGroup = /** @class */ (function (_super) {
     RadioGroup.prototype.getCheckedRadio = function () {
         return __awaiter(this, void 0, void 0, function () {
             var _this = this;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.list.getFirstItemByPredicate(function (radio) { return __awaiter(_this, void 0, void 0, function () { return __generator(this, function (_a) {
-                            switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0: return [4 /*yield*/, this.list.getFirstItemByPredicate(function (radio) { return __awaiter(_this, void 0, void 0, function () { return __generator(this, function (_b) {
+                            switch (_b.label) {
                                 case 0: return [4 /*yield*/, radio.isChecked()];
-                                case 1: return [2 /*return*/, _a.sent()];
+                                case 1: return [2 /*return*/, _b.sent()];
                             }
                         }); }); })];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _b.sent()];
                 }
             });
         });
@@ -171,27 +174,27 @@ var RadioGroup = /** @class */ (function (_super) {
     RadioGroup.prototype.getByValue = function (value) {
         return __awaiter(this, void 0, void 0, function () {
             var _this = this;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.list.getFirstItemByPredicate(function (radio) { return __awaiter(_this, void 0, void 0, function () { var _a; return __generator(this, function (_b) {
-                            switch (_b.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0: return [4 /*yield*/, this.list.getFirstItemByPredicate(function (radio) { return __awaiter(_this, void 0, void 0, function () { var _b; return __generator(this, function (_c) {
+                            switch (_c.label) {
                                 case 0:
-                                    _a = Boolean;
+                                    _b = Boolean;
                                     return [4 /*yield*/, radio.getValue()];
-                                case 1: return [2 /*return*/, _a.apply(void 0, [(_b.sent()).match(value)])];
+                                case 1: return [2 /*return*/, _b.apply(void 0, [(_c.sent()).match(value)])];
                             }
                         }); }); })];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _b.sent()];
                 }
             });
         });
     };
     RadioGroup.prototype.getByIndex = function (index) {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, this.list.getItemByIndex(index)];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _b.sent()];
                 }
             });
         });
@@ -199,27 +202,27 @@ var RadioGroup = /** @class */ (function (_super) {
     RadioGroup.prototype.getByText = function (text) {
         return __awaiter(this, void 0, void 0, function () {
             var _this = this;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.list.getFirstItemByPredicate(function (radio) { return __awaiter(_this, void 0, void 0, function () { var _a; return __generator(this, function (_b) {
-                            switch (_b.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0: return [4 /*yield*/, this.list.getFirstItemByPredicate(function (radio) { return __awaiter(_this, void 0, void 0, function () { var _b; return __generator(this, function (_c) {
+                            switch (_c.label) {
                                 case 0:
-                                    _a = Boolean;
+                                    _b = Boolean;
                                     return [4 /*yield*/, radio.getText()];
-                                case 1: return [2 /*return*/, _a.apply(void 0, [(_b.sent()).match(text)])];
+                                case 1: return [2 /*return*/, _b.apply(void 0, [(_c.sent()).match(text)])];
                             }
                         }); }); })];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _b.sent()];
                 }
             });
         });
     };
     RadioGroup.prototype.getTooltip = function (type) {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0: return [4 /*yield*/, (0, utils_1.getTooltip)(type, this)];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _b.sent()];
                 }
             });
         });
@@ -230,3 +233,4 @@ var RadioGroup = /** @class */ (function (_super) {
     return RadioGroup;
 }(BaseComponent_1.BaseComponent));
 exports.RadioGroup = RadioGroup;
+_a = LocatorSymbols_1.toControlElementLocator;

package/build/src/components/Select.d.ts

@@ -5,11 +5,16 @@ import type { TooltipType } from '../utils';
 import { ComponentList } from './ComponentList';
 import { MenuItem } from './MenuItem';
 import type { BlurOptions, ClickOptions, FillOptions, FocusOptions, InnerTextOptions } from '../options';
+import { toControlElementLocator, toValueElementLocator, toFocusableElementLocator } from '../matchers/component/LocatorSymbols';
 export declare class Select extends BaseComponent {
     private readonly portal;
     readonly buttonOrLinkLocator: Locator;
     readonly selectLabelLocator: Locator;
+    readonly [toControlElementLocator]: () => Locator;
+    readonly [toValueElementLocator]: () => Promise<Locator>;
+    readonly [toFocusableElementLocator]: () => Locator;
     constructor(rootLocator: Locator);
+    private getValueLocator;
     isDisabled(): Promise<boolean>;
     isMenuOpened(): Promise<boolean>;
     isLinkSelect(): Promise<boolean>;

package/build/src/components/Select.js

@@ -50,6 +50,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+var _a, _b, _c;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = void 0;
 var react_ui_1 = require("@skbkontur/react-ui");
@@ -63,10 +64,14 @@ var utils_2 = require("../utils");
 var ComponentList_1 = require("./ComponentList");
 var MenuItem_1 = require("./MenuItem");
 var dataTidSelector_1 = require("../utils/dataTidSelector");
+var LocatorSymbols_1 = require("../matchers/component/LocatorSymbols");
 var Select = /** @class */ (function (_super) {
     __extends(Select, _super);
     function Select(rootLocator) {
         var _this = _super.call(this, rootLocator) || this;
+        _this[_a] = function () { return _this.buttonOrLinkLocator; };
+        _this[_b] = function () { return _this.getValueLocator(); };
+        _this[_c] = function () { return _this.buttonOrLinkLocator; };
         _this.portal = new Portal_1.Portal(rootLocator.locator('noscript'));
         _this.buttonOrLinkLocator = rootLocator
             .locator('button')
@@ -74,50 +79,60 @@ var Select = /** @class */ (function (_super) {
         _this.selectLabelLocator = rootLocator.locator((0, dataTidSelector_1.getDataTidSelector)(react_ui_1.SelectDataTids.label));
         return _this;
     }
+    Select.prototype.getValueLocator = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
+                    case 0: return [4 /*yield*/, this.isLinkSelect()];
+                    case 1: return [2 /*return*/, (_d.sent()) ? this.buttonOrLinkLocator : this.selectLabelLocator];
+                }
+            });
+        });
+    };
     Select.prototype.isDisabled = function () {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.isLinkSelect()];
                     case 1:
-                        if (!_a.sent()) return [3 /*break*/, 4];
+                        if (!_d.sent()) return [3 /*break*/, 4];
                         return [4 /*yield*/, this.waitFor()];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [4 /*yield*/, this.buttonOrLinkLocator.getAttribute(utils_1.DataVisualState.Disabled)];
-                    case 3: return [2 /*return*/, (_a.sent()) !== null];
+                    case 3: return [2 /*return*/, (_d.sent()) !== null];
                     case 4: return [4 /*yield*/, this.buttonOrLinkLocator.isDisabled()];
-                    case 5: return [2 /*return*/, _a.sent()];
+                    case 5: return [2 /*return*/, _d.sent()];
                 }
             });
         });
     };
     Select.prototype.isMenuOpened = function () {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.portal.isVisible()];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _d.sent()];
                 }
             });
         });
     };
     Select.prototype.isLinkSelect = function () {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.buttonOrLinkLocator.getAttribute('type')];
-                    case 1: return [2 /*return*/, (_a.sent()) !== 'button'];
+                    case 1: return [2 /*return*/, (_d.sent()) !== 'button'];
                 }
             });
         });
     };
     Select.prototype.getSelectedValue = function (options) {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.buttonOrLinkLocator.innerText(options)];
-                    case 1: return [2 /*return*/, _a.sent()];
+                    case 1: return [2 /*return*/, _d.sent()];
                 }
             });
         });
@@ -125,14 +140,14 @@ var Select = /** @class */ (function (_super) {
     Select.prototype.fillSearch = function (searchText, options) {
         return __awaiter(this, void 0, void 0, function () {
             var searchInput;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getSearchInput()];
                     case 1:
-                        searchInput = _a.sent();
+                        searchInput = _d.sent();
                         return [4 /*yield*/, searchInput.fill(searchText, options)];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/];
                 }
             });
@@ -145,14 +160,14 @@ var Select = /** @class */ (function (_super) {
     Select.prototype.selectFirst = function (text, options) {
         return __awaiter(this, void 0, void 0, function () {
             var items;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getMenuItemsLocator(text)];
                     case 1:
-                        items = _a.sent();
+                        items = _d.sent();
                         return [4 /*yield*/, items.first().click(options)];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/];
                 }
             });
@@ -161,17 +176,17 @@ var Select = /** @class */ (function (_super) {
     Select.prototype.select = function (text, options) {
         return __awaiter(this, void 0, void 0, function () {
             var items;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getMenuItemsLocator(text)];
                     case 1:
-                        items = _a.sent();
+                        items = _d.sent();
                         return [4 /*yield*/, (0, test_1.expect)(items).toHaveCount(1)];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [4 /*yield*/, items.click(options)];
                     case 3:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/];
                 }
             });
@@ -179,14 +194,14 @@ var Select = /** @class */ (function (_super) {
     };
     Select.prototype.focus = function (options) {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.waitEnabled()];
                     case 1:
-                        _a.sent();
+                        _d.sent();
                         return [4 /*yield*/, this.buttonOrLinkLocator.focus(options)];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/];
                 }
             });
@@ -194,11 +209,11 @@ var Select = /** @class */ (function (_super) {
     };
     Select.prototype.blur = function (options) {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.buttonOrLinkLocator.blur(options)];
                     case 1:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/];
                 }
             });
@@ -206,8 +221,8 @@ var Select = /** @class */ (function (_super) {
     };
     Select.prototype.click = function (options) {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: 
                     // note: rootLocator всегда в состоянии enabled, даже если Select disabled
                     // чтобы не было гонок дожидаемся доступности компонента, перед тем как взаимодействовать с ним
@@ -215,10 +230,10 @@ var Select = /** @class */ (function (_super) {
                     case 1:
                         // note: rootLocator всегда в состоянии enabled, даже если Select disabled
                         // чтобы не было гонок дожидаемся доступности компонента, перед тем как взаимодействовать с ним
-                        _a.sent();
+                        _d.sent();
                         return [4 /*yield*/, _super.prototype.click.call(this, options)];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/];
                 }
             });
@@ -226,11 +241,11 @@ var Select = /** @class */ (function (_super) {
     };
     Select.prototype.getTooltip = function (type) {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.click()];
                     case 1:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/, (0, utils_2.getTooltip)(type, this)];
                 }
             });
@@ -245,14 +260,14 @@ var Select = /** @class */ (function (_super) {
     Select.prototype.getMenuItems = function () {
         return __awaiter(this, void 0, void 0, function () {
             var container;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getPortalContainer()];
                     case 1:
-                        container = _a.sent();
+                        container = _d.sent();
                         return [4 /*yield*/, container.locator((0, dataTidSelector_1.getDataTidSelector)(react_ui_1.SpinnerDataTids.root)).waitFor({ state: 'hidden' })];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/, new ComponentList_1.ComponentList(container, function (locator) {
                                 return locator
                                     .locator((0, dataTidSelector_1.getDataTidSelector)(react_ui_1.MenuItemDataTids.root))
@@ -267,23 +282,23 @@ var Select = /** @class */ (function (_super) {
         return __awaiter(this, void 0, void 0, function () {
             var items;
             var _this = this;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getMenuItems()];
                     case 1:
-                        items = _a.sent();
+                        items = _d.sent();
                         return [4 /*yield*/, items.getFirstItemByPredicate(function (item) { return __awaiter(_this, void 0, void 0, function () {
                                 var itemText;
-                                return __generator(this, function (_a) {
-                                    switch (_a.label) {
+                                return __generator(this, function (_d) {
+                                    switch (_d.label) {
                                         case 0: return [4 /*yield*/, item.getText()];
                                         case 1:
-                                            itemText = _a.sent();
+                                            itemText = _d.sent();
                                             return [2 /*return*/, itemText.toLowerCase() === text.toLowerCase()];
                                     }
                                 });
                             }); })];
-                    case 2: return [2 /*return*/, _a.sent()];
+                    case 2: return [2 /*return*/, _d.sent()];
                 }
             });
         });
@@ -291,11 +306,11 @@ var Select = /** @class */ (function (_super) {
     Select.prototype.getMenuItemByIndex = function (index) {
         return __awaiter(this, void 0, void 0, function () {
             var items;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getMenuItems()];
                     case 1:
-                        items = _a.sent();
+                        items = _d.sent();
                         return [2 /*return*/, items.getItemByIndex(index)];
                 }
             });
@@ -307,11 +322,11 @@ var Select = /** @class */ (function (_super) {
     Select.prototype.getMenuItemsLocator = function (byText) {
         return __awaiter(this, void 0, void 0, function () {
             var container, items;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getPortalContainer()];
                     case 1:
-                        container = _a.sent();
+                        container = _d.sent();
                         items = container.locator((0, dataTidSelector_1.getDataTidSelector)(react_ui_1.MenuItemDataTids.root));
                         return [2 /*return*/, items.getByText(byText)];
                 }
@@ -321,11 +336,11 @@ var Select = /** @class */ (function (_super) {
     Select.prototype.getSearchInput = function () {
         return __awaiter(this, void 0, void 0, function () {
             var container;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.getPortalContainer()];
                     case 1:
-                        container = _a.sent();
+                        container = _d.sent();
                         return [2 /*return*/, container.locator((0, dataTidSelector_1.getDataTidSelector)(react_ui_1.InputDataTids.root))];
                 }
             });
@@ -333,11 +348,11 @@ var Select = /** @class */ (function (_super) {
     };
     Select.prototype.getPortalContainer = function () {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.openMenuIfNeeded()];
                     case 1:
-                        _a.sent();
+                        _d.sent();
                         return [2 /*return*/, this.portal.getContainer()];
                 }
             });
@@ -345,15 +360,15 @@ var Select = /** @class */ (function (_super) {
     };
     Select.prototype.openMenuIfNeeded = function () {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.isMenuOpened()];
                     case 1:
-                        if (!!(_a.sent())) return [3 /*break*/, 3];
+                        if (!!(_d.sent())) return [3 /*break*/, 3];
                         return [4 /*yield*/, this.buttonOrLinkLocator.click()];
                     case 2:
-                        _a.sent();
-                        _a.label = 3;
+                        _d.sent();
+                        _d.label = 3;
                     case 3: return [2 /*return*/];
                 }
             });
@@ -361,19 +376,19 @@ var Select = /** @class */ (function (_super) {
     };
     Select.prototype.waitEnabled = function () {
         return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            return __generator(this, function (_d) {
+                switch (_d.label) {
                     case 0: return [4 /*yield*/, this.isLinkSelect()];
                     case 1:
-                        if (!_a.sent()) return [3 /*break*/, 3];
+                        if (!_d.sent()) return [3 /*break*/, 3];
                         return [4 /*yield*/, (0, test_1.expect)(this.buttonOrLinkLocator).not.toHaveAttribute(utils_1.DataVisualState.Disabled)];
                     case 2:
-                        _a.sent();
+                        _d.sent();
                         return [3 /*break*/, 5];
                     case 3: return [4 /*yield*/, (0, test_1.expect)(this.buttonOrLinkLocator).toBeEnabled()];
                     case 4:
-                        _a.sent();
-                        _a.label = 5;
+                        _d.sent();
+                        _d.label = 5;
                     case 5: return [2 /*return*/];
                 }
             });
@@ -382,3 +397,4 @@ var Select = /** @class */ (function (_super) {
     return Select;
 }(BaseComponent_1.BaseComponent));
 exports.Select = Select;
+_a = LocatorSymbols_1.toControlElementLocator, _b = LocatorSymbols_1.toValueElementLocator, _c = LocatorSymbols_1.toFocusableElementLocator;

package/build/src/components/Spinner.d.ts

@@ -2,8 +2,10 @@ import type { Locator } from '@playwright/test';
 import { BaseComponent } from './BaseComponent';
 import { SpinnerAssertions } from '../assertions';
 import type { InnerTextOptions } from '../options';
+import { toTextElementLocator } from '../matchers/component/LocatorSymbols';
 export declare class Spinner extends BaseComponent {
     readonly rootLocator: Locator;
+    readonly [toTextElementLocator]: () => Locator;
     constructor(rootLocator: Locator);
     getText(options?: InnerTextOptions): Promise<string>;
     waitLoading(options?: {