Today I Learned

hashrocket A Hashrocket project

Modify JS code in the browser

Have you ever needed to debug a production JavaScript issue but couldn't modify the source code directly? Chrome's Overrides feature is here to save the day! This powerful tool allows you to persist JavaScript changes between page reloads, even when you don't have direct access to the original source files.

Here are the steps:

  1. Open DevTools > Sources panel
  2. Click "Overrides" tab (>> if hidden)
  3. Select a local folder (grant permission when prompted)
  4. Edit any JS file in Sources > Page
  5. Save (Cmd+S) - a purple dot indicates override active

You can reload the page and your change will be persisted locally and executed in the browser.

Remember to delete your overrides once you're done.

Happy debugging! 🛠️

image

See More #javascript TILs
Looking for help? At Hashrocket, our JavaScript experts launch scalable, performant apps on the Web, Android and iOS. Contact us and find out how we can help you.