Update the label on a webpage using Selenium's JavaScriptExecutor

We are currently working on a Japanese web application and are experimenting with a unique method to convert Japanese labels into English. Here is the approach we are using (though unsure if it's correct):

Approach (using Selenium):

  • Open the webpage.
  • Retrieve labels as we navigate through the webpage.

  • Send each label to an API (Japanese dictionary) for translation to English.

  • Set back the translated English word to the label using JavaScript executor.

I have successfully obtained the translated English words for the Japanese labels, but I am facing issues in setting them back on the webpage. Below is the piece of Selenium code attempting to achieve this:

JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("window.onload=function(){document.getElementById('expiry').textContent='Expiration Date';}");

Although there are no error messages in the Eclipse console, I cannot observe the English text on the page.

HTML

<html>
<body>
<table class="imui-form" style="width:1050px;">
<div class="imui-chapter-title" style="width:1050px;">
<h2>取引先情報</h2>
</div>
<tr>
<th style="width:80px;" >
<label id="expiry">有効期限</label>
</th>
<td style="width:220px;">
<input type="text" placeholder="" value="2016/08/09"  name="fromdate" id="fromdate" maxlength="" style="width:100px; height:15px;">
<img src="./imart/images/calendar_btn.png" />

&nbsp;~&nbsp;
<input type="text" placeholder="" value=""  name="todate" id="todate" maxlength="" style="width:100px; height:15px;">
<img src="./imart/images/calendar_btn.png" />
</td>
</table>
</body>
</html>

In light of this, I have two questions:

  1. Can someone advise me on whether my current approach is viable or suggest a better alternative?
  2. How can I ensure that the above JavaScript works correctly using Selenium?

Answer №1

For better results, consider implementing the following code snippet:

   WebElement expirationElement = driver.findElement(By.cssSelector("table.data-form tr:first-child th label#expiry"));
   
   JavascriptExecutor jsExecutor = ((JavascriptExecutor) driver);
   jsExecutor.executeScript("arguments[0].innerText='Expiration Date'", expirationElement);

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

What is the optimal method for organizing MongoClient and express: Should the Client be within the routes or should the routes be within the client?

Which is the optimal way to utilize MongoClient in Express: placing the client inside routes or embedding routes within the client? There are tutorials showcasing both methods, leaving me uncertain about which one to adopt. app.get('/',(req,res) ...

Accept a JSON-sending POST request in a JSP file via JavaScript

I have developed an HTML page with an input field. Using javascript, I extract the input value, convert it into JSON format, and attempt to send it through ajax. Additionally, I have a JSP application where a Java method processes this JSON data to store i ...

The resource being requested is missing the 'Access-Control-Allow-Origin' header - Issue with Pinterest OAuth implementation

While working on implementing OAuth for Pinterest, I successfully retrieved the access code. However, when attempting to perform a GET /v1/me/ request, I encountered an error in the Chrome console: XMLHttpRequest cannot load . No 'Access-Contro ...

Combine two elements in an array

I am faced with a challenge in binding values from an Array. My goal is to display two values in a row, then the next two values in the following row, and so on. Unfortunately, I have been unable to achieve this using *ngFor. Any assistance would be greatl ...

What could be causing the TypeError I encounter when trying to import @wordpress/element?

Encountering a similar issue as discussed in this related question. This time, I've switched to using '@wordpress/element' instead of 'react-dom/client' based on the recommendation that it also leverages React functionalities. Ho ...

Top method for utilizing overlays

Is there a method to randomly select hex codes for specific colors? I want to replicate the design in this image through coding. Image Here is the code I have so far: HTML <div id="group"> <div class="sub red panel"> </div><!--su ...

Invalid function call detected, transitioning from Reactjs to Nextjs

After spending some time away from the ReactJS world, I decided to make a comeback and try my hand at NextJS. Unfortunately, I ran into an issue with an Invalid Hook Call. I'm in the process of transitioning my ReactJS project to NextJS. To illustrat ...

What steps should I follow to set JSONP as the dataType for a request in an Angular $http service?

I have a good understanding of how to use jQuery's $.ajax: $.ajax({ url: //twitter endpoint, method:"GET", dataType:"jsonp", success:function() { //stuff } }); Is there a way to set the JSONP datatype for an angular $http service reque ...

A method for retrieving the value of a dropdown option using Selenium WebDriver

Currently, I am working on developing a Selenium automation framework and have encountered an issue with retrieving the value of a dropdown option. Although I am able to access the dropdown options, I now need to obtain the actual value of the selected opt ...

Open the overflow div within a table data cell

My goal is to create a drag-and-drop schedule tool similar to Fullcalendar. I have decided to use a table layout with a rectangular div inside each TD cell to represent tasks. <table onDragEnd={dragend}> <tr> <th>0</th> ...

The Material-ui Drawer does not function properly when used with an external CSS file

For my project, I'm working on a Sidebar design that is inspired by the Mini Variant drawer demo available at this link. However, the project requirements mandate that all CSS styling should be done in a separate CSS file rather than directly within t ...

Creating a versatile function to verify the presence of empty values

Looking to validate fields for emptiness in a router, with potential use in other routers as well. How can I create a single function to handle this task? To see how it operates: , Desiring something similar to: , ...

Partial data sent through Ajax to PHP file

Encountering a peculiar issue with Ajax where the entire string data is not being sent to the php script. Here is the string: "<p class="MsoNormal" style="text-align:justify"><b><u><span lang="DE" style="font-size:10.0pt;mso-bidi-fon ...

Enhancing React components with dynamic background colors for unique elements

I am encountering an issue while using a map in my code. Specifically, I want to set the background of a particular element within the map. The element I am referring to is "item .title". I aim for this element to have a background color like this: https:/ ...

Getting up and running with the NICE DCV SDK: A beginner's guide

Exploring the NICE DCV SDK provided by AWS has been my latest project. You can find the documentation here. However, I've hit a roadblock while trying to run the example code mentioned in the docs. My attempt to execute it on a node server resulted in ...

What is the best way to convert a deeply nested PHP array/object into JSON format?

For those who want a shorter explanation, here it is: I have a JavaScript array filled with objects. Some properties of these objects contain arrays of objects, which in turn may have more arrays or objects nested within them. This results in 5 levels of n ...

Storing a collection of strings in a MongoDB database: A step-by-step guide

I have come across a few similar questions on stack overflow like this one: How to store an array of Strings in Node MongoDB Mongoose - Save array of strings However, I am unable to understand why my method is not working. I am attempting to save the str ...

The setLanguage function in jsPDF does not support rendering different language characters

I'm currently working with jsPDF in Angular 2 and I'm experiencing an issue where my HTML content is not converting successfully into a PDF when it's written in Hebrew. Other languages seem to work fine, but Hebrew is causing a problem. How ...

Is the Vue-portal enabled conditionally?

I am looking to include some additional information in the navbar (parent component) using Vue Portal. So, within a component, I can use the following code: <portal to="navbar"> <b-button>Some option</b-button> </portal&g ...

What is the best MySQL data type for storing JavaScript code with PHP?

I am creating a platform that resembles jsfiddle, allowing users to store their JavaScript codes and retrieve them in an organized manner. I am unsure about which data type would be most suitable for saving the codes, or if storing them in text files wou ...