puppeteer: Problem with WebSocketTransport.js

正常使用puppeteer是完全没有问题的，但是当我在使用vue-cli3创建的项目中使用puppeteer的时候，就会提示这个错误。我同样运行了npm install --save ws 这个命令，但是依旧不起作用。

@PeterKnight, update the node js version, I don’t remember, but it seems it helped me Hello, I had the same problem and i resolved excuted npm install --save ws and changed the path in the file WebSocketTransport.js const WebSocket = require(‘…/node_modules/ws’);

I have the same issue. I run jest __integration__/my.spec.js with the dummy test file below :

my.spec.js

const puppeteer = require('puppeteer');

describe('H1 Text', () => {
  test('h1 loads correctly', () => {
    expect(1).toEqual(1);
  });
});

The result is :

 FAIL  __integration__/my.spec.js
  ● Test suite failed to run

    Cannot find module 'ws' from 'WebSocketTransport.js'

    However, Jest was able to find:
    	'./WebSocketTransport.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

    However, Jest was able to find:
    	'./Launcher.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

    However, Jest was able to find:
    	'./Puppeteer.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

    However, Jest was able to find:
    	'lib/api.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

      at Resolver.resolveModule (../../node_modules/jest-resolve/build/index.js:202:17)
      at Object.<anonymous> (../../node_modules/puppeteer/lib/WebSocketTransport.js:16:19)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        1.269s
Ran all test suites matching /__integration__\/my.spec.js/i.

Looking at the file node_modules/puppeteer/package.json, I see there is a "browser" entry, as below :

{
  "name": "puppeteer",
  "version": "1.13.0",
  "description": "A high-level API to control headless Chrome over the DevTools Protocol",
  "main": "index.js",
  "repository": "github:GoogleChrome/puppeteer",
  "engines": {
    "node": ">=6.4.0"
  },
  "puppeteer": {
    "chromium_revision": "637110"
  },
  "scripts": {
    [...]
  },
  "author": "The Chromium Authors",
  "license": "Apache-2.0",
  "dependencies": {
    [...]
    "ws": "^6.1.0"
  },
  "devDependencies": {
    [...]
  },
  "browser": {
    "./lib/BrowserFetcher.js": false,
    "./node6/lib/Puppeteer": false,
    "ws": "./utils/browser/WebSocket",
    "fs": false,
    "child_process": false,
    "rimraf": false,
    "readline": false
  }
}

Two observations from that :

• Getting rid of the "browser" entry, (or just of the "ws" entry within it), makes the import work. However I have no idea why this influence node require() behavior. As I understand it, this field should only be used by bundlers, like Webpack, when targetting a browser environment.
• I don’t understand the path "./utils/browser/WebSocket" provided as a replacement for ws in case of a browser environment, since there is no such file in the puppeteer package.

As a temporary solution, I reverted to version ~1.8.0 of puppeteer, before the introduction of that "browser" field.

inside your project node_modules/puppeteer/lib/WebSocketTransport.js need to change: from const WebSocket = require('ws'); to const WebSocket = require('../node_modules/ws/index');

@sunchenggit 请问你有没有解决这个问题呢

@1254859753 使用npm正常安装好ws依赖之后，删除node_modules/puppeteer/package.json中的这一行就可以正常运行了

...
"browser": {
...
    "ws": "./utils/browser/WebSocket",
...

I don’t understand the path “./utils/browser/WebSocket” provided as a replacement for ws in case of a browser environment, since there is no such file in the puppeteer package.

@bobbybobby Please read utils/browser/README.md.

I’m having the same problem. inside my project node_modules/puppeteer/lib/WebSocketTransport.js I change: const WebSocket = require(‘ws’); to const WebSocket = require(‘…/node_modules/ws/index’); but now I have another error : TypeError: BrowserFetcher is not a constructor at resolveExecutablePath (node_modules/puppeteer/lib/Launcher.js:688:28) at ChromeLauncher.launch (node_modules/puppeteer/lib/Launcher.js:198:53)