How to override or set console.log’s file reference in chrome

Im currently writing a wrapper upon chrome’s console object in order to provide equal functionality within web workers which, at least for now, do not support logging yet.

Once the worker notifies the main thread, i replicate the log call with something like:

Function.prototype.apply.call(console.log, console, [workerLogObject])

At this point though, chrome recognizes the call and references file, line and column within the console itself (on the right). The displayed information by definition of console.log uses whatever resource the method has been called in — in my case the wrapper.

Back to the question, is it possible to change the file reference when calling methods of the console object in order to display another file like the web worker in my case?

I struggled with this as well, and found an answer here:

https://anthonykuske.com/how-to-extend-console-log-and-keep-the-correct-filename-and-line-numbers-shown-in-the-console/

From code alone it appears not to work. But if, in Chrome's developer tools, you right-click on your wrapper JS file in Sources, and choose "Add script to ignore list", it stops printing your wrapper file, and displays the caller instead.

Worked great for me.

I haven't tried it, but JS in node_modules is added to ingore list by default, so if you've packaged up your wrapper in node_modules and the caller is not, it might work by default.