bug: Dev server not rebuilding when files change

[Slevinski]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Stencil Version

2.20.2 and 3.0.0

Current Behavior

The stencil development server isn't rebuilding after files in src/ are changed.
stencil build --dev --watch --serve

This was working in version 2.20.0. I started the development server using the above command. I updated file src/component/fsw-sequence/fsw-sequence.tsx and the server would rebuild. After upgrading to v3.0.0 today, the development server stopped rebuilding. I downgraded to v2.20.2 and it still wouldn't rebuild. Downgrading to v2.20.0 fixed the issue and the development server rebuilds as expected.

Expected Behavior

The development server should rebuild the project when files are changed in src/.

System Info

Windows 11 machine with the linux subsystem as Ubuntu 20.04.  npm version 8.19.2.  node version 19.0.0.

Steps to Reproduce

1. Clone stencil-component-starter
2. npm install
3. npm start
4. Update src/components/my-component.tsx
5. Notice that the development server doesn't update

Downgrade stencil/core to v2.20.2 and the problem still exists.

Downgrade stencil/core to v2.20.0 and the problem does not exist.

Code Reproduction URL

https://github.com/ionic-team/stencil-component-starter

Additional Information

No response

[alicewriteswrongs]

Hi @Slevinski, thanks for filing this issue and sorry that you've been having trouble with watch mode.

I just tried out a quick npm init stencil and even though it pulled in stencil v3 I was unable to reproduce the issue right away. I'm on macOS however, so that could be part of it.

One thing to note is that we only officially support up to node v16 at present. I don't think that would be likely to fix the problem, but there's some chance.

If you're able to reproduce this reliably on your computer, is there any chance you'd be able to run a git bisect to try to figure out what the problematic commit is?

After cloning the Stencil repository you would do something like this:

git bisect start # get started
git checkout v2.22.2
git bisect bad
git checkout v2.20.0
git bisect good

then to test each commit you would do:

npm run clean
npm ci
npm run build
npm pack

then you could install the resulting .tgz file into your stencil component starter and test it out:

npm i ../path/to/stencil-version.tgz

Then you'd report on that commit to Git by doing (back in the Stencil repo):

git bisect bad # if the issue still happens

or

git bisect good # if the issue isn't happening on that commit

If that's too much no worries! I can try to figure out a windows VM to see if I can reproduce the issue.

[Slevinski]

Thanks for the triage and the instructions. I can try this weekend.

[ingomc]

Perharps you can start your dev-server with the --verbose flag to see more: stencil build --dev --watch --serve --verbose

I also have a problem with the watch mode in my project, i didn't have the time to check this against stencil-component-starter... but seems to be related.

No Problem with 2.20.0, but since 2.21.0 i have these errors, just want to add additional info about what could be a problem.

[ ERROR ]  Rollup: Plugin Error
           TypeError [PLUGIN_ERROR]: The "interval" argument must be of type number. Received undefined at
           StatWatcher.<computed> (node:internal/fs/watchers:116:3) at Object.watchFile (node:fs:2329:39) at
           pollingWatchFileWorker
           (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:128598) at
           /Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:125936 at d
           (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:118297) at B
           (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:125906) at I
           (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:123551) at v
           (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:127034) at
           /Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:126157 at
           /Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:127175 (plugin:
           extTransformsPlugin, transform)

[47:11.1]  close watch  MEM: 55.4MB
node:internal/validators:104
      throw new ERR_INVALID_ARG_TYPE(name, 'number', value);
      ^

TypeError [ERR_INVALID_ARG_TYPE]: The "interval" argument must be of type number. Received undefined
    at StatWatcher.<computed> (node:internal/fs/watchers:116:3)
    at Object.watchFile (node:fs:2329:39)
    at pollingWatchFileWorker (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:128598)
    at /Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:125936
    at d (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:118297)
    at B (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:125906)
    at I (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:123551)
    at v (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:127034)
    at d (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:126353)
    at FSWatcher.f (/Users/andre/Documents/dev/web-lib-style/node_modules/@stencil/core/compiler/stencil.js:57:126823) {
  code: 'ERR_INVALID_ARG_TYPE'

[Slevinski]

After downgrading node to v16, I was able to build stencil/core.

Unfortunately, when I built from source, the v2.20.0 dev server had the rebuild problem as well. I would update the code and the dev server wouldn't rebuild automatically.

git checkout v2.20.0
df2c97ebcc6bbe5d105c7781663cc13fbc09a39c

I installed v2.20.0 from npm and the dev server worked properly by rebuilding when the code changed. I'll take another look later just to make sure I'm not missing anything...

[rwaskiewicz]

Hey folks 👋

I have two dev builds of Stencil that may fix this issue, one for Stencil v2 users, and one for Stencil v3 users. If anyone running into this particular issue could install either version (if you're on Stencil v2.X, use the first one. if you're on Stencil v3.X, use the second one) and report back as to whether that fixes the issue at hand, that be much appreciated.

• npm i @stencil/core@2.22.2-dev.1678485833.33567aa OR
• npm i @stencil/core@3.1.0-dev.1678485791.d8115c8

Thanks!

[Slevinski]

Excellent! The v3 works on my windows 11 with the Linux subsystem. The dev server rebuilds as expected. Thanks.

[ingomc]

Also now working with our projects, very nice ✅

[rwaskiewicz]

The PR associated with this issue has landed and is included in today's v2.22.3 release and v3.2.0 release. As a result, I'm going to close this issue. Should this issue reappear, please feel free to open a new issue. Thanks again!