CLI tool doesn't restart app if HTML/CSS file was modified

[otaran]

Did you verify this is a real problem by searching Stack Overflow and the other open issues in this repo?

Yes, this works in version 2.5.x and is broken in 3.0.0.

Tell us about the problem

tns run ... will not restart the app if any HTML or CSS file was modified. It does restart the app if TS or JS file was modified. The output of tns run ios look like this:

Executing before-prepare hook from /Users/otaran/Developer/sandbox/test-html-css-sync/hooks/before-prepare/nativescript-dev-typescript.js
Preparing project...
Project successfully prepared (ios)
Transferring project files...
Successfully transferred item-detail.component.html.
Refreshing application...
Successfully synced application org.nativescript.testhtmlcsssync on device C6C627C7-F2F6-4FBC-9C52-1998C10EE2A6.

NativeScript debugger attached.

Which platform(s) does your issue occur on?

• Android
• iOS

Please provide the following version numbers that your issue occurs with:

$ tns --version
3.0.0
$ grep version node_modules/tns-core-modules/package.json
  "version": "3.0.0"
$ grep -A 5 tns-android package.json 
    "tns-android": {
      "version": "3.0.0"
    },
    "tns-ios": {
      "version": "3.0.0"
    }
$ grep nativescript- package.json 
    "nativescript-angular": "~3.0.0",
    "nativescript-theme-core": "~1.0.2",
    "nativescript-dev-typescript": "~0.4.0",

Please tell us how to recreate the issue in as much detail as possible.

1. Unpack and run
   test-html-css-sync.zip with tns run ios
2. Drill down to any row
3. Modify items.component.html or items.component.css
4. Watch how it syncs the file but does not restart the app (i.e. the app stays on the same page and changes are not applied)

Is there code involved? If so, please share the minimal amount of code needed to recreate the problem.

No.

[dtopuzov]

The problem is that CLI do not restart the app.
Can be reproduced with hello-world-ng and iOS Simulator.

[eksahin]

I think this is happening when routing.
eg:

export class HomeComponent implements OnInit {
    constructor(private router: RouterExtensions, private authService: AuthService) {
        if (authService.hasUser()) {
            this.router.navigate(['main-view'], {animated: false, clearHistory: true});
        } else {
            this.router.navigate(['authorization/login'], {animated: false, clearHistory: true});
        }
        
    }

    ngOnInit() {

    }
}

In this case it is not updating html view

[otaran]

@dtopuzov , the issue is still reproducible for CSS files, but in a more subtle way: now tns run seems to apply CSS styles without restarting the app, so if you are on the very first page of your app, you will see your CSS applied, but if you are on some other page and change CSS file to trigger refresh, app gets into inconsistent state (for example it loses Back navigation button).

[dtopuzov]

Hi @otaran thanks for the report!
I think we can easily fix it if we also restart on css changes, but I'm not sure we can provide better fix at the moment.

Engineering team will consider possible options on Monday and we will update the issue.

[dtopuzov]

Hi @otaran It sounds like another case -> When you navigate to some page and then you sync we do not preserve application state.

If we do not restart the app you are in current situation -> back navigation do not work.
If we restart the app it will start from home page (not the one you navigated to).

Both situations are not ideal, so just logged separate issue for the problem, see #2814

[otaran]

@dtopuzov I don't mind if tns will restart the app on CSS change, in fact that's what I expect it to do. I described this use case just to demonstrate that tns 3.0.1 does NOT restart the app when CSS changes, leaving it in an inconsistent state. What I am trying to say is that the fix in 3.0.1 did NOT fix the issue completely - it did fix HTML change use case, but it didn't fix the CSS change use case.

[vultix]

Is there any update on this? The same issue @otaran is having is really slowing UI development down.