Expected Condition Failed: Waiting For Element To Be Clickable For Element Containing Style="display: None;"

I tried to input values in spin button (Textbox with increment and decrement arrows). Below code throws an error: Expected condition failed:waiting for element to be clickable. C

Solution 1:

As per the HTML you have shared, the desired element i.e. the input field is having the attribute style="display: none;". So to send a character sequence to the input field you can use the following solution:

WebElement ele5 = driver.findElement(By.xpath("//input[@class='k-overwrite k-input' and @id='DurationInMins']"));
((JavascriptExecutor)driver).executeScript("arguments[0].removeAttribute('style')", ele5)
ele5.clear();
ele5.sendKeys("45");

Solution 2:

try this code :

        WebDriverWait wait = new WebDriverWait(driver, 20);
        wait.until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//input[@id='DurationInMins' and @name='DurationInMins' and contains(@data-val-required,'The DurationInMins field is required')]/preceding-sibling::input")));
        WebElement ele5 = wait.until(ExpectedConditions.elementToBeClickable(By.xpath("//input[@id='DurationInMins' and @name='DurationInMins' and contains(@data-val-required,'The DurationInMins field is required')]/preceding-sibling::input")));
        ele5.clear();  
        ele5.sendKeys("45"); 

If this is the input field :

<inputclass="k-overwrite k-input" data-val="true" data-val-number="The field Capacity must be a number." data-val-required="The Capacity field is required."id="Capacity"min="0" name="Capacity"type="text" value="0" data-role="numerictextbox" role="spinbutton" aria-valuemin="0" style="display: none;" aria-valuenow="0" aria-disabled="false">  

Then you have to use : locator as :

By.id("Capacity")  

or

By.name("Capacity") 

or

By.cssSelector("input[role='spinbutton']") 

Hope this will be helpful.

Solution 3:

When executed this HTML I got this in UI inputbox

i.e only input box and not Textbox with increment and decrement arrows: further when inspecting the text box or input box I am able to enter into the text box using:

WebElementinputField= driver.findElement(By.cssSelector("span.k-state-default input"));
inputField.sendKeys("45");

There are two input fields present in HTML code and when trying to inspect it is the first input tag that is editable and it can be filled with values.

This should work if I got the exact idea of the UI that you have mentioned in the question i.e Textbox with increment and decrement arrows (As I do not see any arrow buttons )

Because while running HTML, in console it is showing kendo not defined and no increment/decrement buttons are visible.