Any time you console.log something, on the right side of the console it'll have the origin and line number, like so:
(see index.ts:5).
My app logs things in multiple places, and it would be useful to be able to change what the stack hint is on the right hand side. Right now, for development, they all say DeveloperLoggingUtils.js:55, because that's the file that logs the strings to the console instead of sending them to the server. Is there a way to change it so that it's location is known? For instance, if I'm using my dev logging class in TestButton.js, and calling it in componentDidMount, is there a way to show TestButton.js on the right side?
Related
I use several JS files that I don't have access to and write all over my console.
But I only want to display my own message with console.log("Own message.") and errors (e.g. 404 error).
If I use console.clear before the log function, directly but also all error messages are cleared.
Is there a way to filter console messages to show only errors or the own message and errors?
I have already heard that there are certain libraries for this.
Is it also possible without?
In Chrome, you can just type in the name of your JavaScript file to filter for messages that only come from that file. For example, I had some console messages, and then I typed in userscript to only display logs that came from userscript.html:
Firefox has the same sort of filtering box too.
No need for any libraries.
To display messages from multiple multiple possible sources but no others (for example, to show only messages from foo and bar), use a regular expression, eg:
/foo|bar/
in the same filter box.
The Firefox web console (showing Javascript console.log messages) has a search box allowing to 'filter' messages. This is useful to find if a certain message 'foo' has been shown on console, but filtering hides all the other messages on console, so it is not possible to see exactly when 'foo' has been logged.
I would want to 'search' among console messages in order to debug js scripts, to see when a message has been logged and check previous and following messages.
I've searched a lot, but it seems like this feature is not there. There is a way to achieve this result with the native console or some plugin console having this feature?
As you requested, I'll convert my comment to an answer, but leave the comment as is (so people will not be confused).
There is no feature available that allows you to filter for a message and show the last x messages not fitting the criteria. You could, however, enable the timestamp for log messages (top right corner, the settings icon, enable timestamp). Filter your messages, look up the timestamp and remove the filter. I'd suggest using the debugger though.
I have been introduced to a web application that I need to make some modifications to.
The app is huge, and there are perhaps 100 Javascript files. These files send requests to a third party API all the time.
Now, in the console, I can see all these requests. Let's say that one looks like:
GET http://123.456.789.10:8000/v1/accounts/accountnum/children?_=1422026843600
Then of course I can see the parameters sent, headers and response. My problem is that I need to locate the JS file which is sending one particular request. Searching all the files for the API target URL reveals that 40 or 50 files send requests to this same URL, with similar parameters.
Is there a way I can find out the source file of one specific request? Something like sent from filename.js on line 123 would be ideal, but just the file name would be of great help too.
I could go through all the files and try each one individually, but that seems like a huge waste of time. There would be A LOT of code to go through.
If you know what to do in the application to make the request occur, in Chrome you can use an XHR breakpoint to catch it:
Navigate to the point where you're about to do the thing that causes the request
Open Dev Tools
Switch to the Sources tab
On the right, scroll down to "XHR Breakpoints"
Click the + button, fill in some appropriate subset of the URL (or leave it blank to break on all XHR)
Add it
Do the thing that does the request
Chrome will break and take you to the line of code that was triggering the XHR.
Using GWT I am loading images from a server I do not control. Currently, I use GWT new Image( url) and then use ImageHandlers and ErrorHandlers to catch what happened and put the images in my buffer and the DOM. Then I make the images visible sequently to animate the process. But now I need a bit more, I need to know the error code, e.g.304 that the server returned for the image and also I need to get at the header response attribute, 'Last-modified'. For 304, I know I need to resubmit the request later when the server will have created a new version ( with exactly the same url ) which I think I can manage, but it will then have a new 'Last-modified' and I need to know that DateTime.
By using new Image(url), I am letting the browser do the loading, but I don't know how to get at the details of the load.
Q1:Is there a way to pull more info from an image?
GWT Image just seeems to wrap a JS object. I look in Firefox Console-Network, but don't see much detail there either. Is Last-modified and error code forgotten by the time it gets (or doesn't) in the DOM tree.
If the answer to Q1 is no the information is gone or inaccessible, ..
Q2: Do I need to stop using the browser to fetch images and do it with an XmlHttpRequest and then presumably I have access to the response codes and the header attributes. SOP is not an issue. But how then do I get from say the Response OutputStream to an Image? Do I have to Base64 encode it or is there a better way? Will one of the other non-url constructors for image help, say Image(Element) or Image(ImageResource). Then the issue becomes how to make a response stream into a Element or ImageResource?
Note: This other question 'How to print error message of why image failed to load?' is related, but doesn't get to an answer.
Getting Error codes, and getting the response as a stream must be done with an HTTP client (GWT has the built in RequestBuilder). You can also try to get the error code with native JS, using the method described here.
I have a program in Bash which runs a console feed. The feed is text, and is appended to each time an event happens and is timestamped.
How would I load the contents of the console feed onto a page (perhaps last 200 lines or so of the console), and send additional data each time the file was appended to (the new lines)?
I am completely new to WebSockets and the moving of dynamic data, so please explain anything thoroughly.
Note: I also have node.js installed.
Since you already have node.js, you should definitely check out socket.io; it'll take care of all the WebSocket stuff for you. Check out the site to learn how to use it.
Also, since you're interested in watching a file for changes, check out the fs.watchFile() function of the FileSystem module of node.js. It'll fire a callback every time a file is changed. You can use this to get the new data and pipe it to the browser using socket.emit().