"ng serve" Not Reflecting Changes Automatically in Angular 17

[TanerSaydam]

Which @angular/* package(s) are the source of the bug?

compiler, Don't known / other

Is this a regression?

Yes

Description

Hello Angular Team,

I am encountering an issue with Angular 17 where the automatic re-rendering of changes upon saving files does not consistently occur when using ng serve. The application neither updates the UI nor throws any errors, and it requires a restart to reflect the changes. This issue is intermittent but significantly hampers the development process.

Steps to Reproduce:

1. Run the application using ng serve.
2. Make changes to a component or service.
3. Save the file.

Expected Behavior:
The application should automatically reflect the changes in the browser without needing to manually restart the server.

Actual Behavior:
Sometimes, the application does not update the UI or show any error messages after saving changes. The only workaround is to stop and restart ng serve.

Environment:

• Angular version: 17.x.x
• Browser: [e.g., Chrome, Firefox]
• Operating System: [e.g., Windows, macOS]

Additional Information:
This issue does not occur every time but is frequent enough to disrupt the normal workflow. I have not experienced this in previous versions of Angular. Any insights or solutions to this problem would be greatly appreciated.

Thank you for your time and assistance.

Best regards,
Taner Saydam

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

"dependencies": {
    "@angular/animations": "^17.0.0",
    "@angular/common": "^17.0.0",
    "@angular/compiler": "^17.0.0",
    "@angular/core": "^17.0.0",
    "@angular/forms": "^17.0.0",
    "@angular/platform-browser": "^17.0.0",
    "@angular/platform-browser-dynamic": "^17.0.0",
    "@angular/router": "^17.0.0",
    "rxjs": "~7.8.0",
    "tr-currency": "^1.0.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.14.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^17.0.0",
    "@angular/cli": "^17.0.0",
    "@angular/compiler-cli": "^17.0.0",
    "@types/jasmine": "~5.1.0",
    "jasmine-core": "~5.1.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "typescript": "~5.2.2"
  }

Anything else?

No response

[icarobteles]

I identified this same problem!

[TanerSaydam]

I identified this same problem!

What did you do as a solution?

[icarobteles]

For now I'm using it anyway, unfortunately. The current execution of the command has ended and I run it again.

[TanerSaydam]

For now I'm using it anyway, unfortunately. The current execution of the command has ended and I run it again.

Me too. Bu it's really annoying

[Dawidfigat]

Which @angular/* package(s) are the source of the bug?

compiler, Don't known / other

Is this a regression?

Yes

Description

Hello Angular Team,

I am encountering an issue with Angular 17 where the automatic re-rendering of changes upon saving files does not consistently occur when using ng serve. The application neither updates the UI nor throws any errors, and it requires a restart to reflect the changes. This issue is intermittent but significantly hampers the development process.

Steps to Reproduce:

1. Run the application using ng serve.
2. Make changes to a component or service.
3. Save the file.

Expected Behavior:
The application should automatically reflect the changes in the browser without needing to manually restart the server.

Actual Behavior:
Sometimes, the application does not update the UI or show any error messages after saving changes. The only workaround is to stop and restart ng serve.

Environment:

• Angular version: 17.x.x
• Browser: [e.g., Chrome, Firefox]
• Operating System: [e.g., Windows, macOS]

Additional Information:
This issue does not occur every time but is frequent enough to disrupt the normal workflow. I have not experienced this in previous versions of Angular. Any insights or solutions to this problem would be greatly appreciated.

Thank you for your time and assistance.

Best regards,
Taner Saydam

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

"dependencies": {
    "@angular/animations": "^17.0.0",
    "@angular/common": "^17.0.0",
    "@angular/compiler": "^17.0.0",
    "@angular/core": "^17.0.0",
    "@angular/forms": "^17.0.0",
    "@angular/platform-browser": "^17.0.0",
    "@angular/platform-browser-dynamic": "^17.0.0",
    "@angular/router": "^17.0.0",
    "rxjs": "~7.8.0",
    "tr-currency": "^1.0.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.14.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^17.0.0",
    "@angular/cli": "^17.0.0",
    "@angular/compiler-cli": "^17.0.0",
    "@types/jasmine": "~5.1.0",
    "jasmine-core": "~5.1.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "typescript": "~5.2.2"
  }

Anything else?

No response

[jnizet]

Probably a duplicate of #26325. That has been fixed in version 17.0.1 of the CLI. Make sure you update (and specify the actual version you're using in future issues)

[Dawidfigat]

Probably a duplicate of #26325. That has been fixed in version 17.0.1 of the CLI. Make sure you update (and specify the actual version you're using in future issues)

[icarobteles]

@jnizet I'm already using version 17.0.1 and this problem persists.

[TanerSaydam]

@jnizet I'm already using version 17.0.1 and this problem persists.

Me too 🤕

[JoostK]

This is likely either #26334 or #26390. The former appears to have been addressed in the upcoming 17.0.2 release, expected early next week.

[icarobteles]

@JoostK Thanks for the information!

[TanerSaydam]

This is likely either #26334 or #26390. The former appears to have been addressed in the upcoming 17.0.2 release, expected early next week.

Thank you ☺️🙏

[alanzheng88]

I'm experiencing a similar issue. Prior to the upgrade to v17, I would see /ng-cli-ws websocket being called in the request which would retrigger the livereload. Recently this call is no longer made when loading any pages using a custom domain that is not localhost for newer projects created and served via the angular-cli . I have not upgraded my @angular/cli 17.0.0 but only upgraded the other @angular packages to v17.0.3. confirmed it's caused by the missing runtime.js file when transitioning from webpack to vite/esbuild. when i change the builder application/browser-esbuild back to browser, the runtime.js shows up again during page load and livereload works fine.

would this be considered a regression? I may need to continue using the browser builder until this is fixed as having this livereload not working significantly hampers the development process