Live Server does not open in Chrome on Windows 11 and WSL2 - visual-studio-code

I am working in WSL2 on Windows 11 trying to run an index.js file with Live Server. Whenever I open Live Server it seems that I can only do so when I use Microsoft Edge. This seems to add another layer of problems because the JavaScript does not seem to be working as I would expect. For example, if I click a button element I don't see any animations to signify a "click".
I have checked that "liveServer.settings.CustomBrowser": "chrome" is indeed reflectin Chrome in the VS Code settings, but when this is the case there are no windows that pop up at all. The only thing that I see trigger is a notification that tells me that the server is active on Port 5000, just no window popping up to demonstrate that. Ideally I would like to try and open Live Server with Chrome, but if this isn't possible in Windows 11 then is there a way to make JavaScript behave in Microsoft Edge?

I've the same configuration and the same issue. I've raised the issue #2445 in Github.
A workaround solution is to call directly your chrome program installed under windows to your liveserver setting.
check that chrome is well installed on W10 or W11. You can test it by opening a command line and running "start chrome", then chrome browser must open.
look for chrome' installed directory. You can use this command to find it: sudo find /mnt/c/ -type f -iname chrome.exe 2>&1 | grep -v "Permission denied". For me this it's here:mnt/c/Program Files/Google/Chrome/Application.chrome.exe.
Now change liveserver setting on your settings.json file:
{
"liveServer.settings.AdvanceCustomBrowserCmdLine": "/mnt/c/Program Files/Google/Chrome/Application/chrome.exe --remote-debugging-port=9222",
}
Now chrome should start when you run liverserver.
Hope this help

Related

Error loading webview: Error: Could not register service workers: TypeError: Failed to register a ServiceWorker for scope

When I update my VSCode to v1.56.2 and open webview, I get these messages:
Error loading webview: Error: Could not register service workers:
TypeError: Failed to register a ServiceWorker for scope
('vscode-webview://867f875b-c5a3-4504-8de2-2e8614bdc0f8/') with script
('vscode-webview://867f875b-c5a3-4504-8de2-2e8614bdc0f8/service-worker.js?platform=electron&id=867f875b-c5a3-4504-8de2-2e8614bdc0f8&vscode-resource-origin=https%3A%2F%2F867f875b-c5a3-4504-8de2-2e8614bdc0f8.vscode-webview-test.com'):
ServiceWorker cannot be started.
How can I solve this issue?
If you are using Ubuntu, there is probably another (maybe hidden) vscode process, which is causing the problem.
Close the vs code first and in terminal try: killall code.
In Windows, you can simply fix this error by clearing the cache for VSCode. Please follow the steps below:
Close VSCode and also kill any background processes running in the task manager.
Go to the file explorer and to the path C:\Users\<user_name>\AppData\Roaming\Code and clear the contents of the folders Cache, CachedData, CachedExtensions, CachedExtensionVSIXs (if this folder exists) and Code Cache.
Open VSCode and you are good to go.
I encountered this issue and am not a Windows user, so this is my resolution:
I found that there was an instance of VS Code open that was erroneously not shown on my dock. I closed this instance and opened a new instance. The problem was gone.
I think the issue happened because I had a VS Code instance open, allowed a software update to run in the background, postponed the restart, opened a new and updated VS Code instance, and the old instance remained open causing conflicts.
OS: Ubuntu 20.04.2 LTS
#tritemio on GitHub has a great answer:
https://github.com/microsoft/vscode/issues/125993#issuecomment-912439561
in short, delete cache folder:
rm -rf ~/.config/Code/Cache
This is a known bug in VS Code 1.56. It happens for some Windows users when running VS Code as an administrator
As a workaround, you can try launching VS Code with the --no-sandbox command line flag:
$ code --no-sandbox
#tritemio, thanks for sharing.
This also seemed to solve my issues on Windows for "Extensions - Details View", "VS Code Release Notes View", "Gitlab integrated Interactive Rebase Editor", etc.
I followed your suggestion and deleted the following folders;
%appdata%\Code - Insiders\Cache
%appdata%\Code - Insiders\Code Cache
On *nix systems, first close VS Code app then run pgrep -f '/Applications/Visual Studio Code.app' | xargs kill to clean up vscode's processes. Reopen vscode and the issue will be gone.
If on macOS, you can run the above command verbatim. If you're not on macOS or installed vscode on a different location, you need to change the argument passed to pgrep. You can run ps auxww | command grep -i --color code to find the path of vscode's running processes.
Happened to me when started code in windows cmd. Closed vs code and opened it from my taskbar shortcut instead, and the error was gone
The simplest solution for this problem in any version of Linux is simply to close other instances of VS code and use only one instance of VS code.
OS: Linux 20.04.3 LTS
I've also encountered the same "Error loading web view" Error.
I've solved this issue by moving "vscode.app" into "Application folder" instead of "Download folder" on macOS.
I'll describe my "symptom" here.
OS: macOS 12.0.1
Installed 2 versions of vscode somehow, 1 under "Application folder", another under "download folder"
Run both vscode at the same time, the "download folder" version has no error display plugin pages, the "Application folder" version has the "Error loading webview" error
Checked and see 2 vscode instances running in the background
What I tried to solve this issue:
Tried to kill "download folder" instance, and the error remains for "application folder" instance
Moved "download folder" to "application folder" and both vscode works correctly on plugin page!
What I suspect on what the problem is?
Maybe these 2 vscode are sharing the same resource(could be some shared file), however they have different permissions since one is under application folder and another is under download folder.
This answer applies if using VSCode in GitHub Codespaces in Firefox or Brave browsers. I had to disable "Enhanced Tracking Protection" for the site, and that is all. To do so, click on the shield icon which is to the left of the displayed web address.
If anyone is using Brave, please turn off the brave shields as well.
For Mac/Apple computer Monteray version the following steps worked for me:
Delete VSCode from downloads folder.
Turn off VSCode
Open Activity Monitor and delete VSCode "Code" process.
Try closing all the process cmd+qof vscode and reopen vscode and everything should work well.
I have just restarted VS code and it worked for me. OS was Windows 10.

Chrome remote connection connects but then drops out

I am really struggling to get Google Chrome Remote Debugging to work! I have the phone setup and confirmed:
Then below are what I see in chrome://inspect/#devices and also F12 (both open at the same time);
It flashes with the "Connected" for about 3 seconds, and then goes to:
Offline
ZX1G324RSV Pending authentication: please accept debugging session on the device.
It's driving me nuts, as it should be simple to do, but it just doesn't want to play ball :/ Do I need to do anything special? I've used it before on this PC and although I had some fun and games with it the first time around, it worked after that.
There seems to be a ton of posts/articles about how to fix it, but none of them are working for me. https://bugs.chromium.org/p/chromium/issues/detail?id=450492 for example.
Download Android SDK here ("SDK Tools Only" section) and unzip the content.
Run SDK Manager.exe and install Android SDK platform tools
Open up the Command prompt (simply by pressing the windows button and type in cmd.exe)
Enter the path with ex: cd c:/downloads/sdk/platform-tools
Open ADB by typing in adb.exe
Run the following command by typing it and pressing enter: adb devices
Check if you get the prompt on your device, if you still can't see your phone in Inspect Devices run the following commands one by one (excluding the ") "adb kill-server" "adb start-server" "adb devices"
Here are the things that you can try:
Try different USB cable(s)
Try different USB ports on your machine(for some people using 2.0 port worked out)
Try the same process, with unchecked 'Discover USB Devices' in chrome://inspect (then Chrome will connect through the ADB server, not directly) ==> This solution worked in my scenario.

When launching google apps from command line , don't want to open google chrome browser

When I launch google apps[which is developed by myself] from command line, for example:
chrome.exe --load-and-launch-app="C:\Users\KyawKhaing\Desktop\chrome\Chrome App\Example2"
After I run this, I see Google Chrome Browser open first follow by my google chrome apps launch. I don't want to open google chrome browser when I launch a chrome app. Any one know the solution. Is it possible?
Use the --silent-launch argument.
chrome.exe --silent-launch --load-and-launch-app="C:\Users\KyawKhaing\Desktop\chrome\Chrome App\Example2"
As I was running automation scripts in java, i did notice that chrome did not open using command prompt.
Runtime.getRuntime().exec("C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe \"http:\\www.google.com\"");
From Windows 7, I fixed the problem with the following steps:
Go to the folder C:\Program Files (x86)\Google\Chrome\Application
Right-click on chrome.exe
Select Properties
Select the Compatibility TAB
Click on the "Change settings for all users" button
Make sure to put a Check Mark on "Run this program in compatibility mode for:" and
Select "Windows 7" from the drop down list.
Enjoy!
I don't think you can do it currently. It is a reasonable feature request! You can make feature requests at http://crbug.com/new
There is a bug already logged for this, see http://crbug.com/175381.
We are working on making app background pages keep the browser process alive; once this is done we can fix this bug. The problem currently is due to the way the process is kept alive - if we don't show the browser window the process exits between loading the app and the app opening a window.
I don't think you can do that. The browser is the environment of the app. Its like trying to run a windows app, without running windows. The app depends on the browser. You can't open the app without opening the browser first. Sorry. Hope this helps.

Is it possible to run Chrome as an external tool on Eclipse 3.6 on Mac OS X?

I'm trying to set up Chrome to run as an external tool in Eclipse on the Mac. I've entered the path to Chrome as the Location variable:
"/Applications/Chrome.app/Contents/MacOS/Google\ Chrome"
I've got some arguments to pass in to Chrome, but that's not so important - I can't seem to get it started from Eclipse as an External Tool at all. The "Run" button is greyed out, and the configuration doesn't show up on the External Tools run menu once I save it. What am I doing wrong/missing?
UPDATED:
Attempting to use the "open" command ala Running external tools in Eclipse on Mac OS X appears to simply switch to a running instance of Chrome, instead of run chrome with me command line arguments.
I've tried location:
/usr/bin/open
Arguments:
-a "/Applications/Chrome.app" --args "localhost"
and Chrome does not open localhost - instead it simply switches to an existing open window with Chrome in it.
Does this similar SO post help you?
Running external tools in Eclipse on Mac OS X

Is there a way to add Google Chrome as an external web browser in Flash Builder Standalone for Mac?

It currently seems impossible to add Google Chrome as an external web browser in Flash Builder Standalone for Mac. In this context, Eclipse only cares about "Unix executables" and not .app files.
For example, the path to Firefox on a Mac is: /Applications/Firefox.app/Contents/MacOS/firefox-bin
which is only found by right-clicking and choosing 'Show Package Contents' on Firefox.app in your Applications directory.
If you try to add Google Chrome as a new external web browser, you'll have to repeat this process to navigate to /Applications/Google Chrome.app/Contents/MacOS where the 'Google Chrome' Unix exxecutable resides.
The problem is that space in the name. If you attempt to click OK in Eclipse, you'll get an error preventing you from continuing:
The location value is not a valid path
name
Are there any workarounds for this so I can use Chrome as my development browser only? I did some searching and all I could come up with was this:
https://bugs.eclipse.org/bugs/show_bug.cgi?id=297273
UPDATE: A kind and savvy Flash Builder engineer gave me a helpful tip. Note that you'll need to show hidden files in Mac, by opening Terminal and entering the following command:
defaults write com.apple.finder AppleShowAllFiles TRUE
killall Finder
Press Return to relaunch Finder. Once hidden files are shown, "You’ll find what you need in [YOUR WORKSPACE]/.metadata/.plugins/org.eclipse.core.runtime/.settings/org.eclipse.ui.browser.prefs.
There’s a 'browsers' property there that defines XML for defining Eclipse’s web browsers. Add a new browser location and name and restart Flash Builder."
In this case you'd add:
<external location\="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" name\="Google Chrome"/>\n
I can confirm that this works. Hopefully we won't have to resort to this kind of hackery on the next go around.
You can do this from the UI in FB 4.5 - However, you need this exact path (unquoted and unescaped) in Preferences->Web Browser. Select "Use External Browser" and add the line below as the location (You may not need the 'name\="Google Chrome" bit, but looks like it worked all in one line for me):
/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" name\="Google Chrome
You could create an executable here: /usr/local/bin/chrome with these contents:
#!/bin/sh
open -a 'Google Chrome' $1 &
And then ensure Chrome's Preferences settings for "Web Browser" are this for external web browser "Google Chrome":
Name: Google Chrome
Location: /usr/local/bin/chrome
Parameters: %URL%
Update
As of Eclipse 4.3.1, the script approach (below) no longer works, but the simpler option of simply selecting "Google Chrome.app" as an external browser (using Eclipse UI) is fixed.
Old (obsolete) answer
My workaround was to create a shell script that opens Chrome (see below), and point Eclipse to this script. In this way Chrome is opened with 2 tabs - the home page and the requested page - but this was good enough for me.
#! /bin/sh
open /Applications/Google\ Chrome.app $*
You need the path to the Unix Executable file of Google Chrome.
How to:
in Finder, right click Google Chrome.app "Show Package Content".
Navigate down to Content/MacOS
cmd + i and copy the path to the Unix Executable File
In Eclipse Preferences Web Browser / Location, "brows.."
Paste in the path to the Unix Executable.
The path, something like: /Applications/Google Chrome.app/Contents/MacOS
Location: /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
Parameters: -sandbox
The simplest way to get Flash Builder Standalone for Mac to recognize Chrome as the default system browser is
Open Safari
Go to menu Safari > Preference > General
Change 'Default web browser' : Safari
Change 'Default web browser' : Chrome
Close Safari
This solution is more general as it applies to any application which chooses the incorrect system browser. (thanks to Kelvin Lawrence at IBM)
For me worked with the following configuration:
Location: /usr/bin/open
Parameters: -a "Google Chrome.app" %URL%
I found the solution in a blog's post that doesn't exist anymore, it involves configuring the Location to be /usr/bin/open and the parameter is %URL%.
You need to make sure that google chrome is your default browser and it will work properly. This is the only method that worked for me on OSX Lion.
/Applications/Google\ Chrome.app/Contents/MacOS
escape the space in the path to the google chrome executable. OS X only cares about unix executables, because its posix based as well, it doesn't actually have much to do with eclipse.