Attempting to use Selenium in JavaScript to download a file with a new element called 'TransitionRejection'

I am looking to streamline the process of downloading multiple files from a website. To achieve this, I navigate through several pages to obtain the file IDs using selenium and a perl script.

Since selenium does not have a built-in download function and using curl is not an option due to needing the session information from selenium, I am attempting to implement a workaround that I have successfully used in other projects.

The workaround involves creating a JavaScript element and executing a script with the URL for each file, like so:

var a = document.createElement("a");
a.setAttribute("href", "https://myurl.com/id1/export?format=TCX");
a.setAttribute("download", "https://myurl.com/id1/export?format=TCX");
document.body.appendChild(a);
a.click();
document.body.removeChild(a);

However, when I attempt this, I encounter the following error in the script:

Error while executing command: stale element reference: The element reference of is stale; either the element is no longer attached to the DOM, it is not in the current frame context, or the document has been refreshed at /Library/Perl/5.18/Selenium/Remote/Driver.pm line 391. at /Library/Perl/5.18/Selenium/Remote/Driver.pm line 348.

Testing this directly in the Firefox console yields:

TransitionRejection(type: 2, message: The transition has been superseded by a different transition, detail: Transition#2( 'top.ids.info.byId'{"myId1":"XXXXX","myId2":"YYYYYY"} -> 'home'{"feedId":null,"tag":null} ))

When accessing the URL via a normal browser GET request, I receive the download prompt without any issues (provided I am logged in).

Using selenium to access the URL works for the first file, but then gets stuck and does not proceed to download the second file.

$driver->get($download_url1); # This one is downloaded
$driver->get($download_url2); # This line is not executed

Answer №1

After some troubleshooting, I managed to resolve the issue using JavaScript. Rather than dynamically creating the element, I modified certain attributes to mimic the website's standard functionality. Additionally, I adjusted the URL from:

https://myurl.com/id1/export?format=TCX

to

/id1/export?format=TCX

As a result, the updated code appears as follows:

my $script = 'var a = document.createElement("a");' .
    'a.setAttribute("ng-href", "' . $url_to_download .'");' .
    'a.setAttribute("target", "_self");' .
    'a.setAttribute("class", "button button-default button-block");' .
    'a.setAttribute("ng-click", "dismiss()");' .
    'a.setAttribute("href", "' . $url_to_download .'");' .
    'document.body.appendChild(a);' .
    'a.click();' .
    'document.body.removeChild(a);';

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

Issue with displaying props value at the beginning of a function in ReactJS render

But the this.props.NotesAll object retrieved from another component is displaying under the render() method. However, when I attempt to use this.props.NotesAll above the render in a function to manipulate the objects and check their values with console.log ...

How can a Chrome extension transfer an ArrayBuffer or Blob from a content script to the background script without compromising its data type?

In my current script, I am downloading binary data using XHR in the content script and sending it to the background script: let me = this; let xhr = new XMLHttpRequest(); xhr.open('GET', url); xhr.responseType = 'arraybuffer'; xhr.onlo ...

Exploring the capabilities of React testing-library for interacting with the DOM within a React application

I've been working on developing custom developer tools after finding inspiration from Kent C Dodds' insightful article here. One of the challenges I encountered was automatically populating values in a form that I created. My approach involved u ...

Should Angular libraries be developed using Typescript or transpiled into JavaScript?

Currently, I am in the process of developing a library that will be available as an Angular module through npm. The library itself has been written using typescript. Everything was functioning perfectly up until Angular version 5.0.0, but after this update ...

Utilize Multer to upload images stored within an array of objects

I've been having difficulty figuring out how to extract the images from an array of objects structured like this: import mongoose from "mongoose"; const prodcutSchema = new mongoose.Schema( { title: { type: String, require ...

Postpone reloading automatically if a division is in view

I endeavored to develop a small project aimed at monitoring flights passing over my vicinity. Utilizing the flight-radar24 API python package, I managed to extract the necessary data. Subsequently, I designed a systemd service to execute my python script ...

Message displayed on picture carousel

<div class="slider"> <div> <img src="http://kenwheeler.github.io/slick/img/fonz1.png" /> <p class="projectname">Project</p> <p class="clientname">Client Name</p> </div> &l ...

There was a dependency resolution error encountered when resolving the following: [email protected] 12:15:56 AM: npm ERR! Discovered: [email protected] . The Netlify deploy log is provided below for reference

5:27:42 PM: Installing npm packages using npm version 8.19.3 5:27:44 PM: npm ERR! code ERESOLVE 5:27:44 PM: npm ERR! ERESOLVE could not resolve 5:27:44 PM: npm ERR! 5:27:44 PM: npm ERR! While resolving: [email protected] 5:27:44 PM: npm ERR! Foun ...

Tips on storing the amount of time a user devotes to answering questions on my form into a database

I am facing an issue with storing the "duration" in my database. The "duration" I aim to store is the time spent by the user answering a question I created. When they click the submit button, I want to save the duration they spent in the database. Below i ...

guaranteed function to retrieve React elements

Is there a solution for the issue where if-else doesn't work in run build but works in run dev? The only way I've found to make it work is by using a react hook, but I'm unsure which one to use and where to implement it. import { useAdd ...

Django Ajax filter displaying issue on HTML page

I'm uncertain about the correctness of my Ajax implementation. When using Django's built-in tags, the objects I pass through Ajax are not appearing on my template HTML page. view_results.html <div> <input id="search" name="search" t ...

Unable to alter the protocol option of the request object in SailsJS

Currently, I am utilizing a library that relies on the req.secure option to proceed without any errors. However, my application is deployed on Heroku and I have implemented custom middleware to check the "x-forwarded-proto" header and set req.secure as tru ...

The Node/Express Rest API appears to keep directing requests to the same controller function, despite the mappings being correctly

Currently, I am in the process of developing a node/express REST API. When making requests to the following endpoints: http://localhost:5000/api/news and http://localhost:5000/api/news/?id=c5f69d56be40e3b56e55d80 I noticed that both URLs trigger the same ...

Tips for utilizing browser cache in AJAX requests to prevent loading the refreshed JSON file

It may seem like a strange question, but I'm experiencing an issue with an AJAX call to a JSON file. Both the request and response headers do not indicate to not use cache, and in the browser settings, the Disable cache option is not checked. What mor ...

Searching for a different method in JavaScript that can add items without duplication, as the prependTo function tends to insert multiple items

Every time my code runs successfully, a success message is generated and displayed using prependTo within the HTML. However, the issue arises when the user performs the successful action twice, resulting in two success messages being shown on the screen. ...

Creating a Rails application that dynamically fills a table with data from a

Encountering an issue with Ruby on Rails. I have a "Host Model" that contains a method which has a longer runtime. class Host < ActiveRecord::Base def take-a-while # implement logic here end Attempting to access a page where this method ru ...

Utilizing shared code amongst React components

There are several components with methods similar to the ones below: class Header extends Component { sidebarToggle(e) { e.preventDefault(); document.body.classList.toggle('sidebar-hidden'); } sidebarMinimize(e) { e.preventDe ...

Struggling with integrating HTML Canvas within Vue.js

Currently, I am attempting to upload an image by utilizing HTML canvas. My decision to use canvas stems from the fact that I will be superimposing additional images based on the data received from the API, and this process seems more straightforward when u ...

Retrieve all elements from an array using jQuery

How do I extract all the elements from the array outside of the function? $.each(Basepath.Templates, function(i){ templateArray = new Array({title: Basepath.Templates[i].Template.name, src: 'view/'+Basepath.Templates[i].Template.id, descri ...

How can you sort an array based on a shared object property using Angular.js?

I've been grappling with this issue for a while now. My app receives data about individuals in JSON format: "people": [ { "name": "Ivan", "city": "Moscow", "country": "Russia" }, { "name": "John", ...