bug: renaming a a component file whilst being watched causes an error

[johnjenkins]

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~ (happens in 2.17.0 but has been present for a long time)

Current Behavior

using the latest version of stencil, whilst within --watch mode, change any component file name (e.g. my-component.tsx to my-new-component.tsx) and stencil fails with an error:

[ ERROR ]  TypeError: Cannot read property 'fileName' of undefined at flattenDiagnosticMessageText
           (.../node_modules/@stencil/core/compiler/stencil.js:1559:45) at
           loadTypeScriptDiagnostic

Expected Behavior

not to fail :)

Steps to Reproduce

npm init stencil > select the component variant.
cd NEW_COMPONENT_DIR
npm i
npm start
rename src/components/my-component.tsx to my-new-component.tsx

Code Reproduction URL

just use npm init stencil

Additional Information

No response

[rwaskiewicz]

Thanks @johnjenkins! I was able to confirm this has been around since at least v2.7.0. Labelling this so that it gets ingested into the backlog

[linuxonrails]

Hi @johnjenkins!

I think it is a valid error and that it only warns you that something is wrong in the test file.

If you correct the path in src/components/my-component/my-component.spec.ts, the error disappears and the browser reloads without problems:

2c2
< import { MyComponent } from './my-component';
---
> import { MyComponent } from './my-new-component';

I think this issue could be closed or, perhaps, renamed to "Test files should be ignored in browser transpilation with npm start". But personally I prefer the build to fail if there is a test failure.

[rwaskiewicz]

hey @linuxonrails,

thanks for your input! however, even when no tests exist in a project, I am able to reproduce this issue. the root cause has to do with a race condition where the dev server isn't able to understand that the file has changed it's name

[alicewriteswrongs]

Just a quick update on this, I just opened a small PR (#3627) which fixes a bit of diagnostic handling code where we were accessing a property on a possibly-undefined value without checking.

After fixing that issue one thing I'm consistently running into is this upstream issue in TypeScript: microsoft/TypeScript#43838

[christian-bromann]

A fix for this has been released in Stencil v4.22.0 🎉