selenium-webdriverwebpackelectronviteelectron-forge

With Electron Forge + Vite + Selenium, I got a javaScript error occurred in the main process


I'm building Electron desktop app with Selenium.

I initialized my project with this command

npm init electron-app@latest my-new-app -- --template=vite-typescript also you can check this link

and I installed dependencies.

yarn add selenium-webdriver && yarn add -D @types/selenium-webdriver

In My main.ts file, there is a code for calling Selenium

let driver: WebDriver | null = null
  try {
    const options = new chrome.Options()
    // chrome.setDefaultService(new chrome.ServiceBuilder("/path/to/chromedriver"))

    driver = await new Builder()
      // .setChromeOptions(options)
      .forBrowser(Browser.CHROME)
      .build()

    await driver.get("https://www.google.com")
    await driver.findElement(By.name("q")).sendKeys("webdriver", Key.RETURN)
    await driver.wait(until.titleIs("webdriver - Google Search"), 1000)
  } finally {
    if (driver) {
      await driver.quit()
    }
  }

It was okay when I use selenium without chrome.Options

But When I use this line(const options = new chrome.Options()) I got this error message.

App threw an error during load
Error: Failed to import atoms module get-attribute.js. If running in dev mode, you need to run `bazel build //javascript/node/selenium-webdriver/lib/atoms:get-attribute.js` from the projectroot: Error: Could not dynamically require "./atoms/get-attribute.js". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.
    at requireAtom (/Users/ittae/GitHub/my-vite-app/.vite/build/main.js:1585:13)
    at Object.<anonymous> (/Users/ittae/GitHub/my-vite-app/.vite/build/main.js:1572:22)
    at Module._compile (node:internal/modules/cjs/loader:1391:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1451:10)
    at Module.load (node:internal/modules/cjs/loader:1214:32)
    at Module._load (node:internal/modules/cjs/loader:1030:12)
    at c._load (node:electron/js2c/node_init:2:13672)
    at cjsLoader (node:internal/modules/esm/translators:360:17)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:305:7)
    at ModuleJob.run (node:internal/modules/esm/module_job:218:25)

So I can't use chrome.Options, chrome.ServiceBuilder

I don't know this error where are from? Vite, Selenium, Electron?

How can I solve this problem?

I moved my project to Webpack instead of Vite. But in that case, it didn't work without chromedriver.

I added chromedriver to /usr/local/bin but webpack project couldn't find chromedriver. but I'll try to solve it in Webpack environment.


Solution

  • Finally I found the solution.

    Open a vite.main.config.ts file. There is a config:UserConfig variable.

    Add a variable to that variable.

    Like this:

    const config: UserConfig = {
        build: {
          lib: {
            entry: forgeConfigSelf.entry!,
            fileName: () => '[name].js',
            formats: ['cjs'],
          },
          rollupOptions: {
            external,
          },
          commonjsOptions: {
            dynamicRequireTargets: ['node_modules/selenium-webdriver/lib/atoms/*'],
          },
        },
    }