We Keep Coding

Selenium C# - StaleElementReferenceException - Even after refreshing the page

I am getting OpenQA.Selenium.StaleElementReferenceException which is a bit strange since I am refreshing the page. So here is the detail:
The technology we are using is React.
Browser: Chrome ( latest version)
C# with Selenium Webdriver (3.X)
We have a left menu with Li items. On first time page load i can click the left menu item using xpath and it works fine. The left menu adjusts itself so that the item no longer appears inside it. I think this updates the DOM. Ok now when i try to click the next item , i get the stale reference exception. So I did following things:
1- Refresh the page and double/single click - does not work
2- Navigate to another page and come back to this page and double/single click-- does not work
3- Added thread.sleep - does not work
4- Catch the exception and try to find the element again -- does not work.
Is there something i am missng?
Here is the code:
Actions actions = new Actions(driver);
string[] ItemNames = { "OrganizationDepartment","Organization"};
foreach (String ItemName in ItemNames)
{
try
{
driver.Navigate().Refresh();
//Thread.Sleep(3000);
IWebElement source = driver.FindElement(By.XPath("//div[contains(text(),'" + ItemName+ "')]"));
actions.MoveToElement(source).Perform(); // this is where i get the exception for second element.
actions.DoubleClick(source).Perform(); // this is where i get the exception if i comment above line
}
catch (StaleElementReferenceException stale)
{IWebElement source = driver.FindElement(By.XPath("//div[contains(text(),'" + ItemName+ "')]"));
actions.DoubleClick(source).Perform(); // this is where i get the exception
}
Here is the HTML:
<div><div draggable="true"><li style="position: relative;">
<i title="OrganizationDepartment"></i>OrganizationDepartment
<a title="Drag Me" style="cursor: grab; position: absolute; right: 0px; top: 5px;">
<button type="button" class="ms-Button ms-Button--icon iconButton root-124" data-is-focusable="true" style="cursor: grab;">
<div class="ms-Button-flexContainer flexContainer-114">
<i data-icon-name="DragObject" class="ms-Button-icon icon-126" role="presentation"></i></div></button></a></li></div></div>
<div><div draggable="true"><li style="position: relative;">
<i title="Organization"></i>Organization
<a title="Drag Me" style="cursor: grab; position: absolute; right: 0px; top: 5px;">
<button type="button" class="ms-Button ms-Button--icon iconButton root-124" data-is-focusable="true" style="cursor: grab;">
<div class="ms-Button-flexContainer flexContainer-114">
<i data-icon-name="DragObject" class="ms-Button-icon icon-126" role="presentation"></i></div></button></a></li></div></div>

I found the solution. It is not the element but the actions object which was getting staled on second iteration of the loop. I had to re-create the Actions object again and then do this:
NewactionsObject.MoveToElement(source).Perform()

How to click on an element with aria-hidden="true" using Selenium

I have HTML as below
<div class="summary-row">
<div class="text-center" id="summary-back">
<a href="/Health/Dependents">
<svg class="svg-inline--fa fa-chevron-left fa-w-8 font-32" data-auto="back-btn" aria-hidden="true" data-prefix="fal" data-icon="chevron-left" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512" data-fa-i2svg=""><path fill="currentColor" d="M238.475 475.535l7.071-7.07c4.686-4.686 4.686-12.284 0-16.971L50.053 256 245.546 60.506c4.686-4.686 4.686-12.284 0-16.971l-7.071-7.07c-4.686-4.686-12.284-4.686-16.97 0L10.454 247.515c-4.686 4.686-4.686 12.284 0 16.971l211.051 211.05c4.686 4.686 12.284 4.686 16.97-.001z"></path></svg><!-- <i class="fal fa-chevron-left font-32" data-auto="back-btn"></i> -->
</a>
</div>
And RemoteWebDriver unable to find the element and I assume its due to the hidden attribute, How can click on this element ?

You can click on the element using JavaScriptExecutor like:
WebElement element = driver.findElement(By.id("summary-back"));
JavascriptExecutor executor = (JavascriptExecutor)driver;
executor.executeScript("arguments[0].click();", element);

To click() on the element you have to induce WebDriverWait for the element to be clickable and you can use either of the following Locator Strategies:
CssSelector:
new WebDriverWait(driver, TimeSpan.FromSeconds(20)).Until(ExpectedConditions.ElementToBeClickable(By.CssSelector("div.summary-row > div#summary-back > a[href=/Health/Dependents]"))).Click();
XPath:
new WebDriverWait(driver, TimeSpan.FromSeconds(20)).Until(ExpectedConditions.ElementToBeClickable(By.XPath("//div[#class='summary-row']/div[#id='summary-back']/a[#href='/Health/Dependents']"))).Click();

I just changed attribute "aria-hidden" from "true" to "false" and after that I clicked.
Perhaps that code can help you.
public void ClickElementHidden()
{
((IJavaScriptExecutor)driver).ExecuteScript("document.getElementsByClassName('svg-inline--fa fa-chevron-left fa-w-8 font-32')[0].setAttribute('aria-hidden', 'false')");
driver.FindElement(By.CssSelector("#summary-back > a > svg")).Click();
}

Selenium: How to find the element from the HTML provided through CssSelector or XPath

Here is a button on the page:
<button data-purpose="add-section-btn" type="button"
class="ellipsis btn btn-default btn-block">
<span class="a3 udi udi-plus-square"></span>
<!-- react-text: 255 --> <!-- /react-text -->
<!-- react-text: 256 -->Add Section<!-- /react-text -->
</button>
When I try to find it using the following code:
var btns = _driver.FindElements(By.TagName("button"));
var sectionTitle = btns.Where(x => x.GetAttribute("data-purpose") == "add-section-btn");
It returns null.
If I try the following XPath:
var btn = _driver.FindElement(By.XPath("//button[data-purpose=\"add-section-btn\"]"));
then I get an exception.
How to find such a button?

Try with,
var btn = _driver.FindElement(By.XPath("//button[#data-purpose='add-section-btn']"));

As per the HTML you have shared to find the element with text as Add Section as the element is a React Element you have to induce WebDriverwait for the element to be visible and you can use either of the following Locator Strategies:
CssSelector:
var btn = new WebDriverWait(_driver, TimeSpan.FromSeconds(10)).Until(ExpectedConditions.ElementIsVisible(By.CssSelector("button.ellipsis.btn.btn-default.btn-block[data-purpose='add-section-btn']")));
XPath:
var btn = new WebDriverWait(_driver, TimeSpan.FromSeconds(10)).Until(ExpectedConditions.ElementIsVisible(By.XPath("//button[#class='ellipsis btn btn-default btn-block' and #data-purpose='add-section-btn'][normalize-space()='Add Section']")));

Selenium clicking button hidden by span

I am trying to automate an environment selection screen where there are multiple selectable buttons individually hidden by a span, these display as tiles.
I have managed to navigate to a given tile and pull up the button but I am unable to click it.
Here is the code I have
public static void NavigateToEnvironment(IWebDriver driver, string environment)
{
IWait<IWebDriver> wait = new WebDriverWait(driver, TimeSpan.FromSeconds(5.00));
wait.Until(ExpectedConditions.ElementIsVisible(By.XPath($"//span[text()='{environment}']")));
var tile = driver.FindElement(By.XPath($"//span[text()='{environment}']"));
Actions action = new Actions(driver);
action.MoveToElement(tile).Perform();
wait.Until(ExpectedConditions.ElementIsVisible(By.XPath($"//*[#span=(text()='{environment}')][#btn=(starts-with(text(), 'Start'))]")));
driver.FindElement(By.XPath($"//*[starts-with(text(), 'Start')]")).Click();
}
The first part successfully moves to the correct tile and opens the span so on screen the button is there.
The wait.until condition is fine too so Selenium can see the element so its the final click command I have an issue with.
It seems only to look for the button hidden within tile one but I am trying tile three. All the buttons have the same HTML tags.
In the current code state I get element not visible.
I have tried to use the xpath as in the wait condition but that returns that the parameters are not elements so again fails.
I am kind of at a loss. Any ideas?
UPDATE:
Some HTML of one of the buttons. This basically repeats with a different application name
<li class="trans tile">
<div class="tileWrap noselect" aria-haspopup="true">
<div class="divNavIcon">
<span class="spnNavIcon primarycolorfont enable" data-bind="css: Code"></span>
</div>
<div class="tilePopup primarycolor">
<span data-bind="text: ApplicationNameAlias ? ApplicationNameAlias : ApplicationName">Enable QA</span>
<span data-bind="text: Description" class="tileSubText">Enable CI Environment</span>
<div class="tilePopupToggle">
<button type="button" data-bind="click: $parent.startApp, css: { disabled: IsRevoked }" class="btn">Start <i class="fa fa-fw fa-desktop"></i></button>
<button type="button" style="display:none;" data-bind="click: $parent.startAppNew, css: { disabled: IsRevoked }" class="btn">Start New <i class="fa fa-fw fa-external-link"></i></button>
<button type="button" style="display:none;" data-bind="attr: { "data-target": "#appPreview_" + ApplicationID }" class="btn" data-toggle="modal" data-target="#appPreview_3043">Preview <i class="fa fa-fw fa-play"></i></button>
</div>
</div>
</div>
Screenshot to help understanding - Each tile acts in the same way with a hidden start button. My code works fine for this first tile but if I want the second or third tiles it cannot find the start button

As per the HTML you have shared to click on the button with text as Start you can use the following code block :
wait.Until(ExpectedConditions.ElementToBeClickable(By.XPath("//div[#class='tilePopup primarycolor']//div[#class='tilePopupToggle']/button[#class='btn' and normalize-space()='Start']/i[#class='fa fa-fw fa-desktop']"))).Click();
Update
Can you try removing the <button> tag as :
wait.Until(ExpectedConditions.ElementToBeClickable(By.XPath("//div[#class='tilePopup primarycolor']//div[#class='tilePopupToggle']//i[#class='fa fa-fw fa-desktop']"))).Click();
Note : As per aurelia/binding/issues/163 disable.bind disables button but inner content is still clickable and we are targeting i[#class='fa fa-fw fa-desktop']

I have managed a pretty elegant work around to this issue. The buttons are contained in li items so i'm just finding the relevant one of those.
public void NavigateToEnvironment(IWebDriver driver, string environment)
{
var tile = driver.FindElement(By.XPath($"//span[text()='{environment}']"),5);
Actions action = new Actions(driver);
action.MoveToElement(tile).Perform();
var tile2 = driver
.FindElement(By.XPath("//*[#id='content']/div/div/div/div/ul"))
.FindElements(By.TagName("li"))
.Where(x => !string.IsNullOrWhiteSpace(x.Text))
.ToList();
var singleTile = tile2.Single(x => x.Text.Contains(environment));
driver.FindElement(By.XPath($"//*[#id='content']/div/div/div/div/ul/li[{tile2.IndexOf(singleTile) + 1}]/div[1]/div[2]/div/button[1]")).Click();
}

How can i select the div id in Selenium 2 WebDriver?

I want to find a tag in selenium 2 with C#, but I can't get access to div tag with id or xpath or etc. This is my code:
driver.FindElement(By.Id("captcha"));
and the web source is:
<body id="mainBody">
<div class="top_bar" style="min-height:210px">
<div class="m_sidebar_view">
<div id="captcha" style="position: relative; float: right; margin: 6px 35px 0 0; overflow: auto;"><div/>
</div>
</div>
</body>

Captcha is often loaded within an iframe (see, for instance, the google recaptcha demo source code). Switch to it before searching for the captcha element:
driver.SwitchTo().Frame("frame_name_or_id");

Although it's unclear what your problem is, one of the most popular mistakes is not waiting for the element. So try to wait:
WebDriverWait wait = new WebDriverWait(driver, TimeSpan.FromSeconds(10));
IWebElement myDynamicElement = wait.Until<IWebElement>((d) =>
{
return d.FindElement(By.Id("captcha"));
});