puppeteer unable to load chrome extension in browser

Question

This is my first time using puppeteer and I want to open a google chrome page and navigate to a chrome extension I have installed . I try to enable the chrome extension but when I run my script in headless:false mode the browser pops up without my extension .

My code :

//my extension path 
const StayFocusd = 'C:\\Users\\vasilis\\AppData\\Local\\Google\\Chrome\\User Data\\Default\\Extensions\\laankejkbhbdhmipfmgcngdelahlfoji\\1.6.0_0';

async function run(){
  
  //this is where I try to enable my extension 
  const browser = await puppeteer.launch({
    headless: false,
    ignoreDefaultArgs: [`--disable-extensions-except=${StayFocusd}`,"--enable-automation"],
  } 

  );
  
  const page = await browser.newPage();       
  sleep(3000);

  await browser.close();  
}


run();

So the extension does not load and I get no error or anything . I would appreciate your help

Answer 1

It is not enough to set --disable-extensions-except launch flag with your CRX path, you should also use --load-extension to actually load your extension in the opened browser instance.

You also seem to make a mistake using ignoreDefaultArgs where you should have used args (like this Chromium literally did the opposite of what you've expected).

Correct usage of puppeteer.launch:

const browser = await puppeteer.launch({
  headless: false,
  args: [
    `--disable-extensions-except=${StayFocusd}`, 
    `--load-extension=${StayFocusd}`,
    '--enable-automation'
  ]
}) 

You can make use of the official docs about Working with Chrome Extensions (link updated on: 2023-03-11).