I am creating an Excel web addin using Visual studio, but when I am making any changes (adding any button or hiding an element) to my .html or .js they are not reflecting in excel or DOM Explorer files. I tried clearing cache, browser history. Nothing seems to be working out!
Please suggest!
Related
I have coded an html and css website in VS Code. Viewed the project in a web browser (Chrome), looks good. I am on a team and we have created a project using Razor Pages in Visual Studio 2019. I copied my VS Code to Visual Studio 2019 to the appropriate page, in this case WelcomePage.cshtml. When I went to view my Visual Studio 2019 page in a browser (Chrome), it didn't look the same. The styling was off. I have ensured the css and images are pointed to the correct folder. Ensured all my tags are in order. I also checked to see if the Layout.cshtml file and bootstrap.css files were interfering and it's not. I am still experiencing issues with how the page looks in VS Code when I view it in browser compared to what it looks like in Visual Studio 2019. I appreciate any advice and guidance you can share with me. Thank you.
I commented out the Layout.cshtml file and bootstrap.css file. Created a new project where I deleted the Layout.cshtml file, the bootstrap files and js files. Still had the same issue.
When I am using Visual Studio code, I am coding in HTML and CSS.
When I open the Browser Preview button, it shows the changes I am making and some things appear as I want it to be.
However, when I download the saved file as an index.html file, the look does not appear the same as the Browser Preview.
What should I do?
File extension must be .html
Then, first of all make sure that all the time you are saving your file using ctrl+s. You can do this automatically by changing in setting.
You can reinstall any browser preview extension like this one.
Restart the VScode and check again whether it's working or not.
Also, You can setup your vs code again.
I have a very basic html file that look like this:
then I opened it with Live Preview extension:
then I clicked the hamburger menu and opened the 'Devtools Pane':
The issue is why my elements section looks complicated like this:
however, if I open the html file with browser and open developer tools everything is normal:
I tried uninstall and install Live preview extension but this doesn't solve the problem.
Is there a solution to this?
thanks in advance.
The Dev Tools Pane looks like this because that is Visual Studio Codes developer tool pane. You are seeing all of the elements and scripts that Visual Studio Code uses plus your document. You will get the same results if you open the developer tools in Visual Studio Code via the command palette. This isn't something specific to this extension.
This answer provides some insight on why this is, but basically it's because Visual Studio Code is built like a desktop application but with web-based (like?) technologies such as HTML and Javascript.
If you are looking for specific elements in your document, I recommend you use the element picker icon in the top left of the dev tools to inspect it, which will automatically navigate the HTML code in the developer pane to the element you wish to inspect. Or, open the file in a browser separately as you have.
On a web application we manage, there is an issue only present in Edge Chromium. There is a button to download a file: an Excel macro file. When clicking the button in Edge, the file is opened in Excel. However, the login page of the webapplication appears in the XLSM file in Excel, instead of opening the xlsm file itself. In Google Chrome, the file is not opened, but downloaded first and when clicking open, we get the wanted behaviour.
This is the code behind the button (confidential data replaced by XXX):
<input type="submit" onclick="redirectToNavUrlGA('https://XXX.xlsm','XXX','XXX','XXXXXX'); return false;" value="XXXXXX">
When calling the URL directly in a cache cleared-Edge browser, the login page appears in browser and the file is downloaded correctly. Only when you are already logged in the to application, the issue is present. But users will always be logged in already, so not a good workaround.
The URL is using reverse proxy to point to a Sharepoint 2010 site to download the file. I've read some issues with Edge Chromium and SP 2010, is this maybe the cause of the issue?
Do you have any other ideas that could be causing this issue?
Thanks in advance.
According to your description, I think the main problem is the compatibility issue between SharePoint 2010 and Edge. The Edge browser is not included in SharePoint 2010 browser support, and even Edge IE 11 mode is not supported. So I suggest that you can use a supported browser.
Visual Studio 2013 have feature called browser link but i can't make it automatically refresh browser when i save html file. And if i need to use hotkey of browser link then what is benefit of it? Because i can press F5 in browser instead press hotkey of browser link. But if it refresh automatically when html file is modified then it will be very handy.
So my question is, is it possible to automate browser link when html file is modified?
I don't think it is possible by default.
And if i need to use hotkey of browser link then what is benefit of it?
Browser Link is a new feature that creates a communication channel between the development environment and one or more web browsers. You can use Browser Link to refresh your web application in several browsers at once, which is useful for cross-browser testing.
That is refreshing several browsers at once seems to be the main functionality of this feature.
To reload a page every time you make a change to it try one of these:
Tincr - For Chrome.
Auto Reload - For firefox
I have tried many ways to get browser refresh to work with VS 2013, other IDEs and text editors. In my search I have found the one (in my option) that works best is live-server.
Very easy to install with node nmp
https://www.npmjs.com/package/live-server
npm install -g live-server
Here it is on GitHub https://github.com/tapio/live-server