Chrome debugging tool does not refresh page source

This issue has been lingering for quite some time and despite similar questions, I have not come across a satisfactory solution. The problem lies in the fact that the SOURCE used to step through the code does not refresh with every page load. Disabling the cache hasn't helped as it's not the browser cache but the DEBUGGER SOURCE cache causing problems.

In my web application (Struts2 and Tomcat), the main page features a title bar and left menu, with an iframe loading various JSPs in the center content. While most navigation is handled by one 'action' with different results displaying different pages, the challenge arises when the NAME in the chrome debugger SOURCES pane fails to change upon navigation. Although the actual page changes, Chrome fails to update the source in the debugger window. This means that if there is a 'debugger;' line on 200 in the loaded page, it stops at the old source at line 200 rather than the current source being executed. Despite revealing the real source in the Network panel, the debug source remains unchanged.

Question: How can I work around this Chrome bug and compel the source to reload in the debugger display?

UPDATE: Contrary to some assumptions, this issue differs from others. David Fahlander's answer appears to resonate with my concerns. The javascript source successfully refreshes and displays correctly in the RESOURCES and NETWORK panes. However, the new source fails to refresh in the SOURCE pane where debugging takes place, creating obstacles in troubleshooting code invisibly.

Answer №1

Consider utilizing a traditional approach by incorporating a URL query parameter containing the current time in milliseconds. This can be something that your application disregards, but Chrome interprets it as a novel page. For instance, you could try visiting https://example.com?time=1594125425508

Answer №2

This method is commonly used in Chrome extensions to add JavaScript code after the loading process has finished, making it easy to debug.

let newScript = document.createElement('script');
newScript.innerHTML = 'your javascript code ';

document.head.appendChild(newScript);

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

Activate the next tab by clicking a button in ReactJS

I currently have a web page with 4 tabs, each containing different sets of data. Within the first tab, I have a button that should activate the next tab's content when clicked by the user. render(){ return ( <MuiThemeProvider> ...

Breaking down the initial state within a redux reducer

Can you explain the distinction between returning state in the default case of a Redux reducer using return state and return { ...state } ? ...

Having trouble showing the success message following row edits in jqgrid

I'm currently developing a web-based application with Bootstrap and I'm facing a challenge with implementing inline editing in my grid upon page load. The issue arises when displaying the success or failure message after performing an edit functi ...

The web page's content remains hidden until it is scrolled into view, despite the fact that the page has finished loading

I'm a beginner with Angular and currently working on creating a website. On the following page , when viewed on mobile, I am experiencing an issue where the content doesn't load until it's brought into view by scrolling down the page. I am u ...

Determining outcomes of forms added in real-time

Need assistance with dynamically creating tickets, calculating prices, and displaying results when additional tickets are added. Currently facing an issue where price data is not being calculated when a new ticket is added. Any help would be greatly apprec ...

Organize data in a Vue.js table

Currently facing an issue with sorting my table in vue.js. Looking to organize the table so that campaigns with the highest spend are displayed at the top in descending order. Here is the code I'm working with: <template> <div class=" ...

Phonegap and the Importance of HTTP Requests

Having an unusual issue with Phonegap where my XMLHttpRequests are firing twice. Currently, I am working on an app that involves using XMLHttpRequests to generate a dynamic list of events for users to choose from. In addition to this, I am utilizing jQuery ...

Arrange a div element within another div by utilizing the fixed positioning property, while also accounting for any potential "white space

Can someone help me figure this out: I currently have this much progress: http://jsbin.com/apikiw/3/edit#preview The issue I'm facing is that I am unable to insert it between the <p /> tags due to its dynamic nature... any solutions or suggest ...

Assign the ng-repeat item to a variable in the controller's scope

Can anyone help me figure out how to pass a particular item from my view to a function in my controller? Here is the code: The view where I want to pass p.id <tr ng-repeat=" p in projetsListe"> <td>{{p.NomProjet}}</td> <td>{{c ...

Encountering issues while attempting to transmit several files to backend in React/NestJS resulting in a BAD REQUEST error

My goal is to allow users to upload both their CV and image at the same time as a feature. However, every time I attempt to send both files simultaneously to the backend, I encounter a Bad Request error 400. I have made various attempts to troubleshoot th ...

After refreshing the page in Next JS, there is a delay in loading the Swiper Js styles. The Swiper slides appear stretched while waiting for Next JS to load the styles. Any suggestions

Having an issue with my Next 14.0.3 app and tailwind CSS. I recently installed swiper JS version 11.0.5 using npm. The problem arises when I reload the page, it takes about 1 or 2 seconds for the swiper styles to load. During this time, the swiper slides s ...

What is the process for implementing Sequelize to manage and modify multiple tables simultaneously?

I am currently working on developing the back-end with DB using Sequelize ORM. My main challenge is creating or updating data in multiple tables simultaneously. Below are some examples of what I am trying to achieve: //Tables const main = sequelize.define ...

Setting up React Router in a nested directory with a flexible route structure

As a newcomer to react router, I am seeking guidance on setting it up in a specific scenario. Imagine we have a PHP application running on 'http://www.example.com'. Within this setup, there is a react application located at 'http://www.examp ...

Creating a dropdown navigation menu using jQuery

I have been experimenting with creating a customized Drop Down menu using ul li and Jquery, following this helpful Tutorial. Here is the sample HTML Code for testing: <div id="dd" class="wrapper-dropdown-3" tabindex="1"> <span>OS</span> ...

Use Django, Ajax, and Jquery to incrementally add items to a "cart" by selecting checkboxes one by one

Despite adding new code, it's still not working as expected... I've been attempting to implement a feature where users can select items using checkboxes and add them to the "cart" displayed at the top of the page. Each item on the page has a che ...

Transferring JavaScript to PHP

I have a challenge where I need to pass a string stored in a variable to a MySQL table using PHP. Currently, my workaround involves using a hidden <input>. I assign the variable value to it and submit it through a form. It works, but it's not e ...

How can I modify the ngx-datatable pager component to display text instead of icons and include a totalVisible property?

I am currently customizing the datatable-pager in ngx-dataTable and have been successful in adding footers and pagers. However, I am facing two issues that need resolution: How can I display text instead of icons for the prev/Next/First and Last buttons? ...

Learn the steps to Toggle Javascript on window resize

Is there a way to toggle Javascript on and off when the window is resized? Currently, resizing the window causes the navigation bar to stick and remain visible above the content. <script> if ( $(window).width() <= 1200 ) { }else{ $('nav& ...

Is there a way to access the content of a drop-down menu in JavaScript besides using ".value"?

Trying to create a table with rows that change dynamically but columns that are fixed. There's a drop-down menu whose content is based on an xml file. When I use .value to access the current content of my drop-down menu, it works fine in Firefox but n ...

Tips for invoking C language code from JavaScript by using the js-ctypes extension in Firefox

I need assistance with developing a Firefox extension that requires calling native C code. Here is my C program code: #include<windows.h> int add(int a, int b) { return(a + b); } And here is my JavaScript code: var {Cu} = require('chrome ...