Chrome Extension Internals - google-chrome

I am trying to understand the internals of Chrome Extension. It will be great if you can provide more details regarding this.
My understandings are as follows:
Extensions run in its own process.
Extensions interact with Browser process through IPC.
My question:
1. Whenever we call a extension api such as chrome.module.function() from extension user script, I would expect the function to go to the renderer process first and then send a IPC such as ExtensionHostMsg_ABC to the browser process to do the required operation.
Extension Process Browser Process
ExtensionHostMsg_Req
chrome.module.function() ----------------> Handle the msg
ExtensionMsg_Response
Send the result back to js <-----------------
But to my surprise, I see that all the extension api functions are declared and defined in chrome/browser/extensions/xyz_api.h & .cc files. So it looks like when a api is called from js, we come directly to the browser process. Where and how does this magic happens?
I also see some extensions bindings c++ code in chrome/renderer/extensions/abc_bindings.cc and the corresponding js code in chrome/renderer/extensions/resources/abc.js. I think we have this code to share some information between the extension renderer and js code. Is it right? Can you provide me a example scenario for this?
Sorry for asking these basic questions. I really appreciate your help.

Regarding your question on how the bindings are made. You define your extension API in chrome/common/extensions/api/extension_api.json which is how V8 sets up the C++ JavaScript bindings. That is where all the magic happens :)
If you want to call privileged APIs from the content script you would need to add the namespace to chrome/renderer/resources/extensions/renderer_extension_bindings.js
For more information regarding the design of the Extension System in Chromium, there are good docs that explain the whole process model and interactions:
http://www.chromium.org/developers/design-documents/extensions

Related

Use browser.js in a service worker

We want to use a Service Worker to perform client-side source code transformation for development purposes. We want to use Babel to transpile ES6+/ES2015 files to ES5 modules.
However, including the browser version of babel in a Service Worker using importScripts causes the following errors:
GET http://localhost:8080/babel-core/browser.js net::ERR_FAILED
Uncaught NetworkError: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'http://localhost:8080/babel-core/browser.js' failed to load.
So, the question is, how to correctly import babel into a Service Worker.
edit: This is not the obvious NetworkError, as we can change the content of the file into something simple, which enables us to actually load and execute the file. Also, the file can be loaded with a normal <script> tag.
edit2: To get this message, check out this repository https://github.com/onsetsu/lively4-core.git, start a local server at port 8080 and finally load http://localhost:8080/bootworker.html. We are currently using Chrome 44.
How about my experiment here https://github.com/bahmutov/babel-service - you can see the demo at https://babel-service-demo.herokuapp.com/.
I am using feature tests to detect supported features and transpile the intercepted code selectively. Of course this is just a start and only maps default parameters to babel plugins, but more features could be mapped.
Also, the people behind feature tests are discussing the selective transpile https://github.com/getify/es-feature-tests/issues/9
As a general rule, using a service worker for something crucial for a site's functionality isn't a recommended practice. Service workers are intended to be a progressive enhancement, and your sites should be designed to still be functional if the associated service worker isn't available.
Even in browsers which support service workers, there might not be one controlling your page if a user shift-reloads or if it's the very first navigation, before the service worker has had a chance to take control.
To answer your specific question, the ServiceWorkerGlobalScope under which service worker code executes exposes different functionality vs. a normal page's global scope, and it would appear that something in the browser.js script you're trying to import assumes functionality that's only available in a normal page. Unfortunately, Chrome's DevTools, even with the debugger enabled, doesn't reveal which specific statement is causing the error, so I can't say which exact statement(s) are invalid.

How to get change in HTML DOM in LabVIEW?

I am doing IOT related project in Labview using Arudino as hardware.
I was able switch off/on an led on Arudino by Pressing OFF/ON on website by using datasocket vi. Now what i want is to control the intensity of led from Website.
I have a range slider in my website and its real time value can be viewed in textarea,div,input type.
Is there any way i can get that real time value that is being changed in HTML DOM in Labview.
I know that datasocket vi returns the html source code but not the HTML DOM.
I dont want to use the Web Publishing Services as they dont work in my Laptop.
This is the link im referring for datasocket.
Datasocket Labview
You can do something like creating a web socket, but I expect the easiest thing is to use a web service. You can create one in LV and add a setLEDIntensity method to it and call it from your JS code. You can find a simple example here and in other documents in that community.
Use WebSocket API for LabVIEW to send and receive data from the web. This is the best option for you.
https://decibel.ni.com/content/docs/DOC-40572

popup chrome NPAPI extention, redirecting to new tab

Hey I got a quick question:
I have got a chrome extension that adds a popup page to the toolbar. It accepts input from the user then calls a NPAPI dll which generates an XML file. I would like to be able to, after the NPAPI dll finishes its work, create a new tab which would open to the newly generated XML page.
Can anyone help me out with this?
Thanks.
You can let your NPAPI communicate to JavaScript via NPN_Invoke. NPN_Invoke will allow you to invoke a method on a given NPObject.
For example, you can construct your method NPN_GetStringIdentifier, and use that to execute a method in your popup.
You can refer to this article, on how to communicate back to JavaScript from NPAPI plugin. The example shown there is a simple console.debug("Hello from C++")
Update
I noticed you want to open the xml file right after. Did you save the XML file in the location of the extension folder?
C:\Users\[user]\AppData\Local\Google\Chrome\User Data\Default\Extensions\[extension_id]\[extension_version]
Then you can open it with chrome.extension.getURL([file]);
But, it would be great if you return the XML file and open it within the extension itself.
Ideally you don't put the logic for UI behavior into the plugin, but in the extension. The plugin should tell the extension where the XML file is located and the extension should handle the rest.
This could be done two ways:
Synchronously returning the location is easy: You do the work directly from the Invoke() implementation of your plugin and return a string containing the location of the file to the script.
This of course has the downside of blocking the main- (and GUI-)thread until processing is done and thus is no option when processing is not done quickly.
Asynchronously returning it is a bit more work: Ideally you allow the extension to specify a callback function that should be invoked when processing is done. This could be achieved by either handling addEventListener() accordingly or by allowing the script to pass a callback as a parameter when it initiates the XML processing. The XML processing function then starts or feeds another thread doing the actual work and returns immediately. When the processing is done you call NPN_InvokeDefault() on the stored function object to call it.
Beware: Calling into JavaScript always has to be done on the main thread.

Google Maps API non-minified/obfuscated

Does Google provide non-minified / non-obfuscated versions of their various javascript API's?
For example, I'm using their LocalSearch control and getting a cryptic error "a is null". Setting a breakpoint in Firebug is not very helpful because I'm 3 levels deep in minified code.
There isn't a non-obfuscated version of the API (it isn't an open source project). If you post a link to the page in question, we might be able to help debug the issue?
I have seen the "a is null" message many times and each time have been able to track down the issue eventually.
As mentioned, there isn't a way to get the original version with real (helpful) variable and comments since it's not open source
But! There's a new(ish?) feature in Google Chrome Dev Tools where you can de-minify code ("make minified code human readable")
https://developers.google.com/web/tools/chrome-devtools/javascript/reference#format
should at least help a bit with debugging

Can an AIR app be programmed to handle a URL protocol?

I'm writing what is essentially a browser in Adobe AIR (ActionScript, not AJAX). A great bit of functionality to implement would be protocol handling. iTunes, for instance, handles itms protocols; when your friend sends you a link beginning with "itms://", it's going to launch iTunes as long as it's installed. Is there a way to write an AIR app (requiring AIR 2 would be fine) that can be the "handler" for a protocol in this way?
There is no way, programatically speaking, to specifically handle a particular protocol. However, there is InvokeEvent. InvokeEvent will be fired when the application is "invoked", either when it's explictly launched or if an associated file or URL is activated.
The process of associating your app with a particular file type or protocol scheme is separate and application-dependant. In iOS, for example, you would need to specify the protocol in Info.plist under CFBundleURLTypes/CFBundleURLSchemes.
Yes. You can use the URLLoader class to download data in binary form (URLLoader.BINARY) and then parse this as appropriate. See this CS3 documentation on working with external data.
http://www.patrick-heinzelmann.de/labs/lastfm/
I'm not sure exactly how it works and I don't see a way to download the app, so I can't even test it, but maybe it will help...
Check out this page. I am trying to find out the same thing, but I haven't found any solution to do it with just Air yet. Seems like you might need a custom installer to setup the correct registry entries, and a proxy application to "wash" the input to a correct format that then can start your application with the correct command line parameters. Hope this can be of any assistance.