Launch Chrome with JS scripts suspended at startup - google-chrome

In NodeJS, you can run a script with the --debug-brk option, which pauses your script at the first line. You can then attach with a debugger and resume, ensuring you can hit any breakpoint no matter how early it is in your script.
Is there something similar in Chrome / Chrome Debugging Protocol?
I use an external debugger to debug JS in Chrome. Chrome is launched via command-line, with remote debugging enabled, pointing to a local server with my website / app. Once Chrome is launched, the debugger attaches to the page, but that takes time - by the time the debugger is attached, the scripts have pretty much already executed, meaning I cannot hit breakpoints that are early in the website / app's life cycle.
I thought of adding debugger; statements at the beginning of every script, but that would be annoying over time. I also think that the Chrome dev tools need to be open for debugger; statements to actually pause, so that might not even work.

In Chrome DevTools, you can use 'Event Listener Breakpoints' to force the execution to pause on 'Script First Statement'. There are others, such as load, which happens a little later on. You can then resume execution until the relevant breakpoints should be hit.

Related

Google App Script debugger doesn't stop reliably at breakpoint

I have a problem with the Google App Script debugger.
When I run my script in debug mode, it is correctly stopped at breakpoint on the first loop of my 'for loop'. But when I click the Play button (of the debugger) to continue to the next loop, the variables are not changed in the debugger window (the window that shows the variables values), as if the debugger remained blocked on the breakpoint. But actually, as the work done by my script on the next loops is done, I can see that the script actually didn't remain blocked on the breakpoint.
So, the debugger gives the feeling to be blocked on breakpoint (without possibility to continue the script on the next loops) even if it is not the case.
Anybody had this issue ? How to solve it ?
This appears to be a bug!
There are a couple of reports on Google's Issue Tracker which detail the same kind of behaviour:
Problem during Debug: Variable doesn't grow linearly but skip some values
Array Error
Google does seem to know about this issue but if it's causing problems you can file your own bug about it here.
You can also hit the ☆ next to the issue number in the top left on the aforementioned pages which lets Google know more people are encountering this and so it is more likely to be seen to faster.

CardService.OnClose.RELOAD_ADD_ON works intermittently

I have CardService.newOpenLink() in my add-on that does authentication from our web site. Upon return I am using HtmlService.createHtmlOutputFromFile() to pass self-closing file that is closing pop-up with authentication code. Everything works.
The issue I an having - I am using setOnClose(CardService.OnClose.RELOAD_ADD_ON) with my open link, so I can reload add-on and re-read cached credentials. This works intermittently - sometimes add-on is reloaded and sometimes it stays on a current card. I cannot catch the pattern... Any suggestions on what could be the issue?
Thanks,
Sam
It appears that this is some kind of timing issue. The way my flow works - I open external HTML window, which is reloading itself with URL pointing back to my script. Script is using HtmlService to pass back simple page that will close itself. If I put window.close() inside setTimeout() - then Add-On will reload reliably if timeout is 5 sec. or more. Anything less than 2 sec will not reload at all. 2 to 5 sec will work intermittently. Not sure what Google is doing there, but apparently they are loosing handle to a window...

what's the principle of debugging react-native remotely in chrome?

I know that chrome devtool could be used as an open debugger frontend, with receiving debug info by a websocket from debugger host and displaying them such as source file and console log, it also supply a flow-control GUI for single step task as long as the host supports.
but according to the ReactNative's remote debug page:
React Native JS code runs as a web worker inside this tab.
it seems that the chrome is not only a frontend but also executes the code being debugged? so my question is:
1.how can the device-dependent code be executed in chrome?
2.will the device also execute code ? if it is, what's the relationship between it and chrome? if not, how does the app run in device?
1.how can the device-dependent code be executed in chrome?
In case of Chrome debugging mode, the JavaScript code runs within Chrome itself (instead of the JavaScriptCore on the device) and communicates with native code via WebSocket. Here, it will use the V8 engine. This allows us to see a lot of information on the Chrome debugging tools like network requests, console logs, etc.
Source: React Native Made Easy
Note that Chrome's V8 Javascript Engine is not the only React Native can use, you could debug in Safari as well and the code would run on Safari's JavascriptCore. See this for more
2.will the device also execute code ? if it is, what's the relationship between it and chrome? if not, how does the app run in device?
No, the JS code executes only in one place, either the browser's javascript engine if you are debugging, thus communicating with the device via Websockets, or the JavascriptCore of the device if running without debugging.

In the Chrome Console Source tab, how can I find where a script is called?

I have a console error when I view an app I am developing locally. The error takes place within by a third-party script hosted on an external domain.
The trouble is, I can't determine what part of the app locally is calling this this script. Either it's cleverly disguised in a local file or perhaps a chrome extension is calling it? It seems there must be a feature in the console that can tell me where in the stack this script is called.
You can put a breakpoint on the line where the error is thrown, and then when the debugger pauses, you will be able to see the Call Stack on the right pane under the Sources tab. You can add a breakpoint either by clicking on the line number or by adding a debugger; statement into your source code.
If you find yourself stepping into 3rd party libraries, you can right-click and select 'Blackbox script', and then next time the debugger runs through the app code, you will only break inside your own code.

Chrome apps that run on startup?

What would be the easiest way for me to set up a Chrome extension that starts when I log in to my Windows account, and can be connected to a WebSocket server to check for, say, new messages, and then pop open a desktop notification, that clicks to the messages web page?
I expect that making an extension is straight forward, as well as getting it to communicate with WebSockets, and making the desktop notification.
But what about making it automatically start when I log in to the computer? What would be a good way to do this in Windows? I am not interested in having the chrome browser to open up at log in, but I certainly don't mind if I see Chrome in the task bar.
You might look into chrome.runtime.onStartUp: https://developer.chrome.com/apps/runtime#event-onStartup, which is
"Fired when a profile that has this extension installed first starts up."
Also, you can use chrome.alarms to schedule a function to run every minute or so, to open a WebSocket somewhere, etc.
The app may try to unload itself if there are no active windows, so you can call some action in chrome.runtime.onSuspend (like loading an XHR somewhere) to cause onSuspendCanceled to trigger.