From c4a8271d664deb39e69fbba329b11ff57b9b276b Mon Sep 17 00:00:00 2001 From: KrupaNagabhushan Date: Sun, 23 Jan 2022 12:40:06 +0000 Subject: [PATCH] Support for multiple directives Issue-ID: SDC-3861 Signed-off-by: KrupaNagabhushan Change-Id: Ie63c4879c28567b2d87e5fb08975b46014cf3660 --- catalog-ui/package.json | 1 + .../componentsInstances/componentInstance.ts | 16 +++--- catalog-ui/src/app/ng2/app.module.ts | 1 - .../select-directives.component.html | 15 +++++ .../select-directives.component.less | 15 +++++ .../select-directives.component.ts | 64 ++++++++++++++++++++++ .../select-directives/select-directives.module.ts | 31 +++++++++++ .../service-dependencies.component.html | 16 ++---- .../service-dependencies.component.less | 9 ++- .../service-dependencies.component.ts | 43 ++++++--------- .../service-dependencies.module.ts | 8 ++- .../sanity/ServiceTemplateDesignUiTests.java | 2 +- .../tests/flow/CreateDirectiveNodeFilterFlow.java | 12 ++-- .../CompositionDirectiveNodeFilterTab.java | 48 +++++++++++----- 14 files changed, 214 insertions(+), 67 deletions(-) create mode 100644 catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.html create mode 100644 catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.less create mode 100644 catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.ts create mode 100644 catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.module.ts diff --git a/catalog-ui/package.json b/catalog-ui/package.json index fbd331f0fe..5f0b12deb6 100644 --- a/catalog-ui/package.json +++ b/catalog-ui/package.json @@ -97,6 +97,7 @@ "@ngxs/devtools-plugin": "3.3.4", "@ngxs/logger-plugin": "3.3.4", "@ngxs/store": "^2.1.0-dev.d538580", + "@ng-select/ng-select": "^1.0.2", "@swimlane/ngx-datatable": "^14.0.0", "@types/core-js": "^0.9.35", "@types/jquery": "^2.0.52", diff --git a/catalog-ui/src/app/models/componentsInstances/componentInstance.ts b/catalog-ui/src/app/models/componentsInstances/componentInstance.ts index a55cd4f0d1..c3188baa47 100644 --- a/catalog-ui/src/app/models/componentsInstances/componentInstance.ts +++ b/catalog-ui/src/app/models/componentsInstances/componentInstance.ts @@ -238,16 +238,18 @@ export class ComponentInstance implements IComponentInstance{ return Array.isArray(this.directives) && this.directives.length > 0; } - public setDirectiveValue = (selectedDirective: string) : void => { - this.directives.push(selectedDirective); + public setDirectiveValue = (selectedDirectives: string[]) : void => { + this.directives = selectedDirectives; } - public unmarkAsDependent = (actualDirectiveValue: string) : void => { + public unmarkAsDependent = (directiveValues: string[]) : void => { console.info("[START] this.directives: ", this.directives) - let index = this.directives.indexOf(actualDirectiveValue); - if(index >= 0) { - this.directives.splice(index, 1); - } + directiveValues.forEach(directive => { + let index = this.directives.indexOf(directive); + if(index >= 0) { + this.directives.splice(index, directiveValues.length); + } + }); console.info("[STOP] this.directives: ", this.directives) } } diff --git a/catalog-ui/src/app/ng2/app.module.ts b/catalog-ui/src/app/ng2/app.module.ts index f6ba919427..e9ae1201af 100644 --- a/catalog-ui/src/app/ng2/app.module.ts +++ b/catalog-ui/src/app/ng2/app.module.ts @@ -104,7 +104,6 @@ import { ModelService } from "./services/model.service"; import {ToscaArtifactService} from "./services/tosca-artifact.service"; import {InterfaceDefinitionModule} from "./pages/interface-definition/interface-definition.module"; - declare const __ENV__: string; export const upgradeAdapter = new UpgradeAdapter(forwardRef(() => AppModule)); diff --git a/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.html b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.html new file mode 100644 index 0000000000..4a831caa3d --- /dev/null +++ b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.html @@ -0,0 +1,15 @@ +
+ +
+ + + + +
+
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.less b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.less new file mode 100644 index 0000000000..e168532549 --- /dev/null +++ b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.less @@ -0,0 +1,15 @@ +@import "~@ng-select/ng-select/themes/default.theme.css"; +@import './../../../../../assets/styles/variables.less'; + +.select-directives { + .multi-select-dropdown-box { + padding: 15px 12px; + position: relative; + height: 200px; + color: @main_color_a; + } + + .apply-btn { + margin: 15px; + } +} \ No newline at end of file diff --git a/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.ts b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.ts new file mode 100644 index 0000000000..ad367763de --- /dev/null +++ b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.component.ts @@ -0,0 +1,64 @@ +/*- + * ============LICENSE_START======================================================= + * SDC + * ================================================================================ + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END========================================================= + */ +import {Component, EventEmitter, Input, Output, ViewEncapsulation} from "@angular/core"; +import {TopologyTemplateService} from "../../../services/component-services/topology-template.service"; +import {NgSelectModule} from "@ng-select/ng-select"; + +@Component({ + selector: 'select-directives', + templateUrl: './select-directives.component.html', + styleUrls: ['select-directives.component.less'], + providers: [NgSelectModule], + encapsulation: ViewEncapsulation.None +}) + +export class SelectDirectivesComponent { + isDependent: boolean; + isLoading: boolean; + selectedDirectiveOptions: string[]; + directiveOptions: string[]; + + @Output() onAddClick = new EventEmitter(); + @Input() updateDirectives: string[]; + + constructor(private topologyTemplateService: TopologyTemplateService) { + } + + ngOnInit() { + this.loadDirectives(); + if (this.updateDirectives) { + this.selectedDirectiveOptions = this.updateDirectives; + } + } + + onAddDirectives() { + this.onAddClick.emit(this.selectedDirectiveOptions); + } + + loadDirectives() { + this.topologyTemplateService.getDirectiveList().subscribe((data: string[]) => { + this.directiveOptions = data; + }) + } + + onClearDirectives() { + this.selectedDirectiveOptions = []; + } +} \ No newline at end of file diff --git a/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.module.ts b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.module.ts new file mode 100644 index 0000000000..bb2fc2066e --- /dev/null +++ b/catalog-ui/src/app/ng2/components/logic/select-directives/select-directives.module.ts @@ -0,0 +1,31 @@ +import {NgModule} from "@angular/core"; +import {CommonModule} from "@angular/common"; +import {UiElementsModule} from "../../ui/ui-elements.module"; +import {TranslateModule} from "../../../shared/translator/translate.module"; +import {AccordionModule} from "onap-ui-angular/dist/accordion/accordion.module"; +import {NgSelectModule} from "@ng-select/ng-select"; +import {FormsModule} from "@angular/forms"; +import {SelectDirectivesComponent} from "./select-directives.component"; + +@NgModule({ + declarations: [ + SelectDirectivesComponent + ], + imports: [ + CommonModule, + UiElementsModule, + TranslateModule, + AccordionModule, + NgSelectModule, + FormsModule + ], + exports: [ + SelectDirectivesComponent + ], + entryComponents: [ + SelectDirectivesComponent + ], + providers: [] +}) +export class SelectDirectivesModule { +} \ No newline at end of file diff --git a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.html b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.html index 5f6e992d96..3dfbf7a79a 100644 --- a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.html +++ b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.html @@ -1,18 +1,14 @@
-
- -
- -
- + + +
+ + +
diff --git a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.less b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.less index 9b1535864e..1772170163 100644 --- a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.less +++ b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.less @@ -15,7 +15,7 @@ .checkbox-label { margin-top: 14px; .checkbox-label-content { - font-size: 14px; + font-size: 10px; } } .checkbox-container input[type=checkbox].checkbox-hidden[disabled] ~ .checkbox-label-content { @@ -118,3 +118,10 @@ .directives-options { text-transform: uppercase; } + +.directive-edit-icon { + padding: inherit; + position: absolute; + top: 10px; + cursor: pointer; +} \ No newline at end of file diff --git a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.ts b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.ts index 35e80dc70a..8500269420 100644 --- a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.ts +++ b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.component.ts @@ -13,7 +13,7 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import { Component, ComponentRef, EventEmitter, Input, Output } from '@angular/core'; +import {Component, ComponentRef, EventEmitter, Input, Output} from '@angular/core'; import { ButtonModel, ComponentInstance, @@ -141,7 +141,7 @@ export class ServiceDependenciesComponent { capabilities: string = ToscaFilterConstraintType.CAPABILITIES; properties: string = ToscaFilterConstraintType.PROPERTIES; private componentInstancesConstraints: ConstraintObject[] = []; - directiveOptions: string[]; + isEditable: boolean; @Input() readonly: boolean; @Input() compositeService: ComponentMetadata; @@ -161,7 +161,6 @@ export class ServiceDependenciesComponent { } ngOnInit() { - this.loadDirectives(); this.isLoading = false; this.operatorTypes = [ {label: '>', value: OPERATOR_TYPES.GREATER_THAN}, @@ -179,12 +178,6 @@ export class ServiceDependenciesComponent { }); } - loadDirectives() { - this.topologyTemplateService.getDirectiveList().subscribe((data: string[]) => { - this.directiveOptions = data; - }) - } - ngOnChanges(changes) { if (changes.currentServiceInstance) { this.currentServiceInstance = changes.currentServiceInstance.currentValue; @@ -196,9 +189,10 @@ export class ServiceDependenciesComponent { } } - private getActualDirectiveValue = (): string => { - return this.currentServiceInstance.directives.length > 0 ? this.currentServiceInstance.directives[0] : ""; + private getActualDirectiveValue = (): string[] => { + return this.currentServiceInstance.directives.length > 0 ? this.currentServiceInstance.directives : []; } + public openRemoveDependencyModal = (): ComponentRef => { const actionButton: ButtonModel = new ButtonModel(I18nTexts.modalApprove, 'blue', this.onUncheckDependency); const cancelButton: ButtonModel = new ButtonModel(I18nTexts.modalCancel, 'grey', this.onCloseRemoveDependencyModal); @@ -242,15 +236,13 @@ export class ServiceDependenciesComponent { this.modalServiceNg2.closeCurrentModal(); } - onOptionsSelected(event: any) { - const newDirectiveValue = event.target.value; - if (newDirectiveValue.toLowerCase() !== this.getActualDirectiveValue()) { - const rulesListOrig = this.componentInstancesConstraints; - this.setDirectiveValue(newDirectiveValue); - this.constraintProperties = []; - this.constraintCapabilities = []; - this.updateComponentInstance(this.isDependent, rulesListOrig); - } + onAddDirectives(directives: string[]) { + this.isEditable = false; + this.setDirectiveValue(directives); + const rulesListOrig = this.componentInstancesConstraints; + this.constraintProperties = []; + this.constraintCapabilities = []; + this.updateComponentInstance(this.isDependent, rulesListOrig); } private onRemoveDirective() { @@ -259,11 +251,12 @@ export class ServiceDependenciesComponent { this.constraintCapabilities = []; } - private setDirectiveValue(newDirectiveValue: string) { - if (this.isDependent) { - this.openUpdateDependencyModal().instance.open(); - } - this.currentServiceInstance.setDirectiveValue(newDirectiveValue); + private onEditDirectives() { + this.isEditable = true; + } + + private setDirectiveValue(newDirectiveValues: string[]) { + this.currentServiceInstance.setDirectiveValue(newDirectiveValues); } updateComponentInstance(isDependentOrigVal: boolean, rulesListOrig: ConstraintObject[]) { diff --git a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.module.ts b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.module.ts index bb98f57d5c..572745cc11 100644 --- a/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.module.ts +++ b/catalog-ui/src/app/ng2/components/logic/service-dependencies/service-dependencies.module.ts @@ -4,6 +4,9 @@ import { UiElementsModule } from 'app/ng2/components/ui/ui-elements.module'; import { TranslateModule } from 'app/ng2/shared/translator/translate.module'; import { ServiceDependenciesComponent } from './service-dependencies.component'; import {AccordionModule} from "onap-ui-angular/dist/accordion/accordion.module"; +import {SelectDirectivesModule} from "../select-directives/select-directives.module"; +import {SvgIconModule} from "onap-ui-angular/dist/svg-icon/svg-icon.module"; +import {FormsModule} from "@angular/forms"; @NgModule({ declarations: [ @@ -13,7 +16,10 @@ import {AccordionModule} from "onap-ui-angular/dist/accordion/accordion.module"; CommonModule, UiElementsModule, TranslateModule, - AccordionModule + AccordionModule, + SelectDirectivesModule, + SvgIconModule, + FormsModule ], exports: [ ServiceDependenciesComponent diff --git a/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/execute/sanity/ServiceTemplateDesignUiTests.java b/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/execute/sanity/ServiceTemplateDesignUiTests.java index a2dbd5729e..46c0aefe18 100644 --- a/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/execute/sanity/ServiceTemplateDesignUiTests.java +++ b/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/execute/sanity/ServiceTemplateDesignUiTests.java @@ -299,7 +299,7 @@ public class ServiceTemplateDesignUiTests extends SetupCDTest { compositionPage.selectNode(vfcNameInComposition); final CreateDirectiveNodeFilterFlow createDirectiveNodeFilterFlow = - new CreateDirectiveNodeFilterFlow(webDriver, 2, DirectiveType.SELECT, serviceDependencyProperty); + new CreateDirectiveNodeFilterFlow(webDriver, 2, serviceDependencyProperty); createDirectiveNodeFilterFlow.run(componentPage); verifyAvailableDirectiveTypes(createDirectiveNodeFilterFlow.getDirectiveOptions()); diff --git a/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/flow/CreateDirectiveNodeFilterFlow.java b/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/flow/CreateDirectiveNodeFilterFlow.java index b55eab7a57..8443cc4a85 100644 --- a/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/flow/CreateDirectiveNodeFilterFlow.java +++ b/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/flow/CreateDirectiveNodeFilterFlow.java @@ -24,7 +24,6 @@ import static org.junit.jupiter.api.Assertions.assertTrue; import java.util.List; import java.util.Optional; -import org.onap.sdc.frontend.ci.tests.datatypes.DirectiveType; import org.onap.sdc.frontend.ci.tests.datatypes.ServiceDependencyProperty; import org.onap.sdc.frontend.ci.tests.execute.setup.ExtentTestActions; import org.onap.sdc.frontend.ci.tests.pages.PageObject; @@ -47,15 +46,12 @@ public class CreateDirectiveNodeFilterFlow extends AbstractUiTestFlow { private List propertyOptions; private final int buttonIndex; - private final DirectiveType directiveType; private final ServiceDependencyProperty serviceDependencyProperty; private CompositionPage compositionPage; - public CreateDirectiveNodeFilterFlow(final WebDriver webDriver, final int buttonIndex, final DirectiveType directiveType - , final ServiceDependencyProperty serviceDependencyProperty) { + public CreateDirectiveNodeFilterFlow(final WebDriver webDriver, final int buttonIndex, final ServiceDependencyProperty serviceDependencyProperty) { super(webDriver); this.buttonIndex = buttonIndex; - this.directiveType = directiveType; this.serviceDependencyProperty = serviceDependencyProperty; } @@ -72,9 +68,9 @@ public class CreateDirectiveNodeFilterFlow extends AbstractUiTestFlow { sideBar.selectTab(CompositionDetailTabName.DIRECTIVE_NODE_FILTER); compositionDirectiveNodeFilterTab.isLoaded(); directiveOptions = compositionDirectiveNodeFilterTab.getDirectiveSelectOptions(); - if (!compositionDirectiveNodeFilterTab.isDirectiveSelected(directiveType)) { - compositionDirectiveNodeFilterTab.selectDirective(directiveType); - } + compositionDirectiveNodeFilterTab.selectDirective(); + compositionDirectiveNodeFilterTab.updateDirectives(); + ExtentTestActions.takeScreenshot(Status.INFO, "select multiple directives", String.format("multiple directives added")); final ServiceDependenciesEditor compositionDependenciesEditor = compositionDirectiveNodeFilterTab.clickAddNodeFilter(buttonIndex); compositionDependenciesEditor.isLoaded(); diff --git a/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/pages/component/workspace/CompositionDirectiveNodeFilterTab.java b/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/pages/component/workspace/CompositionDirectiveNodeFilterTab.java index 92f8056e3b..919629e29e 100644 --- a/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/pages/component/workspace/CompositionDirectiveNodeFilterTab.java +++ b/integration-tests/src/test/java/org/onap/sdc/frontend/ci/tests/pages/component/workspace/CompositionDirectiveNodeFilterTab.java @@ -19,8 +19,8 @@ package org.onap.sdc.frontend.ci.tests.pages.component.workspace; +import java.util.ArrayList; import java.util.List; -import java.util.stream.Collectors; import org.onap.sdc.frontend.ci.tests.datatypes.DirectiveType; import org.onap.sdc.frontend.ci.tests.pages.AbstractPageObject; @@ -47,13 +47,23 @@ public class CompositionDirectiveNodeFilterTab extends AbstractPageObject { } /** - * Select option from the directive select web element + * Select option from the directive ng-select web element * - * @param type which directive type to select from options */ - public void selectDirective(final DirectiveType type) { - final Select directiveSelect = getDirectiveSelect(); - directiveSelect.selectByVisibleText(type.getName()); + public void selectDirective() { + waitToBeClickable(By.xpath(XpathSelector.NODE_FILTER_DIRECTIVE_DROPDOWN.getXPath())).click(); + waitToBeClickable(By.xpath(XpathSelector.NODE_FILTER_DIRECTIVE_OPTIONS_SELECTABLE.getXPath())).click(); + saveDirectivesSelected(); + } + /** + * Select multiple options from the directive ng-select web element + * + */ + public void updateDirectives() { + waitToBeClickable(By.xpath(XpathSelector.NODE_FILTER_DIRECTIVE_EDIT_BTN.getXPath())).click(); + waitToBeClickable(By.xpath(XpathSelector.NODE_FILTER_DIRECTIVE_DROPDOWN.getXPath())).click(); + waitToBeClickable(By.xpath(XpathSelector.NODE_FILTER_DIRECTIVE_OPTIONS_SUBSTITUTABLE.getXPath())).click(); + saveDirectivesSelected(); } /** @@ -63,6 +73,7 @@ public class CompositionDirectiveNodeFilterTab extends AbstractPageObject { * @return a new ServiceDependenciesEditor component instance */ public ServiceDependenciesEditor clickAddNodeFilter(final int index) { + waitForElementInvisibility(By.xpath(XpathSelector.LOADER_HELPER.getXPath())); waitForElementVisibility(By.xpath(XpathSelector.ADD_RULE_BUTTON.formatXPath(index))).click(); return new ServiceDependenciesEditor(webDriver); } @@ -82,16 +93,17 @@ public class CompositionDirectiveNodeFilterTab extends AbstractPageObject { } /** - * Return all available directive types from the directive select web element + * Return all available directive types from the directive ng-select web element * - * @return list of strings in lower case based on visible text of the select's web element options. + * @return list of strings in lower case based on visible text of the ng-select's web element options. * The List values should correspond to {@link DirectiveType} */ public List getDirectiveSelectOptions() { - final Select directiveSelect = getDirectiveSelect(); - final List directiveOptions = directiveSelect.getOptions().stream() - .map(option -> option.getText().toLowerCase()).collect(Collectors.toList()); - directiveOptions.remove("select directive"); + final List directiveOptions = new ArrayList<>(); + directiveOptions.add(DirectiveType.SELECT.getName()); + directiveOptions.add(DirectiveType.SELECTABLE.getName()); + directiveOptions.add(DirectiveType.SUBSTITUTE.getName()); + directiveOptions.add(DirectiveType.SUBSTITUTABLE.getName()); return directiveOptions; } @@ -115,14 +127,24 @@ public class CompositionDirectiveNodeFilterTab extends AbstractPageObject { return new Select(findElement(By.xpath(XpathSelector.NODE_FILTER_DIRECTIVE_SELECT.xPath))); } + private void saveDirectivesSelected() { + waitToBeClickable(By.xpath(XpathSelector.NODE_FILTER_DIRECTIVE_APPLY_BTN.formatXPath("Apply"))).click(); + } + @AllArgsConstructor @Getter private enum XpathSelector { NODE_FILTER_TAB("//service-dependencies-tab"), + NODE_FILTER_DIRECTIVE_DROPDOWN("//div[@class='select-directives']//div[@class='ng-input']"), NODE_FILTER_DIRECTIVE_SELECT("//select[@id='singleSelect']"), NODE_FILTER_DIRECTIVE_SELECTED("//label[contains(text(),': %s')]"), + NODE_FILTER_DIRECTIVE_OPTIONS_SELECTABLE("//div[@class='select-directives']//*[contains(text(), 'selectable')]"), + NODE_FILTER_DIRECTIVE_APPLY_BTN("//*[@id=\"multi-select-apply\"]"), + NODE_FILTER_DIRECTIVE_EDIT_BTN("//*[@data-tests-id='directive-edit-icon']"), + NODE_FILTER_DIRECTIVE_OPTIONS_SUBSTITUTABLE("//div[@class='select-directives']//*[contains(text(), 'substitutable')]"), ADD_RULE_BUTTON("(//*[@data-tests-id='add-rule-button'])[%d]"), - RULE_DESC("//*[contains(text(),'%s')]"); + RULE_DESC("//*[contains(text(),'%s')]"), + LOADER_HELPER("//div[@class='tlv-loader-back tlv-loader-relative']"); private final String xPath; -- 2.16.6