Access Electron API from a completely different system process

I am looking for a way to capture a screenshot of a VS Code extension host window. This window is opened when my extension’s tests are being run (this is coming from the default Yeoman template for VS Code extensions).

I cannot use my extension’s context as the extension only has access to the VS Code API and VS Code runs extensions in a different Node process from the Electron one (main or renderer). IPC is used through the API instead of running extensions in-process.

I Node package, such as process-list could be used to enumerate processes running on the system from the extension to find the window of the VS Code extension host (it’s okay to assume the only running VS Code instance is that extension host as running the tests requires no other instances of VS Code to run).

From there, however, I don’t know how to obtain the NodeJS process’ JS context of that Electron window or if that’s even possible in Node. Are there ways to pick an arbitrary system process (by PID for example), test it for being a Node process and prod into that process’ JS context to be able to invoke the JS APIs in it?

Update: I have figured I can try listing all running processes and then calling process._debugProcess(proc.pid); for all of them, which is a Windows way of saying kill -s SIGUSR1 . This works in the sense that all Node processes respond successfully to this call, i.e. do not throw an error.

However, compared to a fully successful invocation of this, lines are these are not printed out for almost all of the processes:

Debugger listening on ws://127.0.0.1:9229/cf49bcfe-d922-4f89-b438-57755d254198
For help see https://nodejs.org/en/docs/inspector

These lines show when connecting to only some Node processes. The lines would tell me which port and UUID to connect to using CDP so that I could run Runtime.evaluate and issue JavaScript commands in the context of the given process, if only I could attach a debugger to it.

Electron: DevTools makes application FASTER?

I have electron app i’m developping; I face a strange behaviour which I would like to benifit.

I have a div element thats with overflow:auto, and, inside it, I have a lot of elements. When scrolling with mouse and trackpad, it is kinda choppy, but with the scrollbar it’s not.

But as I’m developping it, I noticed that if I open my DevTools once, the app gets smoother, even after it get closed. So my conclusion is: Opening developper tools makes electron faster.

But my app is not going to be in Développement forever. What does opening dev tools triggers that could be triggered by my app?

how to inject chrome api’s like chrome.runtime in electron

i have an electron app and i need to get the data at runtime, for chrome extension i used chrome.runtime. But how to get the runtime data in the electron. Is there any alternative api’s like chrome.runtime in electron or is there any other way to do it

React render() method is not calling in runtime when i clicking a button in the electron app

i have a chrome extension and i made an electron app over it. i am using react js as a javascript frame work . i have like button and asset button which updates and render the component at runtime. its working in the chrome extension because of chrome.runtime API but in electron the react render method is not calling when i click a like button ,it is calling after i refresh the page .. Can you please help me out with this if anybody knows any runtime api for electron that will update and call the button component in the runtime .

electron’s “addExtension” API is not working

I am facing some issues while trying to add Grammarly extension to my Electron app. I am adding the extension like this –

var extensionPath = '/Users/abc/Library/Application Support/Google/Chrome/Default/Extensions/kbfnbcaeplbcioakkpcpgfkobkghlhen/14.848.1663_0';
var extension = BrowserWindow.addExtension(extensionPath);

I am adding this extension after the app is in ready state.

I can see the presence of the icon provided by Grammarly but its functionality is not working.

enter image description here

I also tried with few other extensions like YoutubeDownloader etc, but those are also not working. Am I missing something here? Is there any specific way in which I should add the extension to make it work? Any help is highly appreciated.

Thanks in Advance.

See debug messages from Chrome Extension’s background page in Electron app

New to Electron here. I have added a Chrome extension to an Electron app successfully, but have hard time debugging it and specifically its background page. I know how to open a dummy html page for a background script in the browser, but is the same functionality possible here?

If not, is there any other convenient way of debugging the background script?

Thanks

Add chrome extension to an electron js application for mac osx?

I am building a small always on the top browser with electron. To show the website I am using .

Now my idea is to integrate an adblocker (preferably uBlock origin) into the browser and it should work and affect the webview. As electron is running on chrome (as far as I know) there must be a way this is possible right?

So after googling a bit, I found this:

https://electronjs.org/docs/api/browser-window#browserwindowaddextensionpath

This somehow looks like what I want to achieve. I downloaded the source of uBlock origin an added it to an extra extensions folder into the project. I ran this function both on the BrowserWindow and also my created mainWindow and both give errors or not the expected results (which means not blocking ads).

So am I doing this right? What do I need to change? Is there an easier way? Is there even a way?

Why is Chrome/Electron Devtools Perf showing almost nothing?

I have a React based Electron app and it runs attrociously slow for the first 15 seconds to 2-3 minutes of startup. I’m trying to track down the issue so I open the devtools, go to the ‘Performance’ tab and click the Record ‚óŹ button. The bar showing how much of the recording memory has been used up fills up very quickly, much quicker than most apps so I stop it as soon as I can (between 1/8th and 1/4th then entire bar) usually in about 1 a second or less. Chrome/Electron then takes 30-40 seconds to parse/process the data before it show anything but when it finishes it shows almost nothing

enter image description here

Is there a known issue like this and a known workaround? A way to get more info out of devtools? Note that once the app is running smoothly I get more normal readings from devtools but fixing that first 2-3 minutes is turning out to be fairly difficult with no info.

enter image description here

Interacting with dev tools while scraping with nightmare.js with .evaluate

I am trying to automate a process that I manually perform in devtools. In the dev console I’ll create a variable object:

var api = angular.element(document.body).injector().get('apiFactory')

and then make calls on the api object api.getData(arg) and then get returned an object {}

How can I get the returned object like above in nightmare’s .evaluate function similarly below?

vo(run(arg)) 
   .then(function(result) {
   console.log(result);   
}, function(err) {
    console.log(err);
}); 

var run = function * (arg){ 
   nightmare.goto('https://...')

   var result = nightmare.evaluate((arg) => {
      var api = angular.element(document.body).injector().get('apiFactory')
      return api.getData(arg);     
   },result);

   yield nightmare.end();
};

Pause Electron with a hotkey or similar

In our Electron app I’d like to use the dev tools to inspect an element that only exists if a parent element experiences a mouseover action.

Whenever I go to interact with the dev tools my mouse has to move and the element disappears.

I know that the Chrome dev tools usually pause script execution with f8. This does not seem to work in Electron. I have also tried forcing the parent elements into :hover and :focus in the dev tools, but this does nothing.

Any ideas please on how to pause execution or force a parent into :hover?