bug: build and test watcher influence each other

Đang mở
#4,477 1 bình luận 1 reaction 1 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

@tanner-reits đang làm issue này rồi.

Từ ngày 4/10/2023.

Đánh giá

Issue này chưa được đánh giá.

Mô tả

Bug: Validated
Prerequisites
Stencil Version

3.3.1

Current Behavior

Running a devServer and the test watcher at the same time having some problems. It seems that they influence each other.

My use case: I am developing a new tests by running test.watch. To see how the browser interprets the html and to simulate the test I am running a devServer at the same time.

  • Changing something in *.tsx --> errors in test.watch output
  • Changing something in *.e2e.ts --> something happens in npm start output
Expected Behavior
  • Changing something in *.tsx --> no errors
  • Changing something in *.e2e.ts --> nothing should happen in npm start output
System Info
System: node 16.17.0
    Platform: darwin (22.5.0)
   CPU Model: Apple M1 Max (10 cpus)
    Compiler: /stencil-component-starter/node_modules/@stencil/core/compiler/stencil.js
       Build: 1685732213
     Stencil: 3.3.1 🎀
  TypeScript: 5.0.4
      Rollup: 2.42.3
      Parse5: 7.1.2
      Sizzle: 2.42.3
      Terser: 5.17.6
Steps to Reproduce
  1. clone https://github.com/ionic-team/stencil-component-starter.git and run npm i
  2. npm run test.watch
  3. npm run start --> some warnings occours
  4. add @Prop() new: string; to my-component.tsx
  5. tests will fail and show multiple errors

Warning in step 3:

console.info
      %cstencil color: white;background:#4c47ff;font-weight: bold; font-size:10px; padding:2px 6px; border-radius: 5px Running in development mode. 
      Location: http://localhost:3333/build/index-319682d3.js:3285:41
      at t (node_modules/@stencil/core/testing/index.js:4191:67)
          at Array.map (<anonymous>)

Errors in step 5:

 FAIL  src/components/my-component/my-component.e2e.ts
  ● Console

    console.error
      Failed to load resource: the server responded with a status of 404 (Not Found) 
      Location: http://localhost:3333/build/index-89c177c8.js

      at t (node_modules/@stencil/core/testing/index.js:4191:67)
      at node_modules/@stencil/core/testing/index.js:4192:5
      at node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:248
          at Array.map (<anonymous>)
      at Object.emit (node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:232)
      at CDPPage.emit (node_modules/puppeteer-core/src/common/EventEmitter.ts:118:18)
      at CDPPage._CDPPage_onLogEntryAdded (node_modules/puppeteer-core/src/common/Page.ts:430:12)
      at node_modules/puppeteer-core/src/common/Page.ts:251:35

    console.error
      requestfailed http://localhost:3333/build/index-89c177c8.js

      at node_modules/@stencil/core/testing/index.js:4205:12
      at node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:248
          at Array.map (<anonymous>)
      at Object.emit (node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:232)
      at CDPPage.emit (node_modules/puppeteer-core/src/common/EventEmitter.ts:118:18)
      at node_modules/puppeteer-core/src/common/Page.ts:220:19
      at node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:248
          at Array.map (<anonymous>)

    console.error
      Failed to load resource: the server responded with a status of 404 (Not Found) 
      Location: http://localhost:3333/build/index-89c177c8.js

      at t (node_modules/@stencil/core/testing/index.js:4191:67)
      at node_modules/@stencil/core/testing/index.js:4192:5
      at node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:248
          at Array.map (<anonymous>)
      at Object.emit (node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:232)
      at CDPPage.emit (node_modules/puppeteer-core/src/common/EventEmitter.ts:118:18)
      at CDPPage._CDPPage_onLogEntryAdded (node_modules/puppeteer-core/src/common/Page.ts:430:12)
      at node_modules/puppeteer-core/src/common/Page.ts:251:35

    console.error
      requestfailed http://localhost:3333/build/index-89c177c8.js

      at node_modules/@stencil/core/testing/index.js:4205:12
      at node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:248
          at Array.map (<anonymous>)
      at Object.emit (node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:232)
      at CDPPage.emit (node_modules/puppeteer-core/src/common/EventEmitter.ts:118:18)
      at node_modules/puppeteer-core/src/common/Page.ts:220:19
      at node_modules/puppeteer-core/lib/cjs/third_party/mitt/index.js:3:248
          at Array.map (<anonymous>)

  ● my-component › renders

    expected to have css class "hydrated"

       7 |     await page.setContent('<my-component></my-component>');
       8 |     const element = await page.find('my-component');
    >  9 |     expect(element).toHaveClass('hydrated');
         |                     ^
      10 |   });
      11 |
      12 |   it('renders changes to the name data', async () => {

      at Object.<anonymous> (src/components/my-component/my-component.e2e.ts:9:21)

  ● my-component › renders changes to the name data

    Evaluation failed: Error: shadow root does not exist for element: my-component

      at pptr:/__puppeteer_evaluation_script__:2:30
      at ExecutionContext._ExecutionContext_evaluate (node_modules/puppeteer-core/src/common/ExecutionContext.ts:325:13)
      at l (node_modules/@stencil/core/testing/index.js:640:14)
      at find (node_modules/@stencil/core/testing/index.js:636:33)
      at Object.<anonymous> (src/components/my-component/my-component.e2e.ts:17:21)

Test Suites: 1 failed, 2 passed, 3 total
Tests:       2 failed, 6 passed, 8 total
Snapshots:   0 total
Time:        2.105 s
Ran all test suites.

Code Reproduction URL

notyet

Additional Information

Maybe related to https://github.com/ionic-team/stencil/pull/4146 because I dont have any problems running both watchers at the same time in the past.

Ngôn ngữ chính
TypeScript
Star
13.2k
Fork
865
Merge trung bình
2 ngày 16 giờ
Pull request đã merge (30 ngày)
29

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của stenciljs/core

Tất cả issue của stenciljs/core

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.