Correct the initial error in the column by retroactively applying the source map

Whenever our Selenium tests run on our web application, we always have access to the console logs in case there is a javascript crash. The typical error message usually appears like this:

09:27:09.540 [main] ERROR gui.rule.ScreenshotRule - Chrome console: SEVERE https://localhost:56962/bundle.js 94:74996 TypeError: Cannot read property 'map' of undefined

However, just having the reference bundle.js 94:74996 isn't very informative by itself (though working with vim can still bring some success). We do generate source maps during the bundle build process, but unfortunately Chrome doesn't utilize them when the app crashes. Is it possible to convert these LINE:COLUMN pairs back to their original source using the source map after the fact?

javascriptseleniumselenium-webdriverselenium-chromedriversource-maps

Answer №1

I managed to create the perfect tool by putting together my own solution: stacktrace-cli.

With this tool, you can now easily execute the following command:

npx @fatso83/stacktrace-cli app-bundle.js app-bundle.js.map 129:600036

And receive the following informative output:

{
    "columnNumber": 56,
    "lineNumber": 78,
    "fileName": "webpack:///src/store/entity/entity-reducer.js",
    "functionName": "getEntitysById"
}
{
    "columnNumber": 56,
    "lineNumber": 78,
    "fileName": "webpack:///src/store/entity/entity-reducer.js",
    "functionName": "map"
}

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

JSNI is failing to execute external function calls properly

I need help converting this JavaScript code into JSNI code. Required Scripts <script src="jquery-1.11.2.min.js"></script> <script src="jquery.typeahead.min.js"></script> <script src="autocompletetest/autocompletetest.nocache.js ...

javascriptjavajquerygwtjsni

When using VueJS to load an SVG file based on a variable within a for loop and utilizing v-html, the result returned is "[

I'm faced with a challenge of loading SVGs saved in separate files based on the content within a loop. Upon page load, what I see is: https://i.sstatic.net/OiwyT.png Hey there, check out my code snippet below: <div v-for="(rec, index) in stats ...

javascripthtmlcssvue.jssvg

Typescript restricts dynamic property access within objects

I'm encountering some difficulties while attempting to access my object property in TypeScript: const sum = (type: string) => { return { status: 'Sum', value: data?[type].sum, }; }; sum('first') Here is a glimps ...

javascripttypescript

Strategies for Structuring Django and JavaScript Codebases

I'm grappling with the best way to structure my javascript and django code. Previously, I would include my page-specific javascript directly in the template file within a <script> tag. However, as my javascript code grew, this approach led to a ...

javascriptdjangovariablesembed

Warning: Chrome 58 Does Not Encrypt Data in URLs

Since the recent update to Chrome 58, there has been an issue arising. When Selenium initiates a new instance of Chrome, it fails to navigate to the initial URL as it did in Chrome 57. The browser just hangs without making any progress. Have others come ac ...

google-chromeseleniumselenium-chromedriver

Maintaining the selected option on page refresh with React Remix

I have a dropdown menu with 2 choices (en, no) for switching the language when onChange event occurs. To save the selected language, I am using localStorage. Due to the server-side rendering in Remix, direct access to localStorage is not possible. Therefo ...

javascriptreactjstypescriptremix.run

Vuelidate is unfalteringly honest and always holds true, even when all conditions are satisfied

After entering a name into the text field, I am unable to proceed to the next card because !this.$v.$invalid never changes to false. I'm not sure what I'm overlooking here. It's worth noting that errors do show up properly when clicking on ...

javascripthtmlformsvue.jsvuelidate

Troubleshooting: Bootstrap 5 Alert not Displaying on Website

I'm experiencing an issue trying to display a bootstrap alert in my HTML code. Here is the code I'm using: <div class="alert alert-success alert-dismissible fade show" role="alert"> text & ...

javascripthtmlcssbootstrap-5

Navigating windows pop-ups in Selenium 2.0 (WebDriver): Best practices

enter code hereBrief : My current project involves using selenium 2.0 for automating UI testing, and everything was going smoothly until I encountered pop-ups. Now, I am faced with the challenge of handling windows popups. The issue at hand is that when I ...

javaseleniumwebdriver

"Discover how to locate and retrieve the page title using Selenium with

Currently, I have a setup where the page is refreshed when a specific URL loads. if driver.current_url == URL: driver.refresh() I'm looking for an API method that will trigger a refresh if the page title contains a certain word. ...

pythonselenium

Reorganizing array elements to match the order of another array in ES6

I am attempting to organize one array based on the order of another array... For instance... (Utilizing ES6 React) const orderArr = ["Daniel","Lucas","Gwen","Henry","Jasper"]; const nameArr = ["Gwen","Jasper","Daniel"]; in order to output Daniel // fi ...

javascriptreactjs

What is the process for calculating and determining the exact area the div should be released?

I am currently developing a drag-and-drop application using only Javascript. I have successfully implemented the dragging functionality, allowing elements to be moved randomly within the page. However, I now face the challenge of creating a drop zone with ...

javascripthtmlcssdrag-and-drop

Modify the font style of the recommended actions buttons within the webchat interface

I am attempting to modify the font of the "suggested actions" button similar to how it is demonstrated in this reference for changing the font of the bubble text: https://github.com/Microsoft/BotFramework-WebChat/blob/master/SAMPLES.md In the provided exa ...

javascriptcssbotframeworkweb-chat

Choosing multiple images using JavaScript/jQuery

Gridster is being used for a webpage, with widgets containing images that can be added and deleted using the "+" and "X" buttons. Current Status Clicking the "+" button opens a modal where multiple images can be selected and added to the widgets by click ...

javascriptjquery

Spinner Vue Displays while Loading Image from a URL

I am trying to display a loader spinner while an image is loading, but I am having trouble implementing this. Even after debugging and getting true and false values in the console, the spinner is still not showing up. <template> <div class=&q ...

javascriptvue.js

The functionality to refresh an input field upon clicking a button is not functioning as expected

I am currently developing a small MVC.NET web application with user input functionality. The goal is to calculate and display the results in two input fields upon button click. However, I am facing an issue where the input fields remain empty after the but ...

javascriptc#jqueryasp.net-mvc

Automatically navigate to a different page using JavaScript after 5 seconds without interrupting the execution of other code

Is there a way to redirect to a specific URL after 5 seconds without halting the execution of other code on the page? I want all the other code to run first before triggering the redirection. Wrapping the entire page in a setTimeout block is not an option. ...

javascripthtmlasynchronoustimeoutsleep

Adjust the position if the height exceeds 100 pixels

Can someone help with this code issue? $(document).ready(function () { if ($('.pi-img').height() > 100) { $(this).css('top' , '30%'); console.log('yeah'); } }); I am encountering difficu ...

javascriptjquerycsshtml

Populate List Items until Maximum Capacity is Reached and Increase the

Is there a way to make a ListItem fill the list vertically while also being able to overflow it if needed? I'm looking for a solution that would allow me to access the height of the empty space in the list, which I believe would be the minHeight. Som ...

javascriptcssreactjstypescriptmaterial-ui

Using angular.js variables in the script tag: A step-by-step guide

Currently, I am working on a project that involves displaying elements on a view using Angular.js and attempting to connect these DOM elements using jQuery connections. While the elements are being displayed correctly, I am encountering an issue when tryin ...

javascriptjqueryangularjs