cypress-example-recipes icon indicating copy to clipboard operation
cypress-example-recipes copied to clipboard

Example writing Parcel preprocessor

Open bahmutov opened this issue 7 years ago • 5 comments

Cypress v2.1.0

Resolve the following problems

  • source maps not found
GET /__cypress/iframes/integration/spec.js 200 9.817 ms - 711
GET /__cypress/tests?p=cypress/support/index.js-658 200 7.570 ms - -
GET /__cypress/tests?p=cypress/integration/spec.js-126 200 7.280 ms - -
GET /index.map 404 7.033 ms - -
GET /spec.map 404 6.007 ms - -
  • syntax errors inside files being swallowed
bundlers[filePath] = new Promise((resolve, reject) => {
    bundler.on('bundled', b => {
      console.log('bundled %s', filePath)
      console.log('into %s', b.name)
      // file1 should cause ReferenceError
      file1.emit('rerun')
      resolve(b.name)
    })
    bundler.bundle().catch(reject)
  })

But no error is reported

screen shot 2018-04-09 at 11 43 24 pm
  • when is file "close" event fired? I do not see it ever fired.
file.on('close', () => {
    console.log('closing', filePath)
    console.log(bundler)
    delete bundlers[filePath]
  })

https://docs.cypress.io/api/plugins/preprocessors-api.html#File-events

bahmutov avatar Apr 10 '18 03:04 bahmutov

source maps not found

I'm honestly not too knowledgeable about source maps. Can you elaborate what needs to happen for them to be supported?

syntax errors inside files being swallowed

The problem is you only ever create one promise that's resolved or rejected once. You need to create a new promise every time the files get re-bundled. Check out how it's done with webpack or with browserify. You need an event from Parcel that tells you it started bundling, that's when you assign a new promise. Then you need an event if it succeeds (where you resolve) and an event if it fails (where you reject).

when is file "close" event fired? I do not see it ever fired.

It should fire for the spec when you close the spec or switch specs. It fires for the support file if you close the project, but you'll only really see that in global mode.

chrisbreiding avatar Apr 10 '18 14:04 chrisbreiding

Thanks @chrisbreiding for detailed answers. I am ok with error handling - I reworked the event in watch mode to overwrite the promise, and seems to be ok.

  • source maps

Generated bundle, for example dist/spec.js points at the map file in the same folder

$ ls -la dist
total 32
drwxr-xr-x  6 gleb  staff   204 Apr  9 23:06 .
drwxr-xr-x  8 gleb  staff   272 Apr 10 09:46 ..
-rw-r--r--  1 gleb  staff  3489 Apr 10 11:02 index.js
-rw-r--r--  1 gleb  staff  1895 Apr 10 11:02 index.map
-rw-r--r--  1 gleb  staff  2758 Apr 10 11:02 spec.js
-rw-r--r--  1 gleb  staff   567 Apr 10 11:02 spec.map
$ cat dist/spec.js
...
},{"../utils":3}]},{},[1])
//# sourceMappingURL=/spec.map

I see Cypress asking for the source map, but without correct /__cypress/tests?p=cypress/integration/ prefix, thus failing

GET /__cypress/tests?p=cypress/support/index.js-275 200 3.070 ms - -
GET /__cypress/tests?p=cypress/integration/spec.js-014 200 4.033 ms - -
GET /index.map 404 14.264 ms - -
GET /spec.map 404 4.098 ms - -

So it would be nice to be able to serve static map file with tests

  • I do not see "close" event at all - stopping server, etc seems the same - the console log never shows this event.

bahmutov avatar Apr 10 '18 15:04 bahmutov

@chrisbreiding I ran cypress-browserify-preprocessor with DEBUG env variable, and saw other messages, but not the close one.

https://github.com/cypress-io/cypress-browserify-preprocessor/blob/master/index.js#L178

bahmutov avatar Apr 10 '18 16:04 bahmutov

That's probably a bug. I'll have to look into it.

chrisbreiding avatar Apr 10 '18 18:04 chrisbreiding

Another two interesting bugs

  • Parcel bundler does not report an error, but does not bundle all of the sudden
  • Test runner swallows ENOENT errors https://github.com/cypress-io/cypress/issues/1877

bahmutov avatar Jun 05 '18 03:06 bahmutov