Is there a way to check for broken images in Selenium IDE?

While browsing through a website, I came across an interesting example on how to test for broken images using javascript. The only catch was that the example provided was in Ruby language. However, it got me thinking - could I potentially use the runScript command in Selenium IDE to create a javascript code that can detect broken images? Unfortunately, I'm not sure where to start or how to go about this.

If anyone has a piece of code or any guidance on how to achieve this, I would greatly appreciate it. Any form of help will be welcomed with open arms!

Answer №1

It may not be common, but it is definitely achievable.

Take a look at this:

You have the option to utilize the verifyEval command for confirming the outcome of a javascript code. Additionally, you can leverage storeEval to execute some javascript, fetch the result, and use it later on. If your goal is solely to perform javascript, you can also employ getEval.

If you want to ensure that there are no broken images on the page, you can do the following:

Command

verifyEval

Target

var allImg=window.document.getElementsByTagName("img"), i=0, img, result=true;  
while (img = allImg[i++]) 
  {if (img.complete &&  typeof img.naturalWidth != "undefined" && img.naturalWidth > 0) 
    {} 
  else 
    {result=false;}}; 
result;

Value

true

Alternatively, you could mark any broken\missing images to keep track of them. Below is an example that will trigger a failure if more than 5% of images on the page are broken:

Command

getEval

Target

var allImg=window.document.getElementsByTagName("img"), i=0, img;  
while (img = allImg[i++]) 
  {if (img.complete &&  typeof img.naturalWidth != "undefined" && img.naturalWidth > 0) 
    {img.setAttribute('tag','passed');} 
  else 
    {img.setAttribute('tag','broken');}}; 

Then:

storeXpathCount | //img                                        | all
storeXpathCount | //img[@tag='broken']                         | broken
verifyEval      | storedVars['broken']*100/storedVars['all']>5 | true

Best of luck!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring the world of React.js through the exchange and manipulation of data

Essentially, I am utilizing refs to obtain component dimensions in the componentDidMount() lifecycle method. When I log this information, I can see the width that I desire (refer to code). However, when I attempt to access and log this data in the render() ...

Refreshing the Angular directive following a change in the scope variable

Just getting started with Angular and I've encountered a small issue. Within my template for SirroccoListing, I have the following code. Sirrocco is a directive: <h3>All Sirroccos</h3> <div sirrocco ng-repeat="sirrocco in sirroccos" ...

Javascript's simplistic addition function is not functioning properly

Learning JavaScript has been a bit challenging for me, especially when it comes to simple concepts. I'm trying to write code that sums two numbers together, but for some reason, it's not working. function sum() { var number1 = documen ...

Issues with Angular service functionality

I've been working on an application using Angular for the client side and Node for the server side. I've incorporated some API's into my Angular code, but I'm encountering difficulties with retrieving data from a specific API. Can someo ...

Verify whether the element is currently visible within an iframe on the same domain

My goal with jQuery is to determine element visibility on a webpage. In my website, there is an iframe within one of the pages. Typically, I check for element visibility using the following code: if($('.tabContentContainer').is(':visible& ...

Appium encountered an error on iOS with the message: "NSCocoaErrorDomain Error Code 260: The file named 'WebDriverAgentRunner-Runner.app' cannot be opened as it does not exist"

While running appium on a real iPhone, I encountered the following error message. Despite searching for a solution, I have not been able to resolve it yet. [XCUITest] Using WDA path: '/Applications/Appium.app/Contents/Resources/app/node_modules/appiu ...

Python Selenium webdriver fails to open new tab

When running the code below, I encounter an issue where it only opens the first website and does not open a new tab as intended. Even when attempting to go to a new URL after utilizing new_tab, it simply redirects me to a different URL within the same ta ...

I am experiencing issues with my AJAX file and it seems to be

After creating a basic AJAX application to retrieve data from a PHP file using an ajax.js file, everything was uploaded to the server. However, upon accessing localhost/mypage, the expected results did not occur due to unforeseen issues. Below is the HTML ...

What is the reasoning behind the decision for the javascript void statement to assess an expression?

When it comes to the javascript void statement, it is designed to evaluate an expression and yield the value of undefined. The concept behind this functionality stems from the fact that the global variable undefined can be altered. However, one might wonde ...

Implement a validation function in JavaScript that compares two dates to ensure they are valid

In my search for the distinction between two dates, I have encountered a scenario where, upon a user's request to modify the arrival date, the system must retain the number of days between the arrival and departure dates before the alteration. Subsequ ...

Angular feature for adding a "new row"

I am in the process of creating a tool for a website that serves as a "deal builder". Within this builder tool, there is a button labeled "add new item" which will insert a new device item into the <li> list. <ul class="deal-builder-devices enti ...

Unable to locate module in Node.js - module.js

I encountered an error while running the node server which states: $ node server.js module.js:339 throw err; ^ Error: Cannot find module './server/routes' at Function.Module._resolveFilename (module.js:337:15) at Function.Module ...

Update the CSS styling for elements that are dynamically added to the page using the

Just started using jQuery for the first time and I'm encountering an issue. I'm trying to load content from an external element onto my page, and while it loads correctly, I'm having trouble using normal traversal methods on the loaded eleme ...

Top tips for seamless image transitions

Currently working on a slideshow project and aiming to incorporate smooth subpixel image transitions that involve sliding and resizing, similar to the Ken Burns effect. After researching various techniques used by others, I am curious to learn which ones ...

Nothing remains after the fall: coding void

I am facing an issue where my item becomes null after being dragged 2-3 times and dropped in a different place. I have included my code below and I can't seem to figure out where the mistake lies. Can you please review it and let me know what needs to ...

How can the input validation be displayed in Ajax when the user interacts with it?

When utilizing Ajax, I only want to display validation for the input field that the user is interacting with, not all validations at once. Currently, my script shows all validations simultaneously when any input is filled out. How can I modify my code so t ...

Executing javascript whenever a page is updated

Looking for a solution to ensure that my userscript runs every time an AJAX call modifies any page it is attached to. Is there a way to listen for XMLHttpRequests and trigger the script accordingly? ...

How do I retrieve the overall count of files from the 'Drag & Drop' feature in the Krajee-bootstrap file input plugin?

I'm currently utilizing the krajee file input plugin within my bootstrap project. Specifically, I am interested in retrieving the total number of files that have been uploaded from the drag and drop field. The plugin has been integrated into a form, s ...

Use JQuery to load a particular page by specifying its ID with the hashtag symbol

I am facing an issue where I need to create multiple private chatrooms per user. Although I have managed to make it work, I encountered a problem where if there are more than one private chats happening simultaneously, the content of these chats gets broad ...

Navigating through error messages in NextJs 14 can be tricky, especially when faced with the dreaded "ReferenceError: document not defined" or "prerendering error". It's vital to pinpoint exactly which page

When attempting to run the build on my Next.js application, I encountered an error message that is not very informative given the number of files/pages in my project. How can I pinpoint the exact location of this error and determine the root cause? The pro ...