How to create customized locator in Selenium with large value of id and class name attributes

user_2093986 0
Viewed 217

Can someone help me with how to generate Xpath with the below html snippet. I am struggling to make xpath for it , as the id ,class to are big ...please help how to generate Xpath for this.

<input class="js-text-full text-full form-text required" data-drupal-selector="edit-page-content-0-subform-page-layout-content-0-subform-slot-1-0-subform-slot-content-form-inline-entity-form-module-type-content-0-subform-module-a-content-0-subform-large-composite-image-carousel-0-subform-large-composite-images-0-subform-header-text-0-subform-header-text-header-text-lines-0-subform-header-text-line-text-items-0-subform-text-items-items-0-subform-text-styled-text-0-value" type="text" id="edit-page-content-0-subform-page-layout-content-0-subform-slot-1-0-subform-slot-content-form-inline-entity-form-module-type-content-0-subform-module-a-content-0-subform-large-composite-image-carousel-0-subform-large-composite-images-0-subform-header-text-0-subform-header-text-header-text-lines-0-subform-header-text-line-text-items-0-subform-text-items-items-0-subform-text-styled-text-0-value--5OtB_Vbe-qw" name="page_content[0][subform][page_layout_content][0][subform][slot_1][0][subform][slot_content][form][inline_entity_form][module_type_content][0][subform][module_a_content][0][subform][large_composite_image_carousel][0][subform][large_composite_images][0][subform][header_text][0][subform][header_text__header_text_lines][0][subform][header_text_line__text_items][0][subform][text_items__items][0][subform][text_styled_text][0][value]" value="" size="60" maxlength="255" placeholder="" required="required" aria-required="true">
webdriverwait selenium-webdriver selenium css-selectors xpath
3 Answers

if your class is unique, you can just use it:

//input[@class="js-text-full text-full form-text required"]

if you think class name is too long you can go for contains and mention partial matching string:

//input[contains(@class,"form-text required")]

if your class is not unique you can try using it with combination of other attributes like type

//input[contains(@class,"form-text required") and @type="text"]

Or you can use it with the combination of class name and partial matching id:

//input[@class="js-text-full text-full form-text required" and contains(@id,"edit-page-content")]
user_10734130

Use this Xpath //input[@class="js-text-full text-full form-text required"]

if its not working pls share your Html elements here

user_60599670

Larger value of id or class name shouldn't be a barrier when you construct logical Locator Strategies. It's an <input> element and possibly moving forward you'd interact with the element and as the element is a dynamic element, so you need to induce WebDriverWait for the elementToBeClickable() and you can use either of the following Locator Strategies:

  • Using python and cssSelector:

    element = WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "input.js-text-full.text-full.form-text.required[data-drupal-selector^='edit-page-content'][maxlength='255'][placeholder]"))).click()

  • Using java and xpath:

    WebElement element = new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//input[@class='js-text-full text-full form-text required' and starts-with(@data-drupal-selector, 'edit-page-content')][@placeholder and @maxlength='255']")));
user_74294470
Related