Unable to load webview on iPad #4433

shp7724 · 2021-11-03T08:24:20Z

Similar to #4131, but without CSP error message.

OS/Web Information

Web Browser: Safari, Chrome
Local OS: iPadOS 15
Remote OS: macOS 12.0.1
Remote Architecture: intel mac
code-server --version: 3.12.0

Steps to Reproduce

Boot up code-server instance on macOS.
Open code-server pwa on iPad, confirm that everything is fine, and move it to background.
After a while, reopen the pwa app. Wait for a sec until it reconnects.
Now I can't preview local images (e.g. .png, .jpg, ..).

Expected

The images should show up.

Actual

When I click the image file, a blank new tab opens with nothing. In addition, I can't load details page of the extensions. Also, extensions using webview such as Gitgraph don't show up. Other than that, everything works as normal.

Logs

Result of code-server --log debug:

[2021-11-03T07:46:09.956Z] info  code-server 3.12.0 4cd55f94c0a72f05c18cea070e10b969996614d2
[2021-11-03T07:46:09.958Z] info  Using user-data-dir ~/.local/share/code-server
[2021-11-03T07:46:09.970Z] info  Using config file ~/.config/code-server/config.yaml
[2021-11-03T07:46:09.970Z] info  HTTP server listening on http://0.0.0.0:8888 
[2021-11-03T07:46:09.970Z] info    - Authentication is enabled
[2021-11-03T07:46:09.970Z] info      - Using password from ~/.config/code-server/config.yaml
[2021-11-03T07:46:09.970Z] info    - Not serving HTTPS 
[2021-11-03T07:46:26.444Z] debug forking vs code...
[2021-11-03T07:46:26.848Z] debug setting up vs code...
[2021-11-03T07:46:26.851Z] debug vscode got message from code-server {"type":"init"}
[2021-11-03T07:46:27.467Z] debug vscode got message from code-server {"type":"socket"}
[2021-11-03T07:46:27.469Z] debug protocol Initiating handshake... {"token":"641726d1-1aad-4221-89fa-b0c3cf4368cd"}
[2021-11-03T07:46:27.476Z] debug protocol Handshake completed {"token":"641726d1-1aad-4221-89fa-b0c3cf4368cd"}
[2021-11-03T07:46:27.477Z] debug management Connecting... {"token":"641726d1-1aad-4221-89fa-b0c3cf4368cd"}
[2021-11-03T07:46:27.478Z] debug vscode 1 active management connection(s)
[2021-11-03T07:46:27.693Z] debug got latest version {"latest":"3.12.0"}
[2021-11-03T07:46:27.693Z] debug comparing versions {"current":"3.12.0","latest":"3.12.0"}
[2021-11-03T07:46:27.758Z] debug vscode got message from code-server {"type":"socket"}
[2021-11-03T07:46:27.759Z] debug protocol Initiating handshake... {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:27.814Z] debug protocol Handshake completed {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:27.815Z] debug exthost Connecting... {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:27.818Z] debug exthost Getting NLS configuration... {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:27.819Z] debug vscode 1 active exthost connection(s)
[2021-11-03T07:46:27.819Z] debug exthost Spawning extension host... {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:27.825Z] debug exthost Waiting for handshake... {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:28.709Z] debug exthost Handshake completed {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:28.709Z] debug exthost Sending socket {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:41.260Z] debug management Disconnected {"token":"641726d1-1aad-4221-89fa-b0c3cf4368cd"}
[2021-11-03T07:46:41.260Z] debug exthost Got disconnected message {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:46:41.261Z] debug exthost Disconnected {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:47:26.428Z] debug 1 active connection
[2021-11-03T07:48:26.428Z] debug 1 active connection
[2021-11-03T07:51:34.479Z] debug vscode got message from code-server {"type":"socket"}
[2021-11-03T07:51:34.480Z] debug protocol Initiating handshake... {"token":"641726d1-1aad-4221-89fa-b0c3cf4368cd"}
[2021-11-03T07:51:34.482Z] debug vscode got message from code-server {"type":"socket"}
[2021-11-03T07:51:34.482Z] debug protocol Initiating handshake... {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:51:34.490Z] debug protocol Handshake completed {"token":"641726d1-1aad-4221-89fa-b0c3cf4368cd"}
[2021-11-03T07:51:34.491Z] debug management Reconnecting... {"token":"641726d1-1aad-4221-89fa-b0c3cf4368cd"}
[2021-11-03T07:51:34.492Z] debug protocol Handshake completed {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:51:34.492Z] debug exthost Reconnecting... {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}
[2021-11-03T07:51:34.493Z] debug exthost Sending socket {"token":"ff9d3523-4397-4bf1-8359-5c63b548f333"}

Note that I sent the pwa app to the background at 2021-11-03T07:46:41.261Z, and after 5 minutes, reopened the app at 2021-11-03T07:51:34.493Z.

Screenshots comparing macOS Safari vs iPadOS Safari

Network log on macOS Safari when clicking an image

Please note that after service_worker.js is called, fake.html, main.css, main.js, porto1_warped.png is loaded sequentially. This is what should happen when loading an image.

Network log on iPadOS Safari when clicking an image

On iPad, however, even after service_worker.js is called, nothing happens.

Console log on iPadOS Safari when clicking an image

Every time I click an image file I see an error Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag. but I don't think this is the main cause of the issue because the same error message appears in macOS Safari.

Source log on iPadOS Safari when clicking an image

The image above shows Socket log each time I click the image file. It seems up and running. (It reads "Binary Frame" in Korean.)

Log when restarting code-server instance

Now with that pwa open, I tried restarting code-server, and then noticed an error message that wasn't there before.

shp7724@bagsinhong-ui-MacBookPro ~ % code-server --log debug
[2021-11-03T08:10:30.088Z] info  code-server 3.12.0 4cd55f94c0a72f05c18cea070e10b969996614d2
[2021-11-03T08:10:30.089Z] info  Using user-data-dir ~/.local/share/code-server
[2021-11-03T08:10:30.100Z] info  Using config file ~/.config/code-server/config.yaml
[2021-11-03T08:10:30.100Z] info  HTTP server listening on http://0.0.0.0:8888 
[2021-11-03T08:10:30.100Z] info    - Authentication is enabled
[2021-11-03T08:10:30.100Z] info      - Using password from ~/.config/code-server/config.yaml
[2021-11-03T08:10:30.100Z] info    - Not serving HTTPS 
[2021-11-03T08:10:32.732Z] error vscode is not running Error: vscode is not running
    at VscodeProvider.send (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:121:19)
    at VscodeProvider.sendWebsocket (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:117:14)
    at async /usr/local/Cellar/code-server/3.12.0/libexec/out/node/routes/vscode.js:205:5
[2021-11-03T08:10:32.735Z] error vscode is not running Error: vscode is not running
    at VscodeProvider.send (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:121:19)
    at VscodeProvider.sendWebsocket (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:117:14)
    at async /usr/local/Cellar/code-server/3.12.0/libexec/out/node/routes/vscode.js:205:5
[2021-11-03T08:10:32.735Z] error vscode is not running Error: vscode is not running
    at VscodeProvider.send (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:121:19)
    at VscodeProvider.sendWebsocket (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:117:14)
    at async /usr/local/Cellar/code-server/3.12.0/libexec/out/node/routes/vscode.js:205:5
[2021-11-03T08:10:32.738Z] error vscode is not running Error: vscode is not running
    at VscodeProvider.send (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:121:19)
    at VscodeProvider.sendWebsocket (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:117:14)
    at async /usr/local/Cellar/code-server/3.12.0/libexec/out/node/routes/vscode.js:205:5
[2021-11-03T08:10:33.576Z] error vscode is not running Error: vscode is not running
    at VscodeProvider.send (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:121:19)
    at VscodeProvider.sendWebsocket (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:117:14)
    at async /usr/local/Cellar/code-server/3.12.0/libexec/out/node/routes/vscode.js:205:5
[2021-11-03T08:10:33.617Z] error vscode is not running Error: vscode is not running
    at VscodeProvider.send (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:121:19)
    at VscodeProvider.sendWebsocket (/usr/local/Cellar/code-server/3.12.0/libexec/out/node/vscode.js:117:14)
    at async /usr/local/Cellar/code-server/3.12.0/libexec/out/node/routes/vscode.js:205:5
[2021-11-03T08:10:35.345Z] debug forking vs code...
[2021-11-03T08:10:35.774Z] debug setting up vs code...
[2021-11-03T08:10:35.778Z] debug vscode got message from code-server {"type":"init"}
[2021-11-03T08:10:37.099Z] debug vscode got message from code-server {"type":"socket"}
...

Notes

I'm using Let's Encrypt with NGINX, and there seems no problem in HTTPS connection.
The same issue happens either on safari or pwa mode on iPad

Thanks for maintaining this wonderful project. Any help would be greatly appreciated.

This issue can be reproduced in VS Code: No (tested in vscode.dev)

The text was updated successfully, but these errors were encountered:

jsjoeio · 2021-11-03T17:39:32Z

Thanks for the thorough report! This looks strangely similar to this issue. Can you try this solution?

shp7724 · 2021-11-04T00:11:59Z

I tried it but it didn't solve my problem. I guess the issue has something to do with service-worker.js, but have no idea where to dig into it further.

shp7724 · 2021-11-04T07:17:47Z

Steps to Reproduce

Boot up code-server instance on macOS.

Open code-server pwa on iPad, confirm that everything is fine, and move it to background.

After a while, reopen the pwa app. Wait for a sec until it reconnects.

Now I can't preview local images (e.g. .png, .jpg, ..).

I captured some browser logs at the STEP 2, when the webviews are loaded properly. It might be worth a look.

The log written in Korean could be translated as:

Failed to load resource: The certificate for this server is not valid. You might be connected to a server disguised as 'vcode-remote+code-002efindy-002eco-002ekr.vscode-resource.vscode-webview.net', which could expose your secret information at risk.

Below are the logs at STEP 3 and 4:

Please note that the first two logs "[GitLens]" – "[28] GitService.onWindowStateChanged completed • 0 ms" are printed when I moved the PWA to the background.

A few seconds later, right after I brought the app to the foreground, I saw the error messages saying the websocket connection is aborted. I'm not sure though whether it managed to recover the connection later. But since then my PWA app stops loading webviews on iPad. Refreshing the page doesn't help.

Update

I just found that restarting the PWA app partly solves the issue: it goes to STEP 2. However, restarting the app every time I open it would be bothersome.

Do you see any possible causes for this issue here?

Thanks.

jsjoeio · 2021-11-04T17:26:50Z

The certificate for this server is not valid

Hmm...could it be that your browser does not respect the authority of your certificate and that's causing it? 🤔

I just found that restarting the PWA app partly solves the issue: it goes to STEP 2. However, restarting the app every time I open it would be bothersome.

Hmm...nothing specific comes to mind. @code-asher any ideas?

shp7724 · 2021-11-04T18:03:38Z

Well, Safari seems to fully trust (without any warning) the certificate at least for my domain. I don't know why Safari doesn't trust vcode-remote+code-002efindy-002eco-002ekr.vscode-resource.vscode-webview.net...

Even if that was the cause of the problem, it doesn't make sense to me that it fails to load webview only after resuming the app :(

By any chance can you try reproducing this issue on your side? If it's confirmed that I'm the only one experiencing this issue, I might as well go through the setup process all over again.

jsjoeio · 2021-11-04T18:17:37Z

Unfortunately, I don't have the bandwidth to replicate the exact same environment setup. But what I can say is 3.12.0 works when deploying to Railway and accessing via the PWA on my iPad 14.8. Therefore I can confirm:

3.12.0 does work on iPad
the PWA does work on iPad

Video

RPReplay_Final1636049722.MP4

shp7724 · 2021-11-10T05:03:54Z

Thanks for the test!
Can you please test the following too?

Steps to Reproduce

Open PWA on iPad.
Go to Homescreen.
Wait for 10 seconds.
Open PWA again.
Try to open any image.
Check if the image is loaded successfully.

Video

This is what happens on my side.

RPReplay_Final1636520409.MP4

jsjoeio · 2021-11-10T16:55:39Z

Wow, that was super easy to follow and it reproduced on mine! Nice catch! I wonder what's happening 🤔 We'll have to look into this.

Do you know if this happens on vscode.dev? If it does, then it's an upstream bug.

Video

RPReplay_Final1636563240.MP4

shp7724 · 2021-11-10T17:32:06Z

I'm glad to find out that I'm not the only one. 🥲

Do you know if this happens on vscode.dev? If it does, then it's an upstream bug.

No, it does not happen on vscode.dev. Please refer to the test video attached below.

A bigger issue for me is, being unable to load image means being unable to use any webview-based extentions, such as GitGraph.

The browser log I posted above shows what happens when you open PWA again. If you need anything else about the log, feel free to ask. I really want to help solve the issue.

Thank you.

Test Video on vscode.dev

RPReplay_Final1636564096.MP4

jsjoeio · 2021-11-10T17:52:19Z

A bigger issue for me is, being unable to load image means being unable to use any webview-based extentions, such as GitGraph.

Ah, that is a big issue.

The browser log I posted above shows what happens when you open PWA again. If you need anything else about the log, feel free to ask. I really want to help solve the issue.

Those will help a ton! I guess we'll have to dig into this further. @code-asher any ideas?

We have some big priorities for getting the next release out but after that, we can take a look!

code-asher · 2021-11-10T18:32:44Z

Any idea if this reproduces with the upstream server we rebased on yesterday?

jsjoeio · 2021-11-10T18:57:24Z

Any idea if this reproduces with the upstream server we rebased on
yesterday?

Good question 🤔 I used to be able to test easily by running --link but I don't think that's working at the moment.

➜  ~ code-server --link
[2021-11-10T18:56:03.194Z] info  code-server 3.12.0 4cd55f94c0a72f05c18cea070e10b969996614d2
[2021-11-10T18:56:03.196Z] info  Using user-data-dir ~/.local/share/code-server
[2021-11-10T18:56:03.250Z] info  Using config file ~/.config/code-server/config.yaml
[2021-11-10T18:56:03.250Z] info  HTTP server listening on http://127.0.0.1:55604 (randomized by --link)
[2021-11-10T18:56:03.250Z] info    - Authentication is disabled (disabled by --link)
[2021-11-10T18:56:03.250Z] info    - Not serving HTTPS (disabled by --link)
[2021-11-10T18:56:03.257Z] error spawn /usr/local/Cellar/code-server/3.12.0/libexec/lib/coder-cloud-agent ENOENT

I'm thinking out loud here and not sure the easiest way to test.

I can take this one on but I probably won't do it until we get a new release out, which will be easy to test with Railway by using the latest Docker tag of code-server.

shp7724 · 2022-03-08T14:38:54Z

@jsjoeio Upgrading from 3.12.0 to 4.1.0 seems to have fixed this issue.

jsjoeio · 2022-03-08T17:27:42Z

@shp7724 that's two issues you've helped with in the past 24 hours - thanks so much!!

shp7724 changed the title ~~Unable to preview local images on iPad~~ Unable to load webview on iPad Nov 3, 2021

jsjoeio added the waiting-for-info Waiting for more information from submitter label Nov 3, 2021

jsjoeio added bug Something isn't working os-ios iOS/iPad related labels Nov 10, 2021

jsjoeio added this to the On Deck milestone Nov 10, 2021

jsjoeio modified the milestones: On Deck, 3.12.2 - improve iPad UX Nov 10, 2021

jsjoeio removed the waiting-for-info Waiting for more information from submitter label Nov 10, 2021

jsjoeio self-assigned this Nov 10, 2021

shp7724 closed this as completed Mar 8, 2022

jsjoeio modified the milestones: On Deck - High Priority, 4.1.0 Mar 8, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Unable to load webview on iPad #4433

Unable to load webview on iPad #4433

shp7724 commented Nov 3, 2021 •

edited

Loading

jsjoeio commented Nov 3, 2021

shp7724 commented Nov 4, 2021 •

edited

Loading

shp7724 commented Nov 4, 2021 •

edited

Loading

Steps to Reproduce

jsjoeio commented Nov 4, 2021

shp7724 commented Nov 4, 2021

jsjoeio commented Nov 4, 2021

shp7724 commented Nov 10, 2021

jsjoeio commented Nov 10, 2021

shp7724 commented Nov 10, 2021

jsjoeio commented Nov 10, 2021

code-asher commented Nov 10, 2021 via email

jsjoeio commented Nov 10, 2021

shp7724 commented Mar 8, 2022

jsjoeio commented Mar 8, 2022

Unable to load webview on iPad #4433

Unable to load webview on iPad #4433

Comments

shp7724 commented Nov 3, 2021 • edited Loading

OS/Web Information

Steps to Reproduce

Expected

Actual

Logs

Screenshots comparing macOS Safari vs iPadOS Safari

Network log on macOS Safari when clicking an image

Network log on iPadOS Safari when clicking an image

Console log on iPadOS Safari when clicking an image

Source log on iPadOS Safari when clicking an image

Log when restarting code-server instance

Notes

jsjoeio commented Nov 3, 2021

shp7724 commented Nov 4, 2021 • edited Loading

shp7724 commented Nov 4, 2021 • edited Loading

Steps to Reproduce

Update

jsjoeio commented Nov 4, 2021

shp7724 commented Nov 4, 2021

jsjoeio commented Nov 4, 2021

Video

shp7724 commented Nov 10, 2021

Steps to Reproduce

Video

jsjoeio commented Nov 10, 2021

Video

shp7724 commented Nov 10, 2021

Test Video on vscode.dev

jsjoeio commented Nov 10, 2021

code-asher commented Nov 10, 2021 via email

jsjoeio commented Nov 10, 2021

shp7724 commented Mar 8, 2022

jsjoeio commented Mar 8, 2022

shp7724 commented Nov 3, 2021 •

edited

Loading

shp7724 commented Nov 4, 2021 •

edited

Loading

shp7724 commented Nov 4, 2021 •

edited

Loading