We Keep Coding

C# Selenium WebElement.Click throws exception not interactable

enter image description here
enter image description here
enter image description here
enter image description here
When I start the program, it starts and runs fine until it goes to the point where I want the driver to click the button and it throws me the exception the web element not intractable. I've tried a lot of methods but none of them worked. The problem I think is that when this button is clicked the HTMl changes. Please help :D
this is the line of code that trows me the exception (C#) :
driver.FindElement(By.XPath("//button[#id='exifInfoMobile']")).Click();
error : OpenQA.Selenium.ElementNotInteractableException: 'element not interactable
(Session info: chrome=103.0.5060.114)'
and this is the HTML :
<li class="photo-info">
<button class="btn btn-photo-info" id="exifInfoMobile">
<span class="text">info</span>
</button>
</li>
I've tried with WebDriverWait , By class name and by id but it didn't work. I think it has something to do with a model because when this button is clicked, the sites html changes by adding an info panel on the right. Sorry again for the bad question but its my first time asking one here.

If a regular .click() does not work, you can click with JavaScript.
You can use this
var element = sel.driver.FindElement(By.Id("exifInfoMobile"));
((IJavaScriptExecutor)driver).ExecuteScript("arguments[0].click();", element);
or this
IJavaScriptExecutor js = (IJavaScriptExecutor)driver;
var element = sel.driver.FindElement(By.Id("exifInfoMobile"));
js.ExecuteScript("arguments[0].click();", element);

HTML 'a' tag missing the 'href' attribute

I would like to ask regarding automatic navigation through website powered by Angular using C# WebBrowser class. The point is to download a certain file from the site. I can navigate to the correct page quite OK (I managed to resolve the issue with an 'input' element without any 'form' that surrounds it, weird angular stuff...). The issue is with downloading the file.
Obviously, I don't want to display the 'Save To' dialog to user that pops up when I invoke click on the element. The thing is, body of the page in the WebBrowser instance looks in the incriminated place like this:
<a class="label clickable ng-star-inserted" draggable="true">
<i class="ng-star-inserted ico ico-file ico-ft-pdf"></i>
<div class="text ng-star-inserted">
<h4>SRS Peer Review Checklist</h4>
<p class="ng-star-inserted">Breanne - 01/04/2019 10:06 PM </p>
<p><span class="state-name ng-star-inserted"></span></p>
</div>
</a>
while in my FireFox browser, the HTML looks like this (notice the 'href' attribute is there):
Surprisingly, the WebBrowser loaded page is missing the 'href' attribute of the 'a' element. All the rest works just fine, so the WebBrowser can't be totally broken. Is there something I am missing? Possibly some Angular-friendly setting that will allow the dynamically built attributes to display properly? The rest of navigation is done more by invoking 'click' or 'submit' events on particular HtmlElement objects.

Selenium - Discerning Between Identical <articles>, C#

I'm trying to have my program sit on a webpage and wait for specific tagName within an article to appear. Problem is, I need Selenium to check the article contains two tagNames before clicking it, that's where I'm stumped. The way I have my code setup right now, it doesn't click anywhere. It just sits on the page, I suspect because there's more than one article with the same main tagName that I'm trying to find. Here's the HTML:
<article>
<div class ="inner-article">
<a href ="/shop/shirts/iycbmgtqw/x9vdawcjg" style="height:150px;">
<img alt="Xrtqh7ar444" height="150" src="//d17ol771963kd3.cloudfront.net/120885/vi/xrTQH7Ar444.jpg" width="150">
</a>
<h1>
EXAMPLE_CODE
</h1>
<p>
EXAMPLE_COLOUR
</p>
</div>
</article>
All other items on this page have an identical class, and some have identical tagNames. I want to search for when there's a specific combination of two tagNames in an article. I realize xPath is an option, but I would like to code it before knowing an xPath, where the name of the item is the only available information.
And here's the code I'm working with at the moment:
driver.Manage().Timeouts().ImplicitlyWait(TimeSpan.FromMinutes(10));
IWebElement test = driver.FindElement(By.TagName(textBox12.Text));
test.Click();
where textBox12.Text is "EXAMPLE_CODE". Am I correct in assuming that WebDriver doesn't click anything because there is more than one element with the tagName "EXAMPLE_CODE", and is there a possible way to make it first look for "EXAMPLE_CODE" and then check the secondary: "EXAMPLE_COLOUR"?
Thanks!!

You are using By.TagName incorrectly. Tag refers to the type of element you are trying to find. In this case for the link it is 'a'. Or in case of a div it is 'div'. Te correct way of finding with tagname for a link would be - By.TagName("a").
You need to match text and you will need to use xpath. Assuming that the code is unique you should try.
XPath to get the code href -- //div[class='inner-article']/h1/a[.=EXAMPLE_CODE]
XPath to get the color href -- //div[class='inner-article']/h1/a[.=EXAMPLE_CODE]/following-sibling::a

Execute a java script to make an element visible

I'm trying to automate the use of a website using Selenium, at one time I want to click on a hidden button defined this way :
<body>
<div class="smenu" id="smenu4">
<input tabIndex="-1" type="button" onclick="SearchEng" value="FindEng" />
<!--> Lots of inputs <!-->
</div>
</body>
I already tried to simply click the button, but it doesn't work. I can select it and retrieve information though. That's why I'm now trying to run a javascript to make the button visible before clicking it. Here is my code :
IWebElement element = driver.FindElement(By.XPath("//div[#id='smenu4']/input[#value=FindEng"));
String js = "arguments[0].style.height='auto'; arguments[0].style.visibility='visible';";
((IJavaScriptExecutor)driver).ExecuteScript(js, element);
The thing is nothing happens when I launch it. Is it possible that I can't run scripts ? Can you run them on any website ? - I use internet explorer 11, windows 7. Thanks !

Inspect the element in your Browser and check that what is the reason that the element is invisible. Or just simply compare the element when it is visible or not. Possible reasons:
The element is not in the DOM yet.
The element hasn't got width and/or height.
visibility parameter. (http://www.w3schools.com/cssref/pr_class_visibility.asp)
display parameter. (http://www.w3schools.com/cssref/pr_class_display.asp)
When you know the reason, you will know the solution :)

Unable to locate dropdown created by jQuery plugin

I am writing an automation test script in C# using Selenuim Webdriver where I need to click on two dropdowns one by one. Here is the HTML source code of the two dropdown elements:
<select id="ServiceTypeId" class="chosen chzn-done" tabindex="-1" name="ServiceTypeId" style="display: none;"></select>
<div id="ServiceTypeId_chzn" class="chzn-container chzn-container-single">
<a class="chzn-single" tabindex="-1" href="javascript:void(0)"><span>Choose an Option</span></a>
<div class="chzn-drop"></div>
</div>
</div>
<select id="PropertyTypeId" class="chosen chzn-done" tabindex="-1" name="PropertyTypeId" style="display: none;"></select>
<div id="PropertyTypeId_chzn" class="chzn-container chzn-container-single">
<a class="chzn-single" tabindex="-1" href="javascript:void(0)"></a>
<div class="chzn-drop"></div>
</div>
I am able to successfully locate an element in the first dropdown (ServiceTypeId) by CssSelector like this:
driver.FindElement(By.CssSelector("div.chzn-container a.chzn-single")).Click();
Thread.Sleep(1000);
driver.FindElements(By.CssSelector("div.chzn-drop li.active-result"))[5].Click();
Thread.Sleep(500);
But I am unable to locate the second dropdown(PropertyTypeId) as they both have the same classes applied to them.
I tried using to locate them using their ID but its not working:
driver.FindElement(By.Id("PropertyTypeId_chzn")).Click();
I think this plugin has been used to create the dowpdowns: jQuery plugin
Can someone please help me find a way to do this?
EDIT:
The two elements are set to display:none and hence when I am trying to click them using driver.FindElement(By.Id("ServiceTypeId")).Click(); I am getting the error:
Element is not currently visible and so may not be interacted with

Try css3 pseudoselector
driver.FindElement(By.CssSelector("select:nth-of-type(1)")).Click();

It doesn't matter how these dropdowns were created, problem with selector i think. BTW, if in future you want to select value from dropDowns don't forget to click on dropDown first, then select value from it. Anyway, next code should work:
driver.FindElement(By.CssSelector("#ServiceTypeId"));
driver.FindElement(By.CssSelector("#PropertyTypeId"));
UPDATE
//Click on first a link then li will appear in div. Click on 6th elem
driver.findElement(By.CssSelector("#ServiceTypeId_chzn > a")).click();
driver.findElements(By.CssSelector("#ServiceTypeId_chzn .chzn-drop > li"))[5].click();
//Same for second
driver.findElement(By.CssSelector("#PropertyTypeId_chzn > a")).click();
driver.findElements(By.CssSelector("#PropertyTypeId_chzn .chzn-drop > li"))[5].click();

I found out the solution to this and would like to share it as it may help someone else facing similar issue.
The main problem was that the elements were set to display:none and so before clicking them they should be made visible. I can be done using JavaScript like this:
IJavaScriptExecutor js = driver as IJavaScriptExecutor;
js.ExecuteScript("document.getElementById('ServiceTypeId').style.display = '';");
Thread.Sleep(500);
driver.FindElement(By.Id("ServiceTypeId")).Click();
Thread.Sleep(300);
js.ExecuteScript("document.getElementById('PropertyTypeId').style.display = '';");
Thread.Sleep(2000);
driver.FindElement(By.Id("PropertyTypeId")).Click();
Thread.Sleep(500);
Thanks.