Using esm (ES6 modules) causes failure.

[Rob-pw]

Steps to reproduce

Tell us about your environment:

• Puppeteer version: 6.4.1
• Platform / OS version: Linux latitude 4.15.0-36-generic Bikeshed the API #39-Ubuntu SMP Mon Sep 24 16:19:09 UTC 2018 x86_64 x86_64 x86_64 GNU/Linux
• URLs (if applicable):
• Node.js version: 10.10.0

What steps will reproduce the problem?

Please include code that reproduces the issue.

1. copy example code into a new file example.js
2. replace const puppeteer = require('puppeteer') with ìmport puppeteer from 'puppeteer'
3. run with node -r esm example.js

What is the expected result?
Empty prompt, example.png in script folder.

What happens instead?

node -r esm demo.js 
(node:11730) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'on' of undefined
    at Function.addEventListener (../node_modules/puppeteer/lib/helper.js:165:13)
    at new NavigatorWatcher (../node_modules/puppeteer/lib/FrameManager.js:1146:14)
    at FrameManager.navigateFrame (../node_modules/puppeteer/lib/FrameManager.js:75:21)
    at Frame.goto (../node_modules/puppeteer/lib/FrameManager.js:404:37)
    at Page.goto (../node_modules/puppeteer/lib/Page.js:579:49)
    at require (../demo.js:6:14)
    at process._tickCallback (internal/process/next_tick.js:68:7)
(node:11730) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)

[JoelEinbinder]

I can't reproduce this. I did renamed screenshot.js into screenshot.mjs. I replaced the require with an import. I ran it with node --experimental-modules screenshot.mjs using node v10.10.0. It ran successfully.

[ydnar]

I can reproduce this using Puppeteer 1.9.0 with ava using ESM import statements.

[n8io]

Same.

Puppeteer version: v1.9.0
Platform / OS version: MacOS High Sierra v10.13.6
Node.js version: 10.12.0
ESM package version: 3.0.84
Start script: node -r esm ./example.js

I had to revert back to Puppeteer v1.8.0 from v1.9.0 to get back to a working state.

[xukaifengit]

I also have this situation.When the high concurrent operation, it will report this exception from time to time, so annoying

[AVGP]

I'm wondering why you use the esm module instead of the experimental ESM module support in node 10.12?

This works:

node --experimental-modules examples/screenshot.mjs

This does not:

npm i esm
node -r esm examples/screenshot.js

[ydnar]

I’m using ava, which controls Node and compilation. This is the relevant issue:

avajs/ava#1810

The error we’re seeing:

Rejected promise returned by test. Reason:

  TypeError {
    message: 'Cannot read property \'on\' of undefined',
  }

  Function.addEventListener (node_modules/puppeteer/lib/helper.js:165:13)
  new NavigatorWatcher (node_modules/puppeteer/lib/FrameManager.js:1146:14)
  FrameManager.navigateFrame (node_modules/puppeteer/lib/FrameManager.js:75:21)
  Frame.goto (node_modules/puppeteer/lib/FrameManager.js:404:37)
  Page.goto (node_modules/puppeteer/lib/Page.js:579:49)
  goto (test/helpers/puppeteer-page.js:17:24)
  visit (test/integration/search.test.js:17:9)

[aslushnikov]

@Rob-pw: please use the --experimental-modules. This is the way forward with ESM in node.js

AVA users: there's avajs/ava#1810 that covers ESM support in ava.

[damianobarbati]

+1 on this, @Rob-pw thanks for spotting it: after bumping to 1.9.0 I really had no idea where this error was coming from.
@AVGP @aslushnikov currently experimental-modules flag is not very much an option, current .mjs and native ESM support in node is very limited.
ESM package is a great bridge in these years of transition.

[jdalton]

Hi @aslushnikov!

👋 Node core and Node Module WG member here. There is no set date for when --experimental-modules will be unflagged. There's also no guarantee that what has shipped now is what will be in the future. For example, there are several discussions in the Node Module WG on how to approach implementation. One such discussion is to ship a maximally minimal implementation that would require package-maps for resolving bare specifiers (no longer using the Node module resolution algorithm).

The --experimental-modules flag really does mean experimental and shouldn't be relied on for anything beyond kicking the tires.

I'm open to digging into it from the esm side of things.
Do you have any idea what could have changed between v1.8.0 from v1.9.0?

[damianobarbati]

@aslushnikov after digging into the code I noted that this does not seem to not be related to ESM but to this line into into Connection.js:
https://github.com/GoogleChrome/puppeteer/blob/d547b9d24a803c0adf923b3a821ae5f43e79bb53/lib/Connection.js#L51
which is called here into FrameManager.js:
https://github.com/GoogleChrome/puppeteer/blob/c237947b324338ece670b4f4e879880265ec6965/lib/FrameManager.js#L1146

• connection._connection is undefined
• connection instanceof CDPSession is true
• loop starts and connection._connection which is undefined is assigned to connection
• undefined is not an instance of CDPSession, "while" loop stops and undefined is returned
• helper.addEventListener(Connection.fromSession(client), ..., ...) attempt to attach event on undefined and the error is fired

Replacing the following into https://github.com/GoogleChrome/puppeteer/blob/d547b9d24a803c0adf923b3a821ae5f43e79bb53/lib/Connection.js#L50 solves the issue

while (connection instanceof CDPSession && connection._connection)

But I'm not sure whether that makes "logic" sense.

[aslushnikov]

I'm open to digging into it from the esm side of things.

@jdalton awesome, reopening.

Do you have any idea what could have changed between v1.8.0 from v1.9.0?

Thanks to @damianobarbati input, I've debugged it down to d547b9d. The core issue seems to be that
an instance of Connection class satisfies the instanceof check against CDPSession class.

Here's a small snippet from Connection class (check out the console.log statements):

@jdalton any ideas what's going on here?

[jdalton]

Thanks @aslushnikov!

I narrowed it down to a faulty Symbol.hasInstance helper on our end (standard-things/esm@111328e).