It was suggested that this had already been answered and then my question was closed.
I've looked at all of the links and I don't see an answer there. Please don't close my question unless you're absolutely sure it's been answered.
Why XPath does not highlighted the yellow mark in Chrome84? (2
answers)
Chrome 84 Inspect element, find results not highlighted in
yellow like before (6 answers) Chrome DevTools not find elements not
search)
I'm writing some Selenium code and need to get the CSS Selector for an item on a page. So I bring up the page and go into Tools mode. It doesn't matter which browser I use - Chrome, FireFox, Edge - when click on the "Pick an element from the page" button (to the left of the Inspector in FireFox) and then click on the item I need the CSS Selector for I see the element in the tools section, but as I'm right-clicking it and choosing Copy->CSS Selector, the table it's in collapses (in a second or two) and I no longer have access to the item I clicked on. I've tried manually expanding the TR in the tools view and drilling down to the TD I need, but the same thing happens.
Anyone know of a way to stop this from happening? I was quick enough to copy a few yesterday but for some reason it seems to be happening faster today and I'm not able to catch it.
Right-clicking the item and choosing Inspect Element was also suggested but that does the same thing. The item shows up in the tools section for about 2 seconds and then the table collapses.
When the element tree collapses, it is a sign that it got updated. This happens, for example, when an iframe's URL or document is changed or the child tree structure gets replaced via JavaScript.
In order to stop this from happening, you can stop the JavaScript execution on the next execution once you see the element you want to inspect. Then you are able to inspect the element using the inspect button.
Firefox
Switch to the Debugger panel.
Once you see the element you want to inspect, click the Pause button or press F8.
Cause the JavaScript execution to stop (e.g. by interacting with the page). You can see that the JavaScript execution is stopped when there is a white overlay on the page and a hint saying Paused at Execution.
Once the execution is stopped, click the Pick an element from the page button in the toolbar or press Ctrl+Shift+C.
Click the element you want to inspect.
Chrome/Edge
Switch to the Sources panel.
Once you see the element you want to inspect, click the Pause script execution button or press F8.
Cause the JavaScript execution to stop (e.g. by interacting with the page). You can see that the JavaScript execution is stopped when there is a hint on the page saying Paused in debugger.
Once the execution is stopped, click the Select an element in the page to inspect it button in the toolbar or press Ctrl+Shift+C.
Click the element you want to inspect.
I found a semi-workable solution. When the item appears in the tools window note it's name before it disappears. Then go to the Search HTML box and type it's name. It still appears and then disappears, but it seems to stay visible longer.
Related
I’m working on an application that allows you to enter an automatic date. To test this application, I must follow a scenario that allows to select a specific date (e.g: 15/12/2021) by clicking on it.
For this I use a datepicker from the bootstrap library.
datepicker
But it is impossible to inspect this element, because, once displayed, it disappears with the slightest mouse click in the window, so that when I right-click on the datepicker to inspect it I lose the focus on the element that disappears.
Here's the inspector (when I want to open the div, the datepicker disappears):
inspector HTML code
How could I inspect this datepicker to create selectors?
Best regards
Use Chrome:
1. Right click Inspect
2. Go to Elements tab
3. Click on datepicker element (and watch what element is highlighted in the Elements tab)
4.Right click on that element in Elements tab and select Brake on - one of the options should work
5. Click on that datepicke element and Debugger should start
6. Click on Play until Your element is loaded
7. Inspect
For example:
Go to google.com
To inspect google apps selection:
1. Inspect page and switch to Elements tab
2. After clicking App selection button you will see that class="fade-in" is highlighted
3. Right click on this element in Elements tab and select Brake on - > attribute modification
4. Click on App selection again and You will see debugger appear
https://ibb.co/D7V3P3C
5. Click on Resume script execution but in the Inspector (Red bounding box on the pic) not on Debugger in main screen, until App selection is not showed
6. Then You can inspect Apps as You wish
You could also use EventListeners to set break on them.
In the following ecommerce site "https://www.gittigidiyor.com/", I want to click on "giris yap" button using selenium java but the problem is whenever I hover the mouse to profile icon, this pop-up appears and i try to inspect the pop-up to see the element but nothing happened. Could you please help me how can i click the buttons of this pop-up. I tried by switching to alert/frame but it did not workopened login popup in the site
driver.get("https://www.gittigidiyor.com")
driver.findElement(By.cssSelector("[title=\"Giriş Yap\"]")).click()
WebDriverWait wait = new WebDriverWait(driver,30);
wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("[data-cy=\"header-login-button\"]"))).click();
To find the element use below technique:
To search xpath of such dynamic elements use DOM break points:
And select break on subtree modification. Now all changes will break and pause the webpage rendering
Click resume execution or press f8 till your span gets displayed
For our web application I wrote one selenium script, which is working very fine in my office workstation (which has big screen).
When I execute the same script for the same application in my laptop(which has small screen) it is not able to find the element.
Actually when I open the application in my laptop some elements are visible only when I scroll down the page but those element are visible in big screen without scrolling. Application view is automatically adjust as per the screen.
So, for these application how I can write the selenium script so that it will work any kind of screen ?
What do you mean by "it is not able to find the element"? Which error did it show?
In my own experience with automation, in some specific scenarios, the behavior of the app change when the scrollbar appears (for example, when I try to click on an element, it scrolls down to that element, but "jumps up" to the element above it - this I can reproduce manually.)
Some test scenarios are quite sensitive with scrollbar, for example drag&drop.
You should analyse each failed test separately and find a solution for each case.
Selenium cannot find element that is not visible, you must always check if element is visible and if not scroll to this element.
see this question Scroll Element into View with Selenium
Has anyone had trouble using the selenium click function? Sometimes it cannot click on an element even though its visible. Sometimes it can click on an element that is underneath another element (that the user cannot click on). What's a good alternative?
I have a hidden div element that when I click the link the visibility changes. In my Selenium IDE script I click the link and I see the div open but then it immediately closes. The rest of the scripts run, but in a demo I would like to keep that div open.
My steps are:
click [Link that shows hidden div]
-->It is here that it displays and then immediately hides it.
focus [element inside div]
assertValue [target element]
Is there a setting that I need or a step that needs to be added?
It's hard to suggest. But there are some things that you can try.
First of all maybe your div is going to hide when link is not under
the mouse. Than you can use mouseOver
Maybe if you need just to verify variable you do not need even see
the div. Selenium IDE can take the value from element that is not
visible. It is not a fare play but sometimes you can do it.
Another way is to use javascript to bring your div to the light:
getEval | window.document.getElementById('your_divs_id').set_attribute('style','');
The most brutal and not trustable way to try to do it to add command
getEval | window.stop()
right after the click.