Is it possible to verify with Selenium whether a text is completely visible? For example, if I have the text:
lorum ipsum dolor sit amet
and due to incorrect CSS styling, only part of it appears on the page:
lorem ips
while the rest is hidden under a misplaced div. Is there a way to confirm that the entire text is displayed?
Check out this example I put together using a jsFiddle with Java and Selenium.
The HTML snippet
<p id="1">lorum ipsum dolor sit amet</p>
<p id="2">lorum ipsum <div style="display:none">dolor sit amet</div></p>
The Java code
String expectedString = "lorum ipsum dolor sit amet";
WebDriver driver = new FirefoxDriver();
driver.get("https://jsfiddle.net/JeffC/t7scm8tg/1/");
driver.switchTo().frame("result");
String actual1 = driver.findElement(By.id("1")).getText().trim();
String actual2 = driver.findElement(By.id("2")).getText().trim();
System.out.println("actual1: " + actual1);
System.out.println("actual2: " + actual2);
System.out.println("PASS: " + expectedString.equals(actual1));
System.out.println("PASS: " + expectedString.equals(actual2));
The Result
actual1: lorum ipsum dolor sit amet
actual2: lorum ipsum
PASS: true
PASS: false
Selenium doesn't fetch hidden text, so make sure to compare the fetched text with your expected string to validate visibility.
Below is a snippet of JAVA code that can be used to determine if the text inside an element is visible:
public boolean checkForText() {
boolean isVisible = false;
try {
// Locate the element first using different methods like css, id, className etc.
WebElement element = webDriver.findElement(By.id("the elemnts' id"));
System.out.println("Element found");
// Check if the text inside the element matches the expected text.
if(element.getText().equals("lorum ipsum dolor sit amet")) {
System.out.println("Text inside element looks good");
isVisible = true;
// Additional actions can be performed on the element if needed
// e.g. element.click();
} else {
System.out.println("Text does not match");
}
} catch (NoSuchElementException e) {
System.out.println("Element not found");
}
return isVisible;
}
This method will only return true if the element is found and its inner text matches the specified criteria - "lorum ipsum dolor sit amet".
I hope this information proves useful for you!
If you are using Java, here is one approach to accomplish this task.
Start by identifying the element using the appropriate locator and retrieve the text using the getText() method. Then, compare this string with the expected full text.
String capturedText = driver.findElement(By.cssSelector("")).getText().trim();
assertEquals(capturedText, expectedText);
You can implement it in a similar manner as shown above.
I have been working on styling a React project where App.js mainly handles routing and navigation to its components: App.js import {useState, useEffect} from 'react'; import Models from './pages/Models'; import Loadingpage from ' ...
I am experiencing an issue where the video in the main div of my home page does not fully fill the div right away - I have to refresh the page for this to happen. As a result, there is black space on the left and right sides. Interestingly enough, this pr ...
Attempting to access a webpage with a basic Python/Selenium script # encoding=utf8 from selenium import webdriver from selenium.webdriver.common.keys import Keys import datetime as dt import codecs import os myDriver=webdriver.Chrome() myDriver.get("http ...
My dropdown menu is not appearing, can someone please help me? It should display under "Interno," but when I click on it, nothing shows up! I found this menu online and tried to implement it, but it seems like I am doing something wrong. For the full proje ...
I am a beginner when it comes to PHP and I'm trying to figure out how to style this table. I tried creating a class, but changing the styles in a separate CSS file didn't work for me. Should I use style tags? How should I go about styling this? ...
I have a main page called index.cshtml. This page displays a list of document files along with an iframe next to it. My goal is to load the selected document file into the iframe when I click on any item in the list. However, currently, when I click on a d ...
Is there a more efficient method of integrating somewhat intricate HTML into a webpage than what I'm currently employing? function display(friends) { $(".row").empty(); $.each(friends, function(index, friend) { var html = '<d ...
I am troubleshooting an issue on my webpage where a button opens a new window, I can enter text in a textbox, but clicking on a link does not trigger any action (no error is displayed either). <tr> <td>waitForElementPresent</td> ...
Hello everyone, I am relatively new to the world of Wordpress and have recently taken over a project from another developer. The previous developer left behind default placeholders and texts that need to be updated. One specific change I need to make is to ...
I am experimenting with a plugin that allows me to attach popups to images. My goal is to enable navigation between all popups using previous and next buttons upon clicking on a popup. Below is the element when it's displayed: <div class="imp-too ...
I am currently working on creating a Selenium 4.10 driver that can gather all performance logs. Below is my attempt which unfortunately does not seem to be functioning as expected. It appears that we now need to utilize the options class to set the loggin ...
My current tool for automating regression test cases is Selenium IDE version 2.9.1. Previously, when using Selenium IDE in Firefox, I was able to right-click on any browser element - such as text, buttons, or fields - and see a list of available commands. ...
I have a prop named transcript in one of my components. Whenever I speak a voice intent, it gets updated. I want to execute a function every time the transcript changes and pass the transcript as an argument. In this code snippet, I attempted to use an On ...
My website currently incorporates HTML5, CSS3, JQUERY, and static images. Additionally, I have a Blog created in Django that I would like to seamlessly integrate into the existing website. As a newcomer to Django, I am unsure of the best approach to take ...
Trying to add horizontal scrolling to a div that contains two separate divs, each with a width of approximately 4080px. One of the divs holds a table with headers, while the other div has <td> elements in <tr>. I need to enable vertical scrolli ...
Currently, I am utilizing selenium-standalone-server-2.39 as RemoteWebDriver (server running on a different machine) with Firefox 26 on Windows 7. The test execution is functioning correctly, but when the code attempts to close or quit the driver/browser d ...
I am seeking assistance in creating a table with a custom number of rows and columns. The table should have two input fields for specifying the number of rows and columns, and upon submission, the table should dynamically adjust to display the specified nu ...
In my design, I have a parent container with three inner divs that are floated. The left and right divs have fixed sizes, however, I need the center div to expand and fill the space available within the parent container. <div class="parent-container"&g ...
Struggling to create a horizontally scrollable navigation with buttons for media queries in Bootstrap 5.2, using SCSS for styling. This project is starting to feel overwhelming as we try to replicate the EA site. We're aiming to mimic the behavior of ...
Exploring an IDE on this website through recording and playback. 1. Type any text in the search box, 2. Click on All Products, then select Books. When recording, the xpath is: /html/body[@id='CDS']/div[@id='navContainer']/div[@id=&a ...