Unexpected server response: 101 running puppeteer from npm specifier

[johnspurlock]

deno 1.29.4 (release, aarch64-apple-darwin)
v8 10.9.194.5
typescript 4.9.4

Run the following with --allow-all

import * as puppeteer from 'npm:puppeteer@19.5.2';

// prereq:
// cd ~/Library/Caches/deno/npm/registry.npmjs.org/puppeteer/19.5.2
// npm install

const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
const buffer = await page.screenshot({ encoding: 'binary' });
console.log(buffer);
await browser.close();

Fails with:

error: Uncaught ErrorEvent {
  [Symbol(kTarget)]: WebSocket {
    _events: {
      open: [Function: onOpen] { [Symbol(kIsForOnEventAttribute)]: false, [Symbol(kListener)]: [Function] },
      error: [Function: onError] { [Symbol(kIsForOnEventAttribute)]: false, [Symbol(kListener)]: [Function] }
    },
    _eventsCount: 2,
    _maxListeners: undefined,
    _binaryType: "nodebuffer",
    _closeCode: 1006,
    _closeFrameReceived: false,
    _closeFrameSent: false,
    _closeMessage: Buffer(0) [],
    _closeTimer: null,
    _extensions: {},
    _paused: false,
    _protocol: "",
    _readyState: 3,
    _receiver: null,
    _sender: null,
    _socket: null,
    _bufferedAmount: 0,
    _isServer: false,
    _redirects: 0,
    _url: "ws://127.0.0.1:50185/devtools/browser/b7cbd738-56af-4691-8648-e8b6e7722fb2",
    _originalIpc: false,
    _originalSecure: false,
    _originalHostOrSocketPath: "127.0.0.1:50185",
    _req: null,
    [Symbol(kCapture)]: false
  },
  [Symbol(kType)]: "error",
  [Symbol(kError)]: Error: Unexpected server response: 101
    at ClientRequest.<anonymous> (file:///Users/user/Library/Caches/deno/npm/registry.npmjs.org/ws/8.11.0/lib/websocket.js:886:7)
    at ClientRequest.emit (https://deno.land/std@0.173.0/node/_events.mjs:379:28)
    at ClientRequest._final (https://deno.land/std@0.173.0/node/http.ts:150:10),
  [Symbol(kMessage)]: "Unexpected server response: 101"
}

[jacobmischka]

I'm also seeing this same underlying error from http when trying to use npm:ws package (as a transitive dependency for an npm package, so I'm not able to use native Deno websockets instead easily). Attempting to connect to a websocket server gives this response, which is not emitted in node:

IncomingMessageForClient details

IncomingMessageForClient {
  _readableState: yt {
    objectMode: false,
    highWaterMark: 16384,
    buffer: { head: null, tail: null, length: 0 },
    length: 0,
    pipes: [],
    flowing: null,
    ended: false,
    endEmitted: false,
    reading: false,
    constructed: true,
    sync: true,
    needReadable: false,
    emittedReadable: false,
    readableListening: false,
    resumeScheduled: false,
    errorEmitted: false,
    emitClose: true,
    autoDestroy: true,
    destroyed: false,
    errored: null,
    closed: false,
    closeEmitted: false,
    defaultEncoding: "utf8",
    awaitDrainWriters: null,
    multiAwaitDrain: false,
    readingMore: false,
    dataEmitted: false,
    decoder: null,
    encoding: null,
    [Symbol(kPaused)]: null
  },
  _events: {},
  _eventsCount: 0,
  _maxListeners: undefined,
  reader: undefined,
  response: Response {
  body: null,
  bodyUsed: false,
  headers: Headers {
  connection: "Upgrade",
  "sec-websocket-accept": "g0AYqDeXabq31vMLoNTG18fiB6E=",
  upgrade: "websocket"
},
  ok: false,
  redirected: false,
  status: 101,
  statusText: "Switching Protocols",
  url: "http://localhost:3000/websocket"
},
  socket: Socket {
    _readableState: yt {
      objectMode: false,
      highWaterMark: 16384,
      buffer: { head: null, tail: null, length: 0 },
      length: 0,
      pipes: [],
      flowing: null,
      ended: false,
      endEmitted: false,
      reading: false,
      constructed: true,
      sync: true,
      needReadable: false,
      emittedReadable: false,
      readableListening: false,
      resumeScheduled: false,
      errorEmitted: false,
      emitClose: false,
      autoDestroy: true,
      destroyed: false,
      errored: null,
      closed: false,
      closeEmitted: false,
      defaultEncoding: "utf8",
      awaitDrainWriters: null,
      multiAwaitDrain: false,
      readingMore: false,
      dataEmitted: false,
      decoder: null,
      encoding: null,
      [Symbol(kPaused)]: null
    },
    _events: { end: [Function: _onReadableStreamEnd] },
    _eventsCount: 1,
    _maxListeners: undefined,
    _writableState: Se {
      objectMode: false,
      highWaterMark: 16384,
      finalCalled: false,
      needDrain: false,
      ending: false,
      ended: false,
      finished: false,
      destroyed: false,
      decodeStrings: false,
      defaultEncoding: "utf8",
      length: 0,
      writing: false,
      corked: 0,
      sync: true,
      bufferProcessing: false,
      onwrite: [Function: bound $a],
      writecb: null,
      writelen: 0,
      afterWriteTickInfo: null,
      buffered: [],
      bufferedIndex: 0,
      allBuffers: true,
      allNoop: true,
      pendingcb: 0,
      constructed: true,
      prefinished: false,
      errorEmitted: false,
      emitClose: false,
      autoDestroy: true,
      errored: null,
      closed: false,
      closeEmitted: false,
      [Symbol(kOnFinished)]: []
    },
    allowHalfOpen: false,
    server: null,
    _server: null,
    _peername: undefined,
    _sockname: undefined,
    _pendingData: null,
    _pendingEncoding: "",
    _host: null,
    _parent: null,
    setTimeout: [Function: setStreamTimeout],
    connecting: false,
    [Symbol(kCapture)]: false,
    [Symbol(asyncIdSymbol)]: -1,
    [Symbol(kHandle)]: null,
    [Symbol(kSetNoDelay)]: false,
    [Symbol(lastWriteQueueSize)]: 0,
    [Symbol(timeout)]: null,
    [Symbol(kBuffer)]: null,
    [Symbol(kBufferCb)]: null,
    [Symbol(kBufferGen)]: null,
    [Symbol(kBytesRead)]: 0,
    [Symbol(kBytesWritten)]: 0
  },
  [Symbol(kCapture)]: false
}

ErrorEvent details

onerror ErrorEvent {
  [Symbol(kTarget)]: WebSocket {
    _events: {
      open: [Function: onOpen] { [Symbol(kIsForOnEventAttribute)]: true, [Symbol(kListener)]: [Function] },
      close: [Function: onClose] { [Symbol(kIsForOnEventAttribute)]: true, [Symbol(kListener)]: [Function] },
      error: [Function: onError] { [Symbol(kIsForOnEventAttribute)]: true, [Symbol(kListener)]: [Function] },
      message: [Function: onMessage] { [Symbol(kIsForOnEventAttribute)]: true, [Symbol(kListener)]: [Function] },
      pong: [Function]
    },
    _eventsCount: 5,
    _maxListeners: undefined,
    _binaryType: "nodebuffer",
    _closeCode: 1006,
    _closeFrameReceived: false,
    _closeFrameSent: false,
    _closeMessage: Buffer(0) [],
    _closeTimer: null,
    _extensions: {},
    _paused: false,
    _protocol: "",
    _readyState: 2,
    _receiver: null,
    _sender: null,
    _socket: null,
    _bufferedAmount: 0,
    _isServer: false,
    _redirects: 0,
    _url: "ws://localhost:3000/websocket",
    _originalIpc: false,
    _originalSecure: false,
    _originalHostOrSocketPath: "localhost:3000",
    _req: null,
    [Symbol(kCapture)]: false
  },
  [Symbol(kType)]: "error",
  [Symbol(kError)]: Error: Unexpected server response: 101
    at ClientRequest. (file:///home/mischka/projects/basic-interval-app/node_modules/.deno/ws@8.12.0/node_modules/ws/lib/websocket.js:889:7)
    at ClientRequest.emit (internal:deno_node/polyfills/_events.mjs:379:28)
    at ClientRequest._final (internal:deno_node/polyfills/http.ts:171:14),
  [Symbol(kMessage)]: "Unexpected server response: 101"
}

[jacobmischka]

Ah, I see the root cause of this is basically discussed in #17847: http upgrade doesn't seem to be implemented properly according to node.

[barthuijgen]

Same issue trying to use npm:chrome-remote-interface

Example code with the problem: https://gist.github.com/barthuijgen/37b19fad82b8f584477ef94052caa702

[sbayd]

I'm also facing the same issue and couldn't figure it out yet.

[bartlomieju]

We are working towards this, I'm gonna close this one in favor of #18913