d5-testing-library 1.1.0 → 1.3.0

package/dist/cjs/d5-testing-library.cjs

@@ -31,20 +31,25 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var src_exports = {};
 __export(src_exports, {
   AbstractPage: () => AbstractPage,
+  FilterPanel: () => FilterPanel,
   FormEdit: () => FormEdit,
   FormField: () => FormField,
+  FormFilterField: () => FormFilterField,
   ListForm: () => ListForm,
   LoginPage: () => LoginPage,
   NumberEditor: () => NumberEditor,
+  PanelFilterField: () => PanelFilterField,
   SubsystemsPanel: () => SubsystemsPanel,
   TextEditor: () => TextEditor,
   byTestId: () => byTestId,
+  byTestIdCssSelector: () => byTestIdCssSelector,
   click: () => click,
   config: () => config,
   createDriver: () => createDriver,
   editorFactory: () => editorFactory,
   elementIsNotPresent: () => elementIsNotPresent,
   signIn: () => signIn,
+  wait: () => wait,
   waitElementIsVisible: () => waitElementIsVisible
 });
 module.exports = __toCommonJS(src_exports);
@@ -89,11 +94,58 @@ function config(cfg) {
   return configInstance.config(cfg);
 }
 
+// src/pageObjects/AbstractElement.ts
+var import_selenium_webdriver2 = require("selenium-webdriver");
+
+// src/utils/waitElementIsVisible.ts
+var import_selenium_webdriver = require("selenium-webdriver");
+
+// src/utils/wait.ts
+async function wait(condition, driver, errorMessage, timeout) {
+  driver = driver ?? config().driver;
+  await driver.wait(condition, timeout ?? config().timeout, errorMessage);
+}
+
+// src/utils/waitElementIsVisible.ts
+async function waitElementIsVisible({
+  element,
+  timeout,
+  errorMessage,
+  driver
+}) {
+  driver = driver ?? config().driver;
+  const condition = import_selenium_webdriver.until.elementIsVisible(element);
+  await wait(condition.fn, driver, errorMessage ?? condition.description(), timeout ?? config().timeout);
+}
+
 // src/pageObjects/AbstractElement.ts
 var AbstractElement = class {
   driver;
-  constructor(driver) {
+  elementCssSelector;
+  constructor(driver, elementCssSelector) {
     this.driver = driver || config().driver;
+    this.elementCssSelector = elementCssSelector;
+  }
+  getFullCssSelector() {
+    return this.elementCssSelector;
+  }
+  async getElement() {
+    return this.driver.findElement(import_selenium_webdriver2.By.css(this.getFullCssSelector()));
+  }
+  async getAttribute(attr) {
+    const element = await this.getElement();
+    await waitElementIsVisible({
+      element,
+      driver: this.driver,
+      errorMessage: `Element not found: ${this.getFullCssSelector()}`
+    });
+    return await element.getAttribute(attr);
+  }
+  async getClasses() {
+    return await this.getAttribute("class");
+  }
+  async getDataTestId() {
+    return await this.getAttribute("data-testid");
   }
 };
 
@@ -126,16 +178,62 @@ var AbstractPage = class extends AbstractElement {
   }
 };
 
+// src/utils/actions.ts
+var click = async (webElement, driver) => {
+  driver = driver ?? config().driver;
+  const actions = driver.actions({ async: true });
+  await actions.move({ origin: webElement }).click().perform();
+};
+
 // src/utils/locators.ts
-var import_selenium_webdriver = require("selenium-webdriver");
+var import_selenium_webdriver3 = require("selenium-webdriver");
+var byTestIdCssSelector = (testId, element = "div") => {
+  return `${element}[data-testid="${testId}"]`;
+};
 var byTestId = (testId, element = "div") => {
-  return import_selenium_webdriver.By.css(`${element}[data-testid="${testId}"]`);
+  return import_selenium_webdriver3.By.css(byTestIdCssSelector(testId, element));
+};
+
+// src/pageObjects/pages/LoginPage.ts
+var LOGIN_PATH = "/login";
+var LoginPage = class extends AbstractPage {
+  usernameField = byTestId("loginField", "input");
+  passwordField = byTestId("passwordField", "input");
+  loginButton = byTestId("loginButton");
+  async locate() {
+    await super.locate();
+    const login = await this.driver.findElement(this.usernameField);
+    await waitElementIsVisible({
+      element: login,
+      driver: this.driver
+    });
+  }
+  get path() {
+    return LOGIN_PATH;
+  }
+  async enterUsername(username) {
+    await this.driver.findElement(this.usernameField).sendKeys(username);
+  }
+  async enterPassword(password) {
+    await this.driver.findElement(this.passwordField).sendKeys(password);
+  }
+  async clickLoginButton() {
+    await click(await this.driver.findElement(this.loginButton), this.driver);
+  }
+  async loginWith(username, password) {
+    await this.enterUsername(username);
+    await this.enterPassword(password);
+    await this.clickLoginButton();
+  }
+  async authorize() {
+    await this.loginWith(config().auth.login, config().auth.password);
+  }
 };
 
 // src/utils/createDriver.ts
-var import_selenium_webdriver2 = require("selenium-webdriver");
+var import_selenium_webdriver4 = require("selenium-webdriver");
 var createDriver = async (browser) => {
-  const driver = await new import_selenium_webdriver2.Builder().forBrowser(browser ?? config().browser).build();
+  const driver = await new import_selenium_webdriver4.Builder().forBrowser(browser ?? config().browser).build();
   const manage = driver.manage();
   await manage.setTimeouts({ implicit: config().timeout });
   await manage.window().maximize();
@@ -143,86 +241,75 @@ var createDriver = async (browser) => {
 };
 
 // src/utils/elementIsNotPresent.ts
-var import_selenium_webdriver3 = require("selenium-webdriver");
+var import_selenium_webdriver5 = require("selenium-webdriver");
 var elementIsNotPresent = function elementIsNotPresent2(locator) {
-  return new import_selenium_webdriver3.Condition("for no element to be located " + locator, async function(driver) {
+  return new import_selenium_webdriver5.Condition("for no element to be located " + locator, async function(driver) {
     const elements = await driver.findElements(locator);
     return elements.length == 0;
   });
 };
 
-// src/utils/waitElementIsVisible.ts
-var import_selenium_webdriver4 = require("selenium-webdriver");
-async function waitElementIsVisible({ element, timeout, errorMessage, driver }) {
-  driver = driver ?? config().driver;
-  const condition = import_selenium_webdriver4.until.elementIsVisible(element);
-  await driver.wait(condition.fn, timeout ?? 1e4, errorMessage ?? condition.description());
+// src/utils/signIn.ts
+async function signIn(driver) {
+  const webDriver = driver ?? await createDriver();
+  config().driver = webDriver;
+  const loginPage = new LoginPage(webDriver);
+  await loginPage.locate();
+  await loginPage.authorize();
+  return webDriver;
 }
 
 // src/pageObjects/AbstractElementWithParent.ts
 var AbstractElementWithParent = class extends AbstractElement {
-  getParentElement;
-  elementBy;
-  constructor(getParentElement, driver) {
-    super(driver);
-    this.getParentElement = getParentElement;
-  }
-  async getElement() {
-    const parentEl = await this.getParentElement();
-    await waitElementIsVisible({
-      element: parentEl,
-      driver: this.driver
-    });
-    const el = await parentEl.findElement(this.elementBy);
-    await waitElementIsVisible({
-      element: el,
-      driver: this.driver
-    });
-    return el;
-  }
-  async getAttribute(attr) {
-    const el = await this.getElement();
-    return await el.getAttribute(attr);
-  }
-  async getClasses() {
-    return await this.getAttribute("class");
+  parentCssSelector;
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(driver, elementCssSelector);
+    this.parentCssSelector = parentCssSelector;
+  }
+  getFullCssSelector() {
+    if (!this.elementCssSelector) {
+      return this.parentCssSelector;
+    }
+    if (!this.parentCssSelector) {
+      return this.elementCssSelector;
+    }
+    return `${this.parentCssSelector} ${this.elementCssSelector}`;
   }
 };
 
 // src/pageObjects/elements/SubsystemsPanel/SubsystemsPanelHeader.ts
+var import_selenium_webdriver6 = require("selenium-webdriver");
 var SubsystemsPanelHeader = class extends AbstractElementWithParent {
-  titleBy = byTestId("subsystems-panel-title", "span");
   async title() {
-    const panel = await this.getParentElement();
-    return panel.findElement(this.titleBy);
+    return this.driver.findElement(import_selenium_webdriver6.By.css(this.getFullCssSelector()));
   }
 };
 
 // src/pageObjects/elements/SubsystemsPanel/SubsystemsPanel.ts
-var import_selenium_webdriver5 = require("selenium-webdriver");
 var SubsystemsPanel = class extends AbstractElement {
-  panelBy = import_selenium_webdriver5.By.id("aside");
   header;
   constructor(driver) {
     super(driver);
-    this.header = new SubsystemsPanelHeader(this.panelElement, this.driver);
+    this.header = new SubsystemsPanelHeader("#aside", byTestIdCssSelector("subsystems-panel-title", "span"), this.driver);
   }
-  panelElement = () => {
-    return this.driver.findElement(this.panelBy);
-  };
-  headerTitle() {
-    return this.header.title().then((el) => el.getText());
+  async headerTitle() {
+    const title = await this.header.title();
+    await wait(async () => await title.getText() != "", this.driver);
+    return title.getText();
   }
 };
 
 // src/pageObjects/elements/Forms/AbstractForm.ts
-var import_selenium_webdriver6 = require("selenium-webdriver");
+var import_selenium_webdriver7 = require("selenium-webdriver");
 var AbstractForm = class extends AbstractPage {
+  containerCssSelector = "";
   containerBy;
-  popupContainerBy;
+  popupContainerCssSelector;
   constructor(driver) {
     super(driver);
-    this.containerBy = byTestId(`form-content-wrapper-${this.formName}`);
+    const testId = `form-content-wrapper-${this.formName}`;
+    this.containerBy = byTestId(testId);
+    this.containerCssSelector = byTestIdCssSelector(testId);
   }
   async isModal() {
     const el = await this.getContainerElement();
@@ -245,10 +332,10 @@ var AbstractForm = class extends AbstractPage {
    */
   async exists() {
     try {
-      await this.driver.wait(elementIsNotPresent(this.containerBy), 1e3);
+      let elements = await this.driver.findElements(this.containerBy);
+      return elements.length > 0;
+    } catch (error) {
       return false;
-    } catch {
-      return true;
     }
   }
   /**
@@ -260,29 +347,42 @@ var AbstractForm = class extends AbstractPage {
    */
   async getTitleText() {
     if (await this.isModal()) {
-      const popupEl = await this.driver.findElement(this.popupContainerBy);
-      const titleEl2 = await popupEl.findElement(import_selenium_webdriver6.By.className("popup-title"));
+      const titleEl2 = await this.driver.findElement(import_selenium_webdriver7.By.css(`${this.popupContainerCssSelector} .popup-title`));
       return titleEl2.getText();
     }
-    let container = await this.getContainerElement();
-    let titleEl = await container.findElement(import_selenium_webdriver6.By.className("form-toolbar-name-container"));
+    let titleEl = await this.driver.findElement(import_selenium_webdriver7.By.className("main-toolbar-form-title"));
     return titleEl.getText();
   }
 };
 
 // src/pageObjects/elements/Forms/FormEdit.ts
-var import_selenium_webdriver13 = require("selenium-webdriver");
+var import_selenium_webdriver14 = require("selenium-webdriver");
 
-// src/pageObjects/elements/Editors/AbstractEditor.ts
-var import_selenium_webdriver7 = require("selenium-webdriver");
+// src/utils/createDataTestId.ts
+function createDataTestId(formName, itemType, itemName) {
+  return `${formName}-${itemType}-${itemName}`;
+}
+function createFieldTestId(formName, itemName) {
+  return createDataTestId(formName, "form_field" /* FORM_FIELD */, itemName);
+}
+function createGroupTestId(formName, itemName) {
+  return createDataTestId(formName, "group" /* GROUP */, itemName);
+}
+function createFilterTestId(formName, itemName, layout) {
+  return createDataTestId(formName, "filter" /* FILTER */, itemName) + `-${layout}`;
+}
+function createDocFilterTestId(formName, itemName) {
+  return createFilterTestId(formName, itemName, "dock-panel-filter" /* DOCK_PANEL */);
+}
+function createLayoutFilterTestId(formName, itemName) {
+  return createFilterTestId(formName, itemName, "layout-filter" /* LAYOUT */);
+}
+function createTableId(formName) {
+  return `${"table" /* TABLE */}-${formName}`;
+}
 
-// src/pageObjects/AbstractFormElement.ts
-var AbstractFormElement = class extends AbstractElementWithParent {
-  constructor(getParentElement, elementBy, driver) {
-    super(getParentElement, driver);
-    this.elementBy = elementBy;
-  }
-};
+// src/pageObjects/elements/Editors/AbstractEditor.ts
+var import_selenium_webdriver8 = require("selenium-webdriver");
 
 // src/pageObjects/elements/Editors/ClearStrategy/InputClearStrategy.ts
 var InputClearStrategy = class {
@@ -293,14 +393,16 @@ var InputClearStrategy = class {
 };
 
 // src/pageObjects/elements/Editors/AbstractEditor.ts
-var AbstractDXEditorWithInput = class extends AbstractFormElement {
+var AbstractDXEditorWithInput = class extends AbstractElementWithParent {
   clearStrategy = new InputClearStrategy();
   setClearStrategy(strategy) {
     this.clearStrategy = strategy;
   }
+  getInputCssSelector() {
+    return `${this.getFullCssSelector()} .dx-texteditor-input`;
+  }
   async getInputElement() {
-    const controlEl = await this.getElement();
-    return controlEl.findElement(import_selenium_webdriver7.By.className("dx-texteditor-input"));
+    return this.driver.findElement(import_selenium_webdriver8.By.css(this.getInputCssSelector()));
   }
   async getInputValue() {
     const inputEl = await this.getInputElement();
@@ -309,7 +411,7 @@ var AbstractDXEditorWithInput = class extends AbstractFormElement {
   async setInputValue(value) {
     const inputEl = await this.getInputElement();
     await click(inputEl, this.driver);
-    await inputEl.sendKeys(value, import_selenium_webdriver7.Key.ENTER);
+    await inputEl.sendKeys(value, import_selenium_webdriver8.Key.ENTER);
   }
   async clear() {
     await this.clearStrategy.clear(this);
@@ -318,8 +420,8 @@ var AbstractDXEditorWithInput = class extends AbstractFormElement {
 
 // src/pageObjects/elements/Editors/TextEditor.ts
 var TextEditor = class extends AbstractDXEditorWithInput {
-  constructor(getParentElement, elementBy, driver) {
-    super(getParentElement, elementBy, driver);
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
     this.setClearStrategy(new InputClearStrategy());
   }
   getValue() {
@@ -332,8 +434,8 @@ var TextEditor = class extends AbstractDXEditorWithInput {
 
 // src/pageObjects/elements/Editors/NumberEditor.ts
 var NumberEditor = class extends AbstractDXEditorWithInput {
-  constructor(getParentElement, elementBy, driver) {
-    super(getParentElement, elementBy, driver);
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
     this.setClearStrategy(new InputClearStrategy());
   }
   async getValue() {
@@ -345,11 +447,17 @@ var NumberEditor = class extends AbstractDXEditorWithInput {
   }
 };
 
+// src/pageObjects/AbstractFormElement.ts
+var AbstractFormElement = class extends AbstractElementWithParent {
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
+  }
+};
+
 // src/pageObjects/elements/Editors/CheckBox.ts
-var CheckBox = class extends AbstractFormElement {
+var CheckBox = class extends AbstractElementWithParent {
   async getValue() {
-    const inputEl = await this.getElement();
-    const result = await inputEl.getAttribute("aria-checked");
+    const result = await this.getAttribute("aria-checked");
     if (result === "true")
       return 1;
     if (result === "false")
@@ -366,7 +474,7 @@ var CheckBox = class extends AbstractFormElement {
 };
 
 // src/pageObjects/elements/Editors/SelectBoxEditor.ts
-var import_selenium_webdriver9 = require("selenium-webdriver");
+var import_selenium_webdriver10 = require("selenium-webdriver");
 
 // src/utils/xpathHelper.ts
 var XPathHelper = class {
@@ -379,28 +487,28 @@ var XPathHelper = class {
 };
 
 // src/pageObjects/elements/Editors/ClearStrategy/ClearButtonStrategy.ts
-var import_selenium_webdriver8 = require("selenium-webdriver");
+var import_selenium_webdriver9 = require("selenium-webdriver");
 var DX_TEXTEDITOR_EMPTY = "dx-texteditor-empty";
 var DX_CLEAR_BUTTON_AREA = "dx-clear-button-area";
 var ClearButtonStrategy = class {
   editorContainerClass;
-  constructor(editorContainerClass) {
+  _driver;
+  constructor(editorContainerClass, driver) {
     this.editorContainerClass = editorContainerClass;
+    this._driver = driver;
   }
-  async isEmptyEditorField(editor) {
-    const parentEl = await editor.getParentElement();
-    const editorContainer = await parentEl.findElement(import_selenium_webdriver8.By.className(this.editorContainerClass));
+  async isEmptyEditorField() {
+    const editorContainer = await this._driver.findElement(import_selenium_webdriver9.By.css(this.editorContainerClass));
     const classAttribute = await editorContainer.getAttribute("class");
     return classAttribute.includes(DX_TEXTEDITOR_EMPTY);
   }
-  async clear(editor) {
-    if (await this.isEmptyEditorField(editor)) {
+  async clear() {
+    if (await this.isEmptyEditorField()) {
       throw new Error("This field is already empty");
     }
-    const clearBtnSelector = `.${this.editorContainerClass} .${DX_CLEAR_BUTTON_AREA}`;
-    const parentEl = await editor.getParentElement();
-    const clearBtn = await parentEl.findElement(import_selenium_webdriver8.By.css(clearBtnSelector));
-    await click(clearBtn, editor.driver);
+    const clearBtnSelector = `${this.editorContainerClass} .${DX_CLEAR_BUTTON_AREA}`;
+    const clearBtn = await this._driver.findElement(import_selenium_webdriver9.By.css(clearBtnSelector));
+    await click(clearBtn, this._driver);
   }
 };
 
@@ -411,25 +519,17 @@ var combinedValueXpath = (value) => `${XPathHelper.getRoleXpath(SELECT_BOX_ELEME
   SELECT_BOX_OPTION_TEXT_CONTAINER_CLASS,
   value
 )}`;
-var DX_SELECTBOX = "dx-selectbox";
 var SelectBoxEditor = class extends AbstractDXEditorWithInput {
-  constructor(getParentElement, elementBy, driver) {
-    super(getParentElement, elementBy, driver);
-    this.setClearStrategy(new ClearButtonStrategy(DX_SELECTBOX));
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
+    this.setClearStrategy(new ClearButtonStrategy(this.getFullCssSelector(), this.driver));
   }
   async setSelectInputValue(value) {
     const inputEl = await this.getInputElement();
     await click(inputEl, this.driver);
-    await inputEl.sendKeys(value, import_selenium_webdriver9.Key.ENTER);
-    await this.driver.wait(async () => {
-      try {
-        const optElement = await inputEl.findElement(import_selenium_webdriver9.By.xpath(combinedValueXpath(value)));
-        await click(optElement, this.driver);
-        return true;
-      } catch (e) {
-        return false;
-      }
-    }, 2e3);
+    await inputEl.sendKeys(value, import_selenium_webdriver10.Key.ENTER);
+    const optElement = await inputEl.findElement(import_selenium_webdriver10.By.xpath(combinedValueXpath(value)));
+    await click(optElement, this.driver);
   }
   async getValue() {
     const value = await super.getInputValue();
@@ -441,10 +541,9 @@ var SelectBoxEditor = class extends AbstractDXEditorWithInput {
 };
 
 // src/pageObjects/elements/Editors/SwitchEditor.ts
-var SwitchEditor = class extends AbstractFormElement {
+var SwitchEditor = class extends AbstractElementWithParent {
   async getValue() {
-    const inputEl = await this.getElement();
-    const result = await inputEl.getAttribute("aria-label");
+    const result = await this.getAttribute("aria-label");
     if (result === "ON")
       return 1;
     if (result === "OFF")
@@ -457,27 +556,28 @@ var SwitchEditor = class extends AbstractFormElement {
     }
     const inputEl = await this.getElement();
     const currentValue = await this.getValue();
-    if (currentValue !== value) {
-      await click(inputEl, this.driver);
-      await this.driver.wait(async () => {
-        const updatedValue = await this.getValue();
-        return updatedValue !== currentValue;
-      });
+    if (currentValue === value) {
+      return;
     }
+    await click(inputEl, this.driver);
+    await wait(async () => {
+      const updatedValue = await this.getValue();
+      return updatedValue !== currentValue;
+    }, this.driver);
   }
 };
 
 // src/pageObjects/elements/Editors/TagBox.ts
-var import_selenium_webdriver10 = require("selenium-webdriver");
+var import_selenium_webdriver11 = require("selenium-webdriver");
 var TAGS_SELECTOR = ".dx-tag .tag-text";
 var DX_TAG_CONTAINER = "dx-tag-container";
-var DX_TAGBOX = "dx-tagbox";
 var DX_TEXTEDITOR_EMPTY2 = "dx-texteditor-empty";
 var BTN_OK_SELECTOR = ".dx-tagbox-popup-wrapper .dx-popup-bottom .dx-button.dx-popup-done";
+var TAG_BOX_LIST_ITEM_SELECTOR = '.dx-tagbox-popup-wrapper .dx-list-item[aria-selected="true"]';
 var TagBox = class extends AbstractDXEditorWithInput {
-  constructor(getParentElement, elementBy, driver) {
-    super(getParentElement, elementBy, driver);
-    this.setClearStrategy(new ClearButtonStrategy(DX_TAGBOX));
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
+    this.setClearStrategy(new ClearButtonStrategy(this.getFullCssSelector(), this.driver));
   }
   async setTagBoxInputValue(values) {
     const lastElement = values[values.length - 1];
@@ -488,37 +588,28 @@ var TagBox = class extends AbstractDXEditorWithInput {
     }
     await this.confirmSelection();
   }
+  async waitOptionSelection() {
+    const option = await this.driver.findElement(import_selenium_webdriver11.By.css(TAG_BOX_LIST_ITEM_SELECTOR));
+    await wait(() => option.isDisplayed(), this.driver);
+  }
   async selectOption(inputEl, value, lastElement) {
     await inputEl.sendKeys(value);
-    await this.driver.wait(async () => {
-      try {
-        const optElement = await inputEl.findElement(import_selenium_webdriver10.By.xpath(combinedValueXpath(value)));
-        await click(optElement, this.driver);
-        return true;
-      } catch (e) {
-        return false;
-      }
-    });
+    const optElement = await inputEl.findElement(import_selenium_webdriver11.By.xpath(combinedValueXpath(value)));
+    await click(optElement, this.driver);
+    await this.waitOptionSelection();
     if (value !== lastElement) {
       await inputEl.clear();
     }
   }
   async confirmSelection() {
-    const inputEl = await this.getInputElement();
-    const option = await inputEl.findElement(import_selenium_webdriver10.By.xpath(XPathHelper.getRoleXpath(SELECT_BOX_ELEMENT_ROLE)));
-    const btnOk = await this.driver.findElement(import_selenium_webdriver10.By.css(BTN_OK_SELECTOR));
-    await this.driver.wait(async () => {
-      return await option.getAttribute("aria-selected") === "true";
-    });
+    const btnOk = await this.driver.findElement(import_selenium_webdriver11.By.css(BTN_OK_SELECTOR));
     await click(btnOk, this.driver);
   }
   async getTagBoxInputValue() {
     if (await this.isTagBoxEmpty()) {
       return [];
     }
-    const parentEl = await this.getParentElement();
-    const inputEl = await parentEl.findElement(import_selenium_webdriver10.By.className(DX_TAG_CONTAINER));
-    const tags = await inputEl.findElements(import_selenium_webdriver10.By.css(TAGS_SELECTOR));
+    const tags = await this.driver.findElements(import_selenium_webdriver11.By.css(`${this.getFullCssSelector()} .${DX_TAG_CONTAINER} ${TAGS_SELECTOR}`));
     const values = [];
     for (const tag of tags) {
       const text = await tag.getText();
@@ -527,9 +618,7 @@ var TagBox = class extends AbstractDXEditorWithInput {
     return values;
   }
   async isTagBoxEmpty() {
-    const parentEl = await this.getParentElement();
-    const tagboxContainer = await parentEl.findElement(import_selenium_webdriver10.By.className(DX_TAGBOX));
-    const classAttribute = await tagboxContainer.getAttribute("class");
+    const classAttribute = await this.getClasses();
     return classAttribute.includes(DX_TEXTEDITOR_EMPTY2);
   }
   async getValue() {
@@ -548,28 +637,25 @@ var TagBox = class extends AbstractDXEditorWithInput {
     if (!tagExists) {
       throw new Error(`The tag with the text: ${itemText} was not found`);
     }
-    const parentEl = await this.getParentElement();
-    const inputEl = await parentEl.findElement(import_selenium_webdriver10.By.className(DX_TAG_CONTAINER));
-    const clearBtnTestId = byTestId(`clear-button-${itemText}`);
-    const clearBtn = await inputEl.findElement(clearBtnTestId);
+    const clearBtnTestId = byTestIdCssSelector(`clear-button-${itemText}`);
+    const clearBtn = await this.driver.findElement(import_selenium_webdriver11.By.css(`${this.getFullCssSelector()} .${DX_TAG_CONTAINER} ${clearBtnTestId}`));
     await click(clearBtn, this.driver);
   }
 };
 
 // src/pageObjects/elements/Editors/ButtonGroup.ts
-var import_selenium_webdriver11 = require("selenium-webdriver");
+var import_selenium_webdriver12 = require("selenium-webdriver");
 var ITEM_CLASS = "dx-buttongroup-item";
 var SELECTED_CLASS = "dx-state-selected";
-var ButtonGroup = class extends AbstractFormElement {
-  async getItems() {
-    return (await this.getElement()).findElements(import_selenium_webdriver11.By.className(ITEM_CLASS));
+var ButtonGroup = class extends AbstractElementWithParent {
+  getItems() {
+    return this.driver.findElements(import_selenium_webdriver12.By.css(`${this.getFullCssSelector()} .${ITEM_CLASS}`));
   }
   getDataValue(el) {
     return el.getAttribute("data-value");
   }
   async getValue() {
-    const inputEl = await this.getElement();
-    const selectedEl = await inputEl.findElement(import_selenium_webdriver11.By.className(`${ITEM_CLASS} ${SELECTED_CLASS}`));
+    const selectedEl = await this.driver.findElement(import_selenium_webdriver12.By.css(`${this.getFullCssSelector()} .${ITEM_CLASS}.${SELECTED_CLASS}`));
     return this.getDataValue(selectedEl);
   }
   async setValue(value) {
@@ -603,19 +689,14 @@ var BooleanSelector = class extends ButtonGroup {
 };
 
 // src/pageObjects/elements/Editors/DateEditor.ts
-var import_selenium_webdriver12 = require("selenium-webdriver");
+var import_selenium_webdriver13 = require("selenium-webdriver");
 var DateEditor = class extends AbstractDXEditorWithInput {
-  constructor(getParentElement, elementBy, driver) {
-    super(getParentElement, elementBy, driver);
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
     this.setClearStrategy(new InputClearStrategy());
   }
-  async getControlElement() {
-    const controlEl = await this.getElement();
-    return controlEl.findElement(import_selenium_webdriver12.By.className("dx-dropdowneditor-input-wrapper"));
-  }
   async getDateElement() {
-    const controlEl = await this.getControlElement();
-    return controlEl.findElement(import_selenium_webdriver12.By.css("input[type=hidden]"));
+    return this.driver.findElement(import_selenium_webdriver13.By.css(this.getFullCssSelector() + " .dx-dropdowneditor-input-wrapper input[type=hidden]"));
   }
   async setDateValue(value) {
     const dateEl = await this.getInputElement();
@@ -625,8 +706,8 @@ var DateEditor = class extends AbstractDXEditorWithInput {
     const keys = day + month + year;
     await click(dateEl, this.driver);
     const actions = this.driver.actions({ async: true });
-    await actions.move({ origin: dateEl }).sendKeys(import_selenium_webdriver12.Key.HOME).perform();
-    await actions.move({ origin: dateEl }).sendKeys(keys, import_selenium_webdriver12.Key.ENTER).perform();
+    await actions.move({ origin: dateEl }).sendKeys(import_selenium_webdriver13.Key.HOME).perform();
+    await actions.move({ origin: dateEl }).sendKeys(keys, import_selenium_webdriver13.Key.ENTER).perform();
   }
   async getDateValue() {
     const inputEl = await this.getDateElement();
@@ -645,54 +726,39 @@ var DateEditor = class extends AbstractDXEditorWithInput {
 };
 
 // src/pageObjects/elements/Editors/editorFactory.ts
-var editorFactory = async (getParentElement, elementBy, driver) => {
-  const elementInstance = new AbstractFormElement(getParentElement, elementBy, driver);
+var editorFactory = async (parentCssSelector, elementCssSelector, driver) => {
+  const elementInstance = new AbstractFormElement(parentCssSelector, elementCssSelector, driver);
   const classSting = await elementInstance.getClasses();
   if (classSting.includes("text-control"))
-    return new TextEditor(getParentElement, elementBy, driver);
+    return new TextEditor(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("number-control"))
-    return new NumberEditor(getParentElement, elementBy, driver);
+    return new NumberEditor(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("check-box"))
-    return new CheckBox(getParentElement, elementBy, driver);
+    return new CheckBox(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("multi-select-control"))
-    return new TagBox(getParentElement, elementBy, driver);
+    return new TagBox(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("select-control"))
-    return new SelectBoxEditor(getParentElement, elementBy, driver);
+    return new SelectBoxEditor(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("switch-control"))
-    return new SwitchEditor(getParentElement, elementBy, driver);
+    return new SwitchEditor(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("date-control"))
-    return new DateEditor(getParentElement, elementBy, driver);
+    return new DateEditor(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("buttons-group"))
-    return new BooleanSelector(getParentElement, elementBy, driver);
+    return new BooleanSelector(parentCssSelector, elementCssSelector, driver);
   if (classSting.includes("button-group-field"))
-    return new ButtonGroup(getParentElement, elementBy, driver);
+    return new ButtonGroup(parentCssSelector, elementCssSelector, driver);
   throw new Error("Unknown type of editor. Please write ticket to the support");
 };
 
-// src/utils/createDataTestId.ts
-function createDataTestId(formName, itemType, itemName) {
-  return `${formName}-${itemType}-${itemName}`;
-}
-function createFieldTestId(formName, itemName) {
-  return createDataTestId(formName, "form_field" /* FORM_FIELD */, itemName);
-}
-function createGroupTestId(formName, itemName) {
-  return createDataTestId(formName, "group" /* GROUP */, itemName);
-}
-function createTableId(formName) {
-  return `${"table" /* TABLE */}-${formName}`;
-}
-
-// src/pageObjects/elements/FormField.ts
-var FormField = class extends AbstractElementWithParent {
+// src/pageObjects/elements/AbstractEditor.ts
+var AbstractEditor = class extends AbstractElementWithParent {
   editor;
-  constructor(getParentElement, formName, name, driver) {
-    super(getParentElement, driver);
-    this.elementBy = byTestId(createFieldTestId(formName, name));
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
   }
   async initEditor() {
     if (!this.editor) {
-      this.editor = await editorFactory(this.getParentElement, this.elementBy, this.driver);
+      this.editor = await editorFactory(this.parentCssSelector, this.elementCssSelector, this.driver);
     }
   }
   /**
@@ -741,37 +807,43 @@ var FormField = class extends AbstractElementWithParent {
   }
 };
 
-// src/pageObjects/elements/Groups/AbstractGroup.ts
-var AbstractDXGroup = class extends AbstractFormElement {
+// src/pageObjects/elements/FormField.ts
+var FormField = class extends AbstractEditor {
+  constructor(parentCssSelector, formName, name, driver) {
+    super(parentCssSelector, byTestIdCssSelector(createFieldTestId(formName, name)), driver);
+  }
 };
 
-// src/pageObjects/elements/Groups/Panel.ts
-var Panel = class extends AbstractDXGroup {
+// src/pageObjects/elements/Groups/AbstractGroup.ts
+var AbstractGroup = class extends AbstractElementWithParent {
   async isDisplayed() {
     const groupElement = await this.getElement();
     return await groupElement.isDisplayed();
   }
 };
 
+// src/pageObjects/elements/Groups/Panel.ts
+var Panel = class extends AbstractGroup {
+};
+
 // src/pageObjects/elements/Groups/groupFactory.ts
-var groupFactory = async (getParentElement, elementBy, driver) => {
-  const elementInstance = new AbstractFormElement(getParentElement, elementBy, driver);
+var groupFactory = async (parentCssSelector, elementCssSelector, driver) => {
+  const elementInstance = new AbstractFormElement(parentCssSelector, elementCssSelector, driver);
   const classSting = await elementInstance.getClasses();
   if (classSting.includes("panel-group"))
-    return new Panel(getParentElement, elementBy, driver);
+    return new Panel(parentCssSelector, elementCssSelector, driver);
   throw new Error("Unknown type of group. Please write ticket to the support");
 };
 
 // src/pageObjects/elements/FormGroup.ts
 var FormGroup = class extends AbstractElementWithParent {
   editor;
-  constructor(getParentElement, formName, name, driver) {
-    super(getParentElement, driver);
-    this.elementBy = byTestId(createGroupTestId(formName, name));
+  constructor(parentCssSelector, formName, name, driver) {
+    super(parentCssSelector, byTestIdCssSelector(createGroupTestId(formName, name)), driver);
   }
   async initEditor() {
     if (!this.editor) {
-      this.editor = await groupFactory(this.getParentElement, this.elementBy, this.driver);
+      this.editor = await groupFactory(this.parentCssSelector, this.elementCssSelector, this.driver);
     }
   }
   /**
@@ -780,17 +852,21 @@ var FormGroup = class extends AbstractElementWithParent {
    * expect(await tableList.group('MainSuperPanel').isDisplayed();
    */
   async isDisplayed() {
-    await this.initEditor();
-    return this.editor.isDisplayed();
+    try {
+      await this.initEditor();
+      return this.editor.isDisplayed();
+    } catch {
+      return false;
+    }
   }
 };
 
 // src/pageObjects/elements/Forms/FormEdit.ts
 var FormEdit = class extends AbstractForm {
-  saveButtonBy = import_selenium_webdriver13.By.id("button-save");
+  saveButtonBy = import_selenium_webdriver14.By.id("button-save");
   constructor(driver) {
     super(driver);
-    this.popupContainerBy = import_selenium_webdriver13.By.className(`popup form-edit-${this.formName}`);
+    this.popupContainerCssSelector = `.popup .form-edit-${this.formName}`;
   }
   /**
    * Находит поле формы редактирования по имени
@@ -800,7 +876,7 @@ var FormEdit = class extends AbstractForm {
    * expect(await formEdit.field('Name').getValue()).toBe('test value');
    */
   field(name) {
-    return new FormField(this.getContainerElement, this.formName, name, this.driver);
+    return new FormField(this.containerCssSelector, this.formName, name, this.driver);
   }
   /**
    * Проверяет не отключена ли кнопка Сохранить
@@ -822,7 +898,7 @@ var FormEdit = class extends AbstractForm {
    * expect(await formEdit.group('Name');
    */
   group(name) {
-    return new FormGroup(this.getContainerElement, this.formName, name, this.driver);
+    return new FormGroup(this.containerCssSelector, this.formName, name, this.driver);
   }
   /**
    * Нажатие на кнопку Сохранить
@@ -833,50 +909,67 @@ var FormEdit = class extends AbstractForm {
    */
   async saveButtonClick() {
     const saveButton = await this.driver.findElement(this.saveButtonBy);
-    await this.driver.wait(async () => !await this.isSaveButtonDisabled(), void 0, "Button is disabled");
+    await wait(async () => !await this.isSaveButtonDisabled(), this.driver, "Button is disabled");
     await click(saveButton, this.driver);
   }
 };
 
-// src/pageObjects/elements/Forms/ListForm.ts
+// src/pageObjects/elements/Table/Table.ts
 var import_selenium_webdriver19 = require("selenium-webdriver");
 
-// src/pageObjects/elements/Table/Table.ts
+// src/pageObjects/elements/Table/elements/Row.ts
+var import_selenium_webdriver17 = require("selenium-webdriver");
+
+// src/pageObjects/elements/Table/elements/Cell.ts
 var import_selenium_webdriver16 = require("selenium-webdriver");
 
 // src/pageObjects/elements/Table/utils.ts
-var import_selenium_webdriver14 = require("selenium-webdriver");
-var getRowPathByIndex = (index) => {
-  return import_selenium_webdriver14.By.css(`tr[aria-rowindex="${transformInputIndex(index)}"]`);
-};
+var import_selenium_webdriver15 = require("selenium-webdriver");
+function getCssRowByIndexSelector(index) {
+  return `tr[aria-rowindex="${transformInputIndex(index)}"]`;
+}
 var getColumnByIndexCssSelector = (columnIndex) => `td[aria-colindex="${transformInputIndex(columnIndex)}"]`;
-var getColumnPathByIndex = (index) => {
-  return import_selenium_webdriver14.By.css(getColumnByIndexCssSelector(index));
-};
 var getColumnByCaptionCssSelector = (caption) => `td[role="columnheader"][aria-label="Column ${caption}"]`;
-var getCellPathByIndex = (index) => {
-  return import_selenium_webdriver14.By.css(`td[role="gridcell"][aria-colindex="${transformInputIndex(index)}"]`);
-};
+var getColumnByNameCssSelector = (name) => `td[role="columnheader"][data-fieldname="${name}"]`;
+function getCssCellByIndexSelector(index) {
+  return `td[role="gridcell"][aria-colindex="${transformInputIndex(index)}"]`;
+}
 var transformInputIndex = (index) => index + 1;
 var transformOutputIndex = (index) => +index - 1;
 
-// src/pageObjects/elements/Table/elements/Row.ts
-var import_selenium_webdriver15 = require("selenium-webdriver");
-
 // src/pageObjects/elements/Table/elements/Cell.ts
 var Cell = class extends AbstractElementWithParent {
-  index;
-  constructor(rowEl, index, driver) {
-    super(() => Promise.resolve(rowEl), driver);
-    this.index = index;
-    this.elementBy = getCellPathByIndex(index);
+  _index;
+  getCellIndex;
+  constructor(parentCssSelector, getCellIndex, index, driver) {
+    super(parentCssSelector, getCssCellByIndexSelector(index), driver);
+    this.getCellIndex = getCellIndex;
+    this._index = index;
+  }
+  set index(index) {
+    this._index = index;
+    this.elementCssSelector = getCssCellByIndexSelector(index);
+  }
+  async getBooleanValue(cellEl) {
+    const booleanEl = await cellEl.findElement(import_selenium_webdriver16.By.className("boolean-widget"));
+    return await booleanEl.getAttribute("aria-checked") === "true" ? 1 : 0;
+  }
+  async getElement() {
+    if (this._index == null) {
+      this.index = await this.getCellIndex();
+    }
+    return super.getElement();
   }
   async getValue() {
     const cellEl = await this.getElement();
+    const cellElClass = await cellEl.getAttribute("class");
+    if (cellElClass.includes("boolean-column")) {
+      return this.getBooleanValue(cellEl);
+    }
     return cellEl.getText();
   }
   getIndex() {
-    return this.index;
+    return this._index;
   }
 };
 
@@ -886,51 +979,46 @@ var DX_ROW_EDIT_CLASS = "dx-edit-row";
 var DX_DATA_ROW_CLASS = "dx-data-row";
 var Row = class extends AbstractElementWithParent {
   index;
-  getColumnByCaption;
-  constructor(getParentElement, index, driver, getColumnByCaption) {
-    super(getParentElement, driver);
+  getColumnBy;
+  constructor(parentCssSelector, index, driver, getColumnBy) {
+    super(parentCssSelector, getCssRowByIndexSelector(index), driver);
     this.index = index;
-    this.elementBy = getRowPathByIndex(index);
-    this.getColumnByCaption = getColumnByCaption;
+    this.getColumnBy = getColumnBy;
   }
-  async getCellByIndex(index) {
-    const rowEl = await this.getElement();
-    const cell = rowEl.findElement(getCellPathByIndex(index));
-    if (cell) {
-      return new Cell(rowEl, index, this.driver);
-    }
-    throw new Error(`Cannot find cell by index: ${index}`);
+  _getCell({ index, name, title }) {
+    return new Cell(this.getFullCssSelector(), () => {
+      return this.getColumnBy({ title, name }).getIndex();
+    }, index, this.driver);
   }
-  async getCell(caption) {
-    const column = await this.getColumnByCaption(caption);
-    if (column) {
-      const index = column.getIndex();
-      return this.getCellByIndex(index);
-    }
-    throw new Error("Unknown caption of cell");
+  getCellByIndex(index) {
+    return this._getCell({ index });
+  }
+  getCell(name) {
+    return this._getCell({ name });
+  }
+  getCellByTitle(title) {
+    return this._getCell({ title });
   }
   async select() {
     const rowEl = await this.getElement();
     await click(rowEl, this.driver);
-    await this.driver.wait(async () => {
-      const classes = await rowEl.getAttribute("class");
+    await wait(async () => {
+      const classes = await this.getClasses();
       return classes.includes(DX_SELECTION_CLASS);
-    }, 500, "Cannot select row");
+    }, this.driver, "Cannot select row");
   }
   async isSelected() {
-    const rowEl = await this.getElement();
-    const result = await rowEl.getAttribute("aria-selected");
+    const result = await this.getAttribute("aria-selected");
     return result === "true";
   }
   getIndex() {
     return this.index;
   }
   async getCells() {
-    const rowEl = await this.getElement();
-    const cells = await rowEl.findElements(import_selenium_webdriver15.By.css(`td[role="gridcell"]`));
+    const cells = await this.driver.findElements(import_selenium_webdriver17.By.css(`${this.getFullCssSelector()} td[role="gridcell"]`));
     const result = [];
     cells.forEach((_, index) => {
-      const newCell = new Cell(rowEl, index, this.driver);
+      const newCell = this.getCellByIndex(index);
       result.push(newCell);
     });
     return result;
@@ -938,15 +1026,13 @@ var Row = class extends AbstractElementWithParent {
   async clickInlineButton(buttonClass) {
     const FIXED_TABLE_CSS_SELECTOR = ".dx-fixed-columns .dx-datagrid-content.dx-datagrid-content-fixed";
     const buttonCssSelector = `.${DX_DATA_ROW_CLASS}[aria-rowindex="${transformInputIndex(this.index)}"] .${buttonClass}`;
-    const button = (await this.getParentElement()).findElement(
-      import_selenium_webdriver15.By.css(`${FIXED_TABLE_CSS_SELECTOR} ${buttonCssSelector}`)
-    );
+    const button = await this.driver.findElement(import_selenium_webdriver17.By.css(`${this.parentCssSelector} ${FIXED_TABLE_CSS_SELECTOR} ${buttonCssSelector}`));
     return click(button, this.driver);
   }
   async checkEditingMode(isEditing, msg) {
-    await this.driver.wait(async () => {
+    await wait(async () => {
       return (await this.getClasses()).includes(DX_ROW_EDIT_CLASS) === isEditing;
-    }, 2e3, msg);
+    }, this.driver, msg);
   }
   async edit() {
     await this.clickInlineButton("edit");
@@ -963,86 +1049,119 @@ var Row = class extends AbstractElementWithParent {
 };
 
 // src/pageObjects/elements/Table/elements/Column.ts
+var import_selenium_webdriver18 = require("selenium-webdriver");
+var getHeaderCssSelector = () => {
+  return ".dx-datagrid-headers .dx-datagrid-content:not(.dx-datagrid-content-fixed)";
+};
 var Column = class extends AbstractElementWithParent {
-  index;
-  constructor(getParentElement, index, driver) {
-    super(getParentElement, driver);
+  _index;
+  _caption;
+  _name;
+  constructor({ parentCssSelector, name, caption, index, driver }) {
+    super(parentCssSelector, "", driver);
+    this._name = name;
     this.index = index;
-    this.elementBy = getColumnPathByIndex(index);
+    this._caption = caption;
+  }
+  set index(index) {
+    this._index = index;
+    this.elementCssSelector = getColumnByIndexCssSelector(index);
+  }
+  get index() {
+    return this._index;
+  }
+  async getElement() {
+    await this.getIndex();
+    return super.getElement();
+  }
+  async getColumnHeaderIndexBy(cssSelector) {
+    const column = await this.driver.findElement(import_selenium_webdriver18.By.css(`${this.parentCssSelector} ${getHeaderCssSelector()} ${cssSelector}`));
+    return transformOutputIndex(await column.getAttribute("aria-colindex"));
+  }
+  async getIndexByCaption() {
+    return this.getColumnHeaderIndexBy(getColumnByCaptionCssSelector(this._caption));
+  }
+  async getIndexByName() {
+    return this.getColumnHeaderIndexBy(getColumnByNameCssSelector(this._name));
   }
   async caption() {
     const el = await this.getElement();
     return el.getText();
   }
-  getIndex() {
-    return this.index;
+  async getIndex() {
+    if (this.index != null) {
+      return this.index;
+    }
+    if (this._caption != null) {
+      this.index = await this.getIndexByCaption();
+      return this.index;
+    }
+    if (this._name != null) {
+      this.index = await this.getIndexByName();
+      return this.index;
+    }
+    throw new Error("Cant get the index in the column");
   }
 };
 
 // src/pageObjects/elements/Table/Table.ts
 var Table = class extends AbstractElementWithParent {
   formName;
-  constructor(getParentElement, formName, driver) {
-    super(getParentElement, driver);
-    this.elementBy = import_selenium_webdriver16.By.id(createTableId(formName));
+  constructor(parentCssSelector, formName, driver) {
+    super(parentCssSelector, `#${createTableId(formName)}`, driver);
     this.formName = formName;
   }
-  getHeaderCssSelector() {
-    return ".dx-datagrid-headers .dx-datagrid-content:not(.dx-datagrid-content-fixed)";
-  }
-  async getDataGrid() {
-    const parentEl = await this.getElement();
-    return parentEl.findElement(import_selenium_webdriver16.By.css(`div[role="grid"]`));
-  }
-  getTableElement = () => {
-    return this.getElement();
-  };
-  async getRowByIndex(index) {
-    const gridContainer = await this.getDataGrid();
-    const row = await gridContainer.findElement(getRowPathByIndex(index));
-    if (row) {
-      return new Row(this.getTableElement, index, this.driver, this.getColumnByCaption.bind(this));
-    }
-    throw new Error(`Cannot find row by index: ${index}`);
-  }
-  async getColumnByIndex(index) {
-    const column = await (await this.getElement()).findElement(import_selenium_webdriver16.By.css(`${this.getHeaderCssSelector()} ${getColumnByIndexCssSelector(index)}`));
-    if (column) {
-      return new Column(this.getTableElement, index, this.driver);
+  getColumnBy = (args) => {
+    if (args.title) {
+      return this.getColumnByTitle(args.title);
     }
-    throw new Error(`Cannot find column by index: ${index}`);
+    return this.getColumnByName(args.name);
+  };
+  getRowByIndex(index) {
+    return new Row(this.getFullCssSelector(), index, this.driver, this.getColumnBy);
+  }
+  getColumnByIndex(index) {
+    return new Column({
+      parentCssSelector: this.getFullCssSelector(),
+      driver: this.driver,
+      index
+    });
   }
-  async getColumnByCaption(caption) {
-    const column = await (await this.getElement()).findElement(import_selenium_webdriver16.By.css(`${this.getHeaderCssSelector()} ${getColumnByCaptionCssSelector(caption)}`));
-    if (column) {
-      const index = await column.getAttribute("aria-colindex");
-      return new Column(this.getTableElement, transformOutputIndex(index), this.driver);
-    }
-    throw new Error(`Cannot find column by caption: ${caption}`);
-  }
-  async selectRowByIndex(index) {
-    const row = await this.getRowByIndex(index);
-    if (row) {
-      await row.select();
-    } else {
-      throw new Error(`Cannot find row by index: ${index}`);
-    }
+  getColumnByTitle = (title) => {
+    return new Column({
+      parentCssSelector: this.getFullCssSelector(),
+      caption: title,
+      driver: this.driver
+    });
+  };
+  getColumnByName = (name) => {
+    return new Column({
+      parentCssSelector: this.getFullCssSelector(),
+      name,
+      driver: this.driver
+    });
+  };
+  selectRowByIndex(index) {
+    return this.getRowByIndex(index).select();
   }
   async getRows() {
-    const gridContainer = await this.getDataGrid();
-    const rows = await gridContainer.findElements(import_selenium_webdriver16.By.className("dx-row dx-data-row"));
+    const rows = await this.driver.findElements(import_selenium_webdriver19.By.css(`${this.getFullCssSelector()} .dx-row.dx-data-row`));
     const result = [];
     rows.forEach((_, index) => {
-      const newRow = new Row(this.getTableElement, index, this.driver, this.getColumnByCaption.bind(this));
+      const newRow = new Row(this.getFullCssSelector(), index, this.driver, this.getColumnBy);
       result.push(newRow);
     });
     return result;
   }
   async getColumns() {
-    const columns = await (await this.getElement()).findElements(import_selenium_webdriver16.By.css(`${this.getHeaderCssSelector()} td[role="columnheader"]`));
+    const columns = await this.driver.findElements(import_selenium_webdriver19.By.css(`${this.getFullCssSelector()} ${getHeaderCssSelector()} td[role="columnheader"]`));
     const result = [];
     columns.forEach((_, index) => {
-      const newCol = new Column(this.getTableElement, index, this.driver);
+      const newCol = new Column({
+        parentCssSelector: this.getFullCssSelector(),
+        index,
+        driver: this.driver
+      });
       result.push(newCol);
     });
     return result;
@@ -1058,54 +1177,229 @@ var Table = class extends AbstractElementWithParent {
    * expect(await form.field('Name').getValue()).toBe('test value');
    */
   field(name) {
-    return new FormField(this.getTableElement, this.formName, name, this.driver);
+    return new FormField(this.getFullCssSelector(), this.formName, name, this.driver);
   }
 };
 
-// src/pageObjects/elements/TableToolbar/TableToolbar.ts
-var import_selenium_webdriver18 = require("selenium-webdriver");
+// src/pageObjects/elements/TableToolbar/AbstractButton.ts
+var AbstractButton = class extends AbstractElementWithParent {
+  constructor(parentCssSelector, elementCssSelector, driver) {
+    super(parentCssSelector, elementCssSelector, driver);
+  }
+  async click() {
+    const button = await this.getElement();
+    await wait(async () => {
+      return await button.isDisplayed() && !await this.isDisabled();
+    }, this.driver, this.buttonNotDisplayedError());
+    await click(button, this.driver);
+  }
+  async isDisabled() {
+    const button = await this.getElement();
+    return await button.getCssValue("pointer-events") === "none";
+  }
+};
 
-// src/pageObjects/elements/TableToolbar/TableToolbarButton.ts
-var import_selenium_webdriver17 = require("selenium-webdriver");
+// src/pageObjects/elements/TableToolbar/ToolbarGroupButton.ts
+var ToolbarGroupButton = class extends AbstractButton {
+  name;
+  constructor(parentCssSelector, name, driver) {
+    super(parentCssSelector, ``, driver);
+    this.name = name;
+  }
+  buttonNotDisplayedError() {
+    return `Button ${this.name} cannot be clicked. It is not displayed or it is disabled`;
+  }
+};
+
+// src/pageObjects/elements/TableToolbar/ToolbarButton.ts
 var TOOLBAR_BUTTON_CLASS = "toolbar-button";
-var TableToolbarButton = class extends AbstractElementWithParent {
+var ToolbarButton = class extends AbstractButton {
   name;
-  constructor(getParentElement, name, driver) {
-    super(getParentElement, driver);
+  constructor(parentCssSelector, name, driver) {
+    super(parentCssSelector, `#${TOOLBAR_BUTTON_CLASS}-${name}`, driver);
     this.name = name;
-    this.elementBy = import_selenium_webdriver17.By.id(`${TOOLBAR_BUTTON_CLASS}-${name}`);
+  }
+  buttonNotDisplayedError() {
+    return `Button ${this.name} cannot be clicked. It is not displayed or it is disabled`;
+  }
+};
+
+// src/pageObjects/elements/TableToolbar/ToolbarItem.ts
+var GROUP_BUTTON_CLASS = "toolbar-group-button";
+var toolbarItemSelector = (form, name) => byTestIdCssSelector(`ftb-${form}-${name}`);
+var ToolbarItem = class extends AbstractElementWithParent {
+  _button;
+  // private _formName: string;
+  _itemName;
+  constructor(parentCssSelector, formName, itemName, driver) {
+    super(parentCssSelector, toolbarItemSelector(formName, itemName), driver);
+    this._itemName = itemName;
+  }
+  async init() {
+    if (this._button)
+      return this._button;
+    const classNames = await this.getClasses();
+    if (classNames.includes(GROUP_BUTTON_CLASS)) {
+      this._button = new ToolbarGroupButton(this.getFullCssSelector(), this._itemName, this.driver);
+      return;
+    }
+    this._button = new ToolbarButton(this.parentCssSelector, this._itemName, this.driver);
   }
   async click() {
-    const button = await this.getElement();
-    await this.driver.wait(async () => {
-      return await button.isDisplayed() && !await this.isDisabled();
-    }, 1e3, `Button ${this.name} cannot be clicked. It is not displayed or it is disabled`);
-    return click(button, this.driver);
+    await this.init();
+    await this._button.click();
   }
   async isDisabled() {
-    const button = await this.getElement();
-    const result = await button.getAttribute("aria-disabled");
-    return result === "true";
+    await this.init();
+    return await this._button.isDisabled();
   }
 };
 
-// src/pageObjects/elements/TableToolbar/TableToolbar.ts
+// src/pageObjects/elements/TableToolbar/FormToolbar.ts
 var TABLE_TOOLBAR_CLASS = "d5-table-toolbar";
-var TableToolbar = class extends AbstractElementWithParent {
-  constructor(getParentElement, formName, driver) {
-    super(getParentElement, driver);
-    this.elementBy = import_selenium_webdriver18.By.id(`${TABLE_TOOLBAR_CLASS}-${formName}`);
+var FormToolbar = class extends AbstractElementWithParent {
+  formName;
+  constructor(parentCssSelector, formName, driver) {
+    super(parentCssSelector, `#${TABLE_TOOLBAR_CLASS}-${formName}`, driver);
+    this.formName = formName;
   }
-  getTableToolbarElement = () => {
-    return this.driver.findElement(this.elementBy);
-  };
-  async button(name) {
-    const toolbar = await this.getTableToolbarElement();
-    const button = await toolbar.findElement(import_selenium_webdriver18.By.id(`${TOOLBAR_BUTTON_CLASS}-${name}`));
-    if (button) {
-      return new TableToolbarButton(this.getTableToolbarElement, name, this.driver);
+  button(name) {
+    return new ToolbarItem(this.getFullCssSelector(), this.formName, name, this.driver);
+  }
+};
+
+// src/pageObjects/elements/Filters/FormFilterField.ts
+var FormFilterField = class extends AbstractEditor {
+  constructor(parentCssSelector, formName, name, driver) {
+    super(parentCssSelector, byTestIdCssSelector(createLayoutFilterTestId(formName, name)), driver);
+  }
+  /**
+   * Возвращает значение в поле
+   * @example
+   * expect(await form.formFilter('NumberFld').getValue()).toBe(10);
+   * expect(await form.formFilter('TextFld').getValue()).toBe('TestValue');
+   */
+  async getValue() {
+    return super.getValue();
+  }
+  /**
+   * Устанавливает значение в поле
+   * @example
+   * await form.formFilter('NumberFld').setValue(123);
+   * await form.formFilter('TextFld').setValue('TestValue');
+   */
+  async setValue(value) {
+    return super.setValue(value);
+  }
+  /**
+   * Очищает значение в поле
+   * @example
+   * await form.formFilter('NumberFld').clear();
+   */
+  async clear() {
+    return super.clear();
+  }
+  /**
+   * Удаляет тег по переданному тексту
+   * @example
+   * await form.formFilter('TagBox').remove('test');
+   */
+  async remove(itemText) {
+    return super.remove(itemText);
+  }
+};
+
+// src/pageObjects/elements/Filters/FilterPanel.ts
+var import_selenium_webdriver20 = require("selenium-webdriver");
+
+// src/pageObjects/elements/Filters/PanelFilterField.ts
+var PanelFilterField = class extends AbstractEditor {
+  constructor(parentCssSelector, formName, name, driver) {
+    super(parentCssSelector, byTestIdCssSelector(createDocFilterTestId(formName, name)), driver);
+  }
+  /**
+   * Возвращает значение в поле
+   * @example
+   * expect(await form.filterPanel.filterField('NumberFld').getValue()).toBe(10);
+   * expect(await form.filterPanel.filterField('TextFld').getValue()).toBe('TestValue');
+   */
+  async getValue() {
+    return super.getValue();
+  }
+  /**
+   * Устанавливает значение в поле
+   * @example
+   * await form.filterPanel.filterField('NumberFld').setValue(123);
+   * await form.filterPanel.filterField('TextFld').setValue('TestValue');
+   */
+  async setValue(value) {
+    return super.setValue(value);
+  }
+  /**
+   * Очищает значение в поле
+   * @example
+   * await form.filterPanel.filterField('NumberFld').clear();
+   */
+  async clear() {
+    return super.clear();
+  }
+  /**
+   * Удаляет тег по переданному тексту
+   * @example
+   * await form.filterPanel.filterField('TagBox').remove('test');
+   */
+  async remove(itemText) {
+    return super.remove(itemText);
+  }
+};
+
+// src/pageObjects/elements/Filters/FilterPanel.ts
+var drawerSelector = (formName) => `.secondary-drawer-side-panel.form-${formName}`;
+var FILTER_PANEL_SELECTOR = ".filter-panel";
+var CLOSE_SELECTOR = ".button-close";
+var FilterPanel = class extends AbstractElement {
+  _formName;
+  get filterPanelSelector() {
+    return `${this.elementCssSelector} ${FILTER_PANEL_SELECTOR}`;
+  }
+  async filterPanelButtons() {
+    const selector = `${this.elementCssSelector} ${FILTER_PANEL_SELECTOR} .filter-panel__buttons-panel .dx-button-text`;
+    const el = await this.getElement();
+    return el.findElements(import_selenium_webdriver20.By.css(selector));
+  }
+  constructor(formName, driver) {
+    super(driver, drawerSelector(formName));
+    this._formName = formName;
+  }
+  /**
+   * Возвращает фильтр на панели фильтрации
+   * @returns {PanelFilterField}
+   * @example
+   * await form.filterPanel.filterField('NumberFld');
+   */
+  filterField(name) {
+    return new PanelFilterField(this.filterPanelSelector, this._formName, name, this.driver);
+  }
+  async apply() {
+    const btn = await this.findButtonByTitle("\u0417\u0430\u0441\u0442\u043E\u0441\u0443\u0432\u0430\u0442\u0438");
+    await click(btn, this.driver);
+  }
+  async findButtonByTitle(title) {
+    const buttons = await this.filterPanelButtons();
+    for (const btn of buttons) {
+      if (await btn.getText() === title) {
+        return btn;
+      }
     }
-    throw new Error(`Cannot find button by name: ${name}`);
+  }
+  async clearAll() {
+    const btn = await this.findButtonByTitle("\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u0438");
+    await click(btn, this.driver);
+    await this.driver.sleep(300);
+  }
+  async close() {
+    const btn = await this.driver.findElement(import_selenium_webdriver20.By.css(`${this.elementCssSelector} ${CLOSE_SELECTOR}`));
+    await click(btn, this.driver);
   }
 };
 
@@ -1113,7 +1407,7 @@ var TableToolbar = class extends AbstractElementWithParent {
 var ListForm = class extends AbstractForm {
   constructor(driver) {
     super(driver);
-    this.popupContainerBy = import_selenium_webdriver19.By.className(`popup form-inline-${this.formName}`);
+    this.popupContainerCssSelector = `.popup .form-inline-${this.formName}`;
   }
   /**
    * Находит таблицу
@@ -1123,7 +1417,7 @@ var ListForm = class extends AbstractForm {
    * expect(listForm.table());
    */
   table() {
-    return new Table(this.getContainerElement, this.formName, this.driver);
+    return new Table(this.containerCssSelector, this.formName, this.driver);
   }
   /**
    * Находит группу на лист форме по имени
@@ -1133,7 +1427,7 @@ var ListForm = class extends AbstractForm {
    * expect(await formEdit.group('Name');
    */
   group(name) {
-    return new FormGroup(this.getContainerElement, this.formName, name, this.driver);
+    return new FormGroup(this.containerCssSelector, this.formName, name, this.driver);
   }
   /**
    * Находит таблицу
@@ -1143,79 +1437,52 @@ var ListForm = class extends AbstractForm {
    * expect(listForm.toolbarButton());
    */
   toolbarButton(name) {
-    const toolbar = new TableToolbar(this.getContainerElement, this.formName, this.driver);
+    const toolbar = new FormToolbar(this.containerCssSelector, this.formName, this.driver);
     return toolbar.button(name);
   }
-};
-
-// src/utils/signIn.ts
-async function signIn(driver) {
-  const webDriver = driver ?? await createDriver();
-  config().driver = webDriver;
-  const loginPage = new LoginPage(webDriver);
-  await loginPage.locate();
-  await loginPage.authorize();
-  return webDriver;
-}
-
-// src/utils/actions.ts
-var click = async (webElement, driver) => {
-  driver = driver ?? config().driver;
-  const actions = driver.actions({ async: true });
-  await actions.move({ origin: webElement }).click().perform();
-};
-
-// src/pageObjects/pages/LoginPage.ts
-var LOGIN_PATH = "/login";
-var LoginPage = class extends AbstractPage {
-  usernameField = byTestId("loginField", "input");
-  passwordField = byTestId("passwordField", "input");
-  loginButton = byTestId("loginButton");
-  async locate() {
-    await super.locate();
-    const login = await this.driver.findElement(this.usernameField);
-    await waitElementIsVisible({
-      element: login,
-      driver: this.driver
-    });
-  }
-  get path() {
-    return LOGIN_PATH;
-  }
-  async enterUsername(username) {
-    await this.driver.findElement(this.usernameField).sendKeys(username);
-  }
-  async enterPassword(password) {
-    await this.driver.findElement(this.passwordField).sendKeys(password);
-  }
-  async clickLoginButton() {
-    await click(await this.driver.findElement(this.loginButton), this.driver);
-  }
-  async loginWith(username, password) {
-    await this.enterUsername(username);
-    await this.enterPassword(password);
-    await this.clickLoginButton();
+  /**
+   * Фильтр который расположен на форме
+   * @example
+   * const listForm = new MyForm();
+   * //...
+   * expect(listForm.formFilter());
+   */
+  formFilter(name) {
+    return new FormFilterField(this.containerCssSelector, this.formName, name, this.driver);
   }
-  async authorize() {
-    await this.loginWith(config().auth.login, config().auth.password);
+  /**
+   * Модель панели фильтрации
+   * @returns {FilterPanel}
+   * @example
+   * const listForm = new MyForm();
+   * //...
+   * expect(listForm.filterPanel());
+   */
+  get filterPanel() {
+    return new FilterPanel(this.formName, this.driver);
   }
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AbstractPage,
+  FilterPanel,
   FormEdit,
   FormField,
+  FormFilterField,
   ListForm,
   LoginPage,
   NumberEditor,
+  PanelFilterField,
   SubsystemsPanel,
   TextEditor,
   byTestId,
+  byTestIdCssSelector,
   click,
   config,
   createDriver,
   editorFactory,
   elementIsNotPresent,
   signIn,
+  wait,
   waitElementIsVisible
 });