Issue with puppeteer for mocking network requests

[efattal]

Stencil version:

 @stencil/core@ 1.12.1 (actually all versions after 1.8.11)

I'm submitting a: [x] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://stencil-worldwide.herokuapp.com/ or https://forum.ionicframework.com/

Current behavior: Mocking networks requests with page.setRequestInterception(true) doesn't work anymore while it worked with @stencil/core 1.8.11.

Error:

Request is already handled!

      12 |     page.on('request', function(req: Request) {
      13 |       if (req.method() == 'GET' && req.url().endsWith('/api/v1/employees')) {
    > 14 |         req.respond({
         |             ^
      15 |           status: 200,
      16 |           contentType: 'application/json',
      17 |           body: JSON.stringify({

      at assert (node_modules/puppeteer/lib/helper.js:270:11)
      at Request.respond (node_modules/puppeteer/lib/NetworkManager.js:462:5)
      at Request.<anonymous> (node_modules/puppeteer/lib/helper.js:112:23)
      at Page.<anonymous> (src/components/my-component/my-component.e2e.ts:14:13)
      at NetworkManager.<anonymous> (node_modules/puppeteer/lib/Page.js:110:68)
      at NetworkManager._onRequest (node_modules/puppeteer/lib/NetworkManager.js:240:10)
      at NetworkManager._onRequestPaused (node_modules/puppeteer/lib/NetworkManager.js:216:12)
        -- ASYNC --
      at Request.<anonymous> (node_modules/puppeteer/lib/helper.js:111:15)
      at Page.<anonymous> (src/components/my-component/my-component.e2e.ts:14:13)
      at NetworkManager.<anonymous> (node_modules/puppeteer/lib/Page.js:110:68)
      at NetworkManager._onRequest (node_modules/puppeteer/lib/NetworkManager.js:240:10)
      at NetworkManager._onRequestPaused (node_modules/puppeteer/lib/NetworkManager.js:216:12)
      at CDPSession._onMessage (node_modules/puppeteer/lib/Connection.js:200:12)
      at Connection._onMessage (node_modules/puppeteer/lib/Connection.js:112:17)

Test Suites: 1 failed, 1 passed, 2 total
Tests:       1 failed, 4 passed, 5 total
Snapshots:   0 total
Time:        11.445s
Ran all test suites.

Expected behavior: Should work as it used to.

Steps to reproduce: See this Github repo for a simple example. Switch to @stencil/core 1.8.11 and it will work.

Related code:

// insert any relevant code here

Other information:

[splitinfinities]

Seconded. We started writing tests for our app and it seems we can't hijack request url's like I expected, using the same methodology above.

[StevenMeyer]

This was "fixed" and then reverted 5 days later. Any plans to fix it @manucorporat ?

[dsappet]

Ran into this today. Any update from the Ionic team?

[splitinfinities]

I'm going to dig deeper into why this got reverted and report back to everyone.

[BHuber-PlanB]

@splitinfinities Any updates?

[christian-bromann]

Hi [Issue Author] 👋

We apologize for the delay in addressing this issue. The StencilJS team has been hard at work, and we appreciate your patience.

As StencilJS has undergone significant updates and improvements since this issue was originally posted, we are now supporting more frameworks to test Stencil components, e.g. WebdriverIO or Playwright. For UI testing we recommend to use these tools as they provide much better capabilities and feature.

Please let me know if you have any questions!

Thank you for your understanding and support of StencilJS!