Skip to content

Live reloading not working #15613

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
tezine opened this issue Sep 15, 2018 · 28 comments
Closed

Live reloading not working #15613

tezine opened this issue Sep 15, 2018 · 28 comments
Labels
area-blazor Includes: Blazor, Razor Components

Comments

@tezine
Copy link

tezine commented Sep 15, 2018

Hi,
Live reloading is not working on version 0.5.1.
I'm using dotnet sdk 2.1.300 under Windows 64.
Whenever I change a html content, it's not updated in the browser. I tested using Chrome, pressing F5, cache disabled and debug mode.
Is this working anyhow?
I also tested using dotnet blazor serve without success.

@lohithgn
Copy link

Just checking to make sure - can you run the app in visual studio by using the combination "Ctrl+F5" … then make a change in html/code , save it , go back to browser and refresh again

@tezine
Copy link
Author

tezine commented Sep 15, 2018

Hi @lohithgn , same problem. Ctrl+F5 didn't solve it.

@davidbmasterson
Copy link

did you wait after your change as I have found that sometimes it takes a long time to recompile the files and have had to wait over 30 seconds for the change to be reflected in the browser.

@danroth27
Copy link
Member

@tezine Any errors showing up in the browser console? Also, when you manually build the app do you get any build failures?

@tezine
Copy link
Author

tezine commented Sep 17, 2018

Hi @danroth27 , no errors displayed.
I just found out that when I add the line below in the project, it works when I press F5:

<Watch Include="**\*.cshtml"/>

But I have to execute the project using the command line:

dotnet watch run

It would be nice to have auto reload and without dotnet watch run

@danroth27
Copy link
Member

Strange! Auto rebuild should work out of the box with Blazor 0.5.1. What version of VS do you have?

I assume this is with the default Blazor project template?

Can you confirm that these are the exact repro steps?:

  1. Create a default Blazor project in VS
  2. Ctrl-f5
  3. Edit some one of the cshtml files and save
  4. Refresh the browser

Expected: You see the changes.
Actual: You don't see the changes

Is that correct?

@tezine
Copy link
Author

tezine commented Sep 17, 2018

Hi @danroth27 ,
It's just the default blazor template with Home, Counter and Fetch Table pages.
I'm using Visual Studio 15.9.0 Preview 2.0.
Using IIS Express or without it give me the same issue.

@danroth27
Copy link
Member

Unfortunately I'm not able to reproduce this. I have VS 2017 15.8 Preview 2 with Blazor 0.5.1. I have .NET Core SDK 2.1.302, but I can't imagine that would make a difference.

@SteveSandersonMS Is there a way to track down the cause of an autobuild failure?

@SteveSandersonMS
Copy link
Member

From the phrasing (e.g., "auto reload"), it sounds like @tezine wants/expects the browser to refresh automatically when saving changes to source files. That's not what we do currently. We might do in the future but the implementation isn't trivial.

As @danroth27 was trying to clarify with his suggested steps, it's necessary to F5 in the browser after saving changes to source files. This should trigger an auto-recompilation as part of the page reload. If that's what you're trying and it doesn't show your changes on reload, the main question is which project template are you using?

  • The standalone template
  • The "hosted in ASP.NET Core template"

If you try the other one of these templates, does auto-rebuild work for you there?

Are there any compile errors in your app? If there are, compilation will fail so the browser will continue to get the output of the last successful compilation.

@danroth27 We log any exceptions in our VS extension to the VS "output" window. Any runtime exceptions would be logged to the process output (e.g., command line if running directly on Kestrel, or "ASP.NET Core Output" tab if running on IIS Express).

@tezine
Copy link
Author

tezine commented Sep 18, 2018

Hi @SteveSandersonMS and @danroth27 , to clarify:
I'm using the standalone blazor template. Follow the files attached. I had to add the <Watch Include="**\*.cshtml"/> and use dotnet watch run. That's the only way I found to show the changes after Ctrl+F5.

If I simply execute the project from Visual Studio using IIS or dotnet run, the changes are not reloaded after Ctrl+F5. Whenever I press Ctrl+F5, it displays the old content.
There's no compile errors or runtime errors displayed.
I simply tried to change the text of <h1>Counter </h1> inside Counter.cshtml.

TestBlazor.zip

@danroth27
Copy link
Member

I tried out the attached project. I downloaded it to my machine, opened it in VS, commented out the <Watch …/> element, and hit Ctrl-F5 to run it outside of the debugger. The app ran fine. I then edited Counter.cshtml, saved it, and refreshed the browser. The changes showed up fine.

I do see the behavior you describe if I run the app in the debugger in VS (F5 instead of Ctrl-F5). This is expected, as we don't currently support attaching the debugger to client-side Blazor from VS. To use autobuild you need to run without the debugger.

I'm out of suggestions at this point. Maybe try reinstalling the Blazor VSIX?

@martasp
Copy link

martasp commented Sep 26, 2018

Hi, you can use auto rebuilt with automatic page refresh. No need to push Ctrl-F5. I build a demo how to setup : https://github.com/martasp/BlazorLiveReload

@danroth27
Copy link
Member

Closing as there is no further action on our side.

@sven5
Copy link

sven5 commented Oct 9, 2018

It seems that live reloading is broken with 0.6.0
I tried with a new project:

dotnet new -i Microsoft.AspNetCore.Blazor.Templates
dotnet new blazorserverside -o HelloWorld
cd HelloWorld\HelloWorld.Server
dotnet run

SDK version 2.1.403

Modify a file, e.g. Counter.cshtml and hit F5 in the browser does not show the changes.
The same problem when running Visual Studio.
It seems there is an issue with version 0.6.0 - I updated from 0.5.1 yesterday and last week it had been working.

@danroth27
Copy link
Member

@sven5 Nothing watches for file changes when you just do dotnet run. Instead you can use dotnet watch run after adding <Watch Include="**\*.cshtml"/> as an item group in your project file.

The auto build support should work in VS though. What version of VS are you using?

@sven5
Copy link

sven5 commented Oct 10, 2018

@danroth27
I added the Watch Include and ran dotnet watch run but the file modifications are not shown. The output doesn't show any action after saving the modified file.

I'm using VS 15.8.6.

@stevenkuhn
Copy link

@danroth27 I am experiencing the same thing. VS2017 15.8.6. ASP.NET Core Blazor Language Services 15.7.20181002.2. SDK version 2.1.403. I created the project via the templates in VS2017; both Blazor (Server-side in ASP.NET Core) and Blazor (ASP.NET Core hosted).

The only way I have gotten it to work is to run the Server project under IIS Express. If I set it to run under the console, then refreshing does not reflect any new changes. I have to restart the console for it to take effect. Attempting to put <Watch Include="**\*.cshtml" /> in both the Client/App projects and the Server project and then running dotnet watch run does not work either.

@danroth27
Copy link
Member

danroth27 commented Oct 10, 2018

OK, let's see if we can get to the bottom of this. I haven't been able to repro this yet, so I'll need your help.

A couple of things to clarify:

  • We don't support live reload yet, where the browser automatically updates as you make changes. What we do support is auto rebuild where we rebuild and restart the app as you make changes. With auto rebuild you still need to manually refresh the browser to see the changes and you may need to wait a bit first for the build to finish and the app to restart.
  • When running from the command-line you have to use dotnet watch run to get auto rebuild functionality after adding <Watch Include="**\*.cshtml" /> to your project file. If this isn't working for you, then could you please share the project file, the SDK version you are using, your OS, and the console output after running the app and making a change?
  • We don't support running Blazor projects under the debugger at all, so in VS you need to Ctrl-F5 instead of F5 to make sure you are not running under the debugger.
  • From within VS when running without the debugger and using the Blazor project template you should get auto rebuild support both when running behind IIS Express and when running the project directly. When using the ASP.NET Core Hosted project template auto rebuild is only supported when running the Server project behind IIS Express and you are not running under the debugger.

@danroth27
Copy link
Member

One more clarification: when using the ASP.NET Core hosted Blazor template or the server-side template, then the Razor files you want to watch are typically in a separate project, so you need to use a broader include: <Watch Include="..\**\*.cshtml" />

@stevenkuhn
Copy link

  • We don't support live reload yet, where the browser automatically updates as you make changes. What we do support is auto rebuild where we rebuild and restart the app as you make changes. With auto rebuild you still need to manually refresh the browser to see the changes and you may need to wait a bit first for the build to finish and the app to restart.

I completely understand. I am having trouble with the manual refresh process. If I make a change in a .cshtml file, save it, and manually refresh the browser, there are certain cases where my changes are not reflected.

One more clarification: when using the ASP.NET Core hosted Blazor template or the server-side template, then the Razor files you want to watch are typically in a separate project, so you need to use a broader include:

Bingo! That is what I was missing. I was creating projects using both the ASP.NET Core hosted Blazor template and the server-side template. I was also trying to use <Watch Include="**\*.cshtml" />. Switching that to <Watch Include="..\**\*.cshtml" /> and running dotnet watch run on the Server project does indeed work for me.

  • From within VS when running without the debugger and using the Blazor project template you should get auto rebuild support both when running behind IIS Express and when running the project directly. When using the ASP.NET Core Hosted project template auto rebuild is only supported when running the Server project behind IIS Express.

Thanks, that explains why auto rebuild does not work with the ASP.NET Core Hosted project template when running the Server project directly from VS itself. Does that also explain why auto rebuild does not work with the server-side template when running the Server project directly? Does the server-side template also need to run behind IIS Express (or with dotnet watch run)?

  • We don't support running under the debugger at all, so in VS you need to Ctrl-F5 instead of F5 to make sure you are not running under the debugger.

It does support running under the debugger behind IIS Express with the server-side template, correct? Assuming that is the case, should auto rebuild work? That is the only other scenario I encountered where it did not. I can see that being problematic, but I wanted to double-check.

Thank you very much for your help with this!

@danroth27
Copy link
Member

It does support running under the debugger behind IIS Express with the server-side template, correct?

Yes, good point. For the Blazor templates that include ASP.NET Core server projects you can run the ASP.NET Core projects the debugger - it's the Blazor projects that you shouldn't run under the debugger. However, auto rebuild is disabled when you run the ASP.NET Core server projects under the debugger. I've tried to clarify this above.

@sven5
Copy link

sven5 commented Oct 11, 2018

@danroth27
I can confirm that it works now in the console with the settings above.

However, I've had a problem that auto build didn't work in my Visual Studio. I was able to found the root cause:
In the server project, I needed to change the ASPNETCORE_ENVIRONMENT from Development to LocalDevelopment because of different appsettings (i.e. Connection Strings) for several environments. This breaks the auto build feature of Visual Studio.

It seems auto-build only works when the Environment is set to Development.

@danroth27
Copy link
Member

In the server project, I needed to change the ASPNETCORE_ENVIRONMENT from Development to LocalDevelopment because of different appsettings (i.e. Connection Strings) for several environments. This breaks the auto build feature of Visual Studio.

That is strange. I'm seeing this as well. I'm following up with the web tools folks to try to understand what's going on here.

@kswoll
Copy link

kswoll commented Oct 17, 2018

I tried out the attached project. I downloaded it to my machine, opened it in VS, commented out the <Watch …/> element, and hit Ctrl-F5 to run it outside of the debugger. The app ran fine. I then edited Counter.cshtml, saved it, and refreshed the browser. The changes showed up fine.

I do see the behavior you describe if I run the app in the debugger in VS (F5 instead of Ctrl-F5). This is expected, as we don't currently support attaching the debugger to client-side Blazor from VS. To use autobuild you need to run without the debugger.

I probably totally spaced on this F5 vs. Ctrl-F5 difference, but now understanding this, the live reloading is working as well as I'd want (for now) :) I wonder if this nuance could perhaps be better emphasized in the documentation?

@danroth27
Copy link
Member

danroth27 commented Oct 17, 2018

@kswoll I'm glad to hear things are now working for you! We do mention this in the docs, but we're open to suggestions on how to make it clearer:

image

@kswoll
Copy link

kswoll commented Oct 18, 2018

@danroth27 perhaps I'm missing something: running with the debugger has totally been working for me. Except it doesn't live-reload saves to the .cshtml files. It was that nuance that surprised me. Perhaps some clarification in that regard?

Btw, this was the thread that made me realize this: https://github.com/aspnet/Blazor/issues/1428#issuecomment-422459641

@sven5
Copy link

sven5 commented Oct 18, 2018

imho, debugging currently works only for server-side Blazor Apps.

@RFDominguez
Copy link

RFDominguez commented Jan 25, 2019

After reading this thread carefully and getting nowhere here's what I had to do.
We have our solution in TFS and at one point the whole thing was checked-in. It turns out the Program.cs (Server Project) needs to be writable (remove the read-only file attribute) - Not sure why but in my case this was the root cause of the problem since the build was always 'failing'.

@mkArtakMSFT mkArtakMSFT transferred this issue from dotnet/blazor Oct 27, 2019
@mkArtakMSFT mkArtakMSFT added area-blazor Includes: Blazor, Razor Components and removed area-blazor Includes: Blazor, Razor Components labels Oct 27, 2019
@ghost ghost locked as resolved and limited conversation to collaborators Dec 3, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area-blazor Includes: Blazor, Razor Components
Projects
None yet
Development

No branches or pull requests