How to load a Chrome Extension url

See original GitHub issue

This is a support/feature/bug - I believe it’s currently not possible to open a Chrome Extension URL with puppeteer…here is what I have:

const puppeteer = require('puppeteer');   // version 1.0.0

(async () => {
  
  const args = puppeteer.defaultArgs().filter(arg => String(arg).toLowerCase() !== '--disable-extensions');

  const b = await puppeteer.launch({
    headless: false,
    devtools: true,
    ignoreDefaultArgs: true,
    args: args.concat(['--remote-debugging-port=9223'])
  });

  const browser = await puppeteer.connect({
    browserWSEndpoint:  b.wsEndpoint() ,   //`ws://${host}:${port}/devtools/browser/<id>`,
    ignoreHTTPSErrors: false
  });

  const page = await browser.newPage();
  await page.goto('chrome-extension://hfnplgaapcnjblpebnhibfcdfllkpaaf/dist/index.html');


})();

but I still can’t launch the chrome extension, I get the same error:

UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: net::ERR_BLOCKED_BY_CLIENT

there is no error if I do

await page.goto('http://yahoo.com');

so it has to do with attempting to load the extension, any ideas? I can load the extension url with regular Chrome, so the url is correct. Also, when I load Chromium, I don’t see any extension icons. So my hypothesis is that I need to install/enable the extension in Chromium. For some reason I was thinking that it would just “copy” the extensions from my existing Chrome installation, but that was dumb thinking. Now I have to look up the API for installing a Chrome Extension…thanks for your help

Basically I am looking to launch a Chrome Extension page in a new tab, multiple times…the saga continues…

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:12 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
ORESoftwarecommented, Jan 13, 2018

Ok this worked for me! How exciting

const puppeteer = require('puppeteer');

(async () => {

  const args = puppeteer.defaultArgs().filter(arg => String(arg).toLowerCase() !== '--disable-extensions');

  const browser = await puppeteer.launch({
    headless: false,
    devtools: true,
    ignoreDefaultArgs: true,
    args: args.concat([
      '--remote-debugging-port=9223',
      '--load-extension=/Users/alexamil/WebstormProjects/oresoftware/sumanjs/suman-chrome-extension'
      ]
    )
  });
  
  const c = await puppeteer.connect({
    browserWSEndpoint:  browser.wsEndpoint() ,   //`ws://${host}:${port}/devtools/browser/<id>`,
    ignoreHTTPSErrors: false
  });

  const page = await c.newPage();
  await page.goto('chrome-extension://hfnplgaapcnjblpebnhibfcdfllkpaaf/dist/index.html');

})();

one more question - is there a way to open DevTools at the bottom of the page instead of on the side?

0reactions
SelakaKithmalcommented, Aug 31, 2022
protected async Task<Browser> GetPuppeteerBrowser(bool headless, bool requireGeoUnblocking = false, string region = "USA")
        {
            Browser browser;

           
            string enableAutomation = "--enable-automation";
            string noSandBox = "--no-sandbox";
            string disableSetUidSandBox = "--disable-setuid-sandbox";
            string[] argumentsWithoutExtension = new string[] { "--disable-gpu", "--disable-dev-shm-usage", enableAutomation, disableSetUidSandBox, noSandBox };

            _logger.Information("Running with KProxy enabled mode in the Puppeteer Browser.");
            
            string baseDirectoryPath = Path.GetDirectoryName(this.GetType().Assembly.Location);
            _logger.Information("base directory path : {path}", baseDirectoryPath);
            string kproxyPath = Path.Combine(baseDirectoryPath, "artifacts", "kproxy");

            _logger.Information("kproxy path : {path}", kproxyPath);
            string disableExtensionPath = $"--disable-extensions-except={kproxyPath}";
            string loadExtensionPath = $"--load-extension={kproxyPath}";


            string[] argumentsWithExtension = new string[] { "--disable-gpu", "--disable-dev-shm-usage", disableExtensionPath, loadExtensionPath, enableAutomation, disableSetUidSandBox, noSandBox };

            browser = await Puppeteer.LaunchAsync(new LaunchOptions
            {
                Headless = false, // When loading extensions to browser it need to run with head.
                Args = argumentsWithExtension,
                IgnoreHTTPSErrors=true 
            });
            _logger.Information("running pupateer browser with version : {version}", await browser.GetVersionAsync());
            await UnblockBrowserForGeoRegionAsync(browser, region);

            return browser;
        }

The above code worked for me

Read more comments on GitHub >

github_iconTop Results From Across the Web

chrome.extension - Chrome Developers
Converts a relative path within an extension install directory to a fully-qualified URL. Parameters. path. string. A path to a resource within an...
Read more >
How to Add Chrome Extensions - Lifewire
Go to the Chrome Web Store > search for extension > select extension > Add to Chrome > Add extension. You can download...
Read more >
How to Manually Install A Chrome Extension In Two Steps
In Chrome, navigate to chrome://extensions/Now drag and drop the extension from your file manager anywhere onto the extensions page in Chrome.
Read more >
How to install the unpacked extension in Chrome - Webkul Blog
Goto Chrome Settings using three dots on the top right corner. 1-2 · Now, Enable developer mode. developer-mode · Click on Load Unpacked...
Read more >
How can I get the URL of the current tab from a Google ...
If url is undefined try reloading your extension from chrome://extensions This will reload the extension's config and apply the newly added "tabs" permission....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found