Terminal text invisible on macOS safari

zp4rker commented 2 years ago

OS/Web Information

Web Browser: Safari v15.1
Local OS: macOS 12.0.1
Remote OS: Ubuntu 20.04.3 LTS (Running through codercom/code-server image)
Remote Architecture: aarch64
code-server --version: 3.12.0 2661a690ac228872e8d1dc28ab6d33e8afc30add

Steps to Reproduce

Boot up an instance
Log into instance in browser
Open terminal

Expected

The text should actually be visible.

Actual

Text is being written to the terminal, they just appear invisible for some reason. I have caught very short glimpses of the text showing (maybe a second) and then it immediately disappears. Commands still go through however, its working its just invisible.

It shows in Brave, however its really weird and unclear. It works fine on Safari on the iPad.

Logs

Screenshot

Notes

This issue can be reproduced in VS Code: No

jsjoeio commented 2 years ago

Hmm...a couple things:

are you using a custom font? (i.e. in your settings.json)
can you try changing themes and seeing if that fixes it?
are there any browser logs?
can you reproduce this in xterm.js?

zp4rker commented 2 years ago

No custom font
Has effect on all themes from what I can see
xterm.js appears to work fine

Browser logs:


[Error] [vscode] failed to initialize VS Code
    (anonymous function) (vscode.browserified.js:726)
    o (vscode.browserified.js:1:270)
    r (vscode.browserified.js:1:433)
    Global Code (vscode.browserified.js:1:461)
[Error] Error: [vscode] Could not set body background to theme background color. Could not find colorThemeData in localStorage.
    (anonymous function) (vscode.browserified.js:727)
    o (vscode.browserified.js:1:270)
    r (vscode.browserified.js:1:433)
    Global Code (vscode.browserified.js:1:461)
[Log] info  [Service Worker] registered (vscode.browserified.js, line 129)
[Warning] The web worker extension host is started without an iframe sandbox! (workbench.web.api.js, line 1525)
[Error] Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag.
    createElement (workbench.web.api.js:1271:4587426)
    _ (workbench.web.api.js:1271:4583956)
    _createInstance (workbench.web.api.js:600:1809632)
    createInstance (workbench.web.api.js:600:1809061)
    createWebviewElement (workbench.web.api.js:1271:4594513)
    createWebviewElement
    (anonymous function) (workbench.web.api.js:1799:6151676)
    asyncFunctionResume
    (anonymous function) (workbench.web.api.js:1799:6153957)
    asyncFunctionResume
    buildCategorySlide (workbench.web.api.js:1897:6174117)
    (anonymous function) (workbench.web.api.js:1897:6161739)
    asyncFunctionResume
    (anonymous function) (workbench.web.api.js:1799:6144683)
    asyncFunctionResume
    (anonymous function)
    promiseReactionJobWithoutPromise
[Error] Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag.
    (anonymous function) (main.js:116:12037)
    asyncFunctionResume
    (anonymous function)
    promiseReactionJobWithoutPromise
    promiseReactionJob
[Error] Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag.
    (anonymous function) (main.js:116:12037)
    asyncFunctionResume
    (anonymous function)
    promiseReactionJobWithoutPromise
[Log]   ERR – "a text search provider for the scheme 'file' is already registered: Error: a text search provider for the scheme 'file' is alread…" (workbench.web.api.js, line 602)
"a text search provider for the scheme 'file' is already registered: Error: a text search provider for the scheme 'file' is already registered
    at _.registerTextSearchProvider (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:103:12674)
    at _registerEHSearchProviders (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:113:11365)
    at _.$enableExtensionHostSearch (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:113:11238)
    at i._doInvokeHandler (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:98:13542)
    at i._invokeHandler (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:98:13226)
    at i._receiveRequest (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:98:11888)
    at i._receiveOneMessage (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:98:10566)
    at /usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:98:8662
    at c.fire (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:66:1712)
    at a.fire (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:74:15781)
    at /usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:113:30364
    at c.fire (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:66:1712)
    at a.fire (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:74:15781)
    at r._receiveMessage (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:74:21079)
    at /usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:74:17929
    at c.fire (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:66:1712)
    at p.acceptChunk (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:74:13142)
    at /usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:74:12490
    at c.fire (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:66:1712)
    at E._acceptChunk (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:113:19362)
    at /usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:113:15775
    at Socket.w (/usr/lib/code-server/vendor/modules/code-oss-dev/out/vs/workbench/services/extensions/node/extensionHostProcess.js:113:13350)
    at Socket.emit (events.js:400:28)
    at addChunk (internal/streams/readable.js:290:12)
    at readableAddChunk (internal/streams/readable.js:265:9)
    at Socket.Readable.push (internal/streams/readable.js:204:10)
    at TCP.onStreamRead (internal/stream_base_commons.js:188:23)"
[Log] Failed to initialize remote Link authority: No remote extension installed to resolve coder-link. (workbench.web.api.js, line 2853)
[Log] setColorTheme apply: false (workbench.web.api.js, line 1924)
[Log] setColorTheme apply: true (workbench.web.api.js, line 1924)
[Error] Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag.
    (anonymous function) (main.js:116:12037)
    asyncFunctionResume
    (anonymous function)
    promiseReactionJobWithoutPromise
[Log] setColorTheme apply: false (workbench.web.api.js, line 1924)
[Log] setColorTheme apply: true (workbench.web.api.js, line 1924)
[Error] Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag.
    (anonymous function) (main.js:116:12037)
    asyncFunctionResume
    (anonymous function)
    promiseReactionJobWithoutPromise
[Log] setColorTheme apply: false (workbench.web.api.js, line 1924, x2)
[Log] setColorTheme apply: true (workbench.web.api.js, line 1924)
[Error] Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag.
    (anonymous function) (main.js:116:12037)
    asyncFunctionResume
    (anonymous function)
    promiseReactionJobWithoutPromise```

jsjoeio commented 2 years ago

[Error] Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag.

I've never seen this before 🤔

@code-asher any ideas?

T2SU commented 2 years ago

Same symptom here.

Browser: Safari version 15.1(16612.2.9.1.30, 16612) Local OS: macOS 11.6.1 (M1) Remote OS: CentOS 8.4 (4.18.0-305.7.1) x64 code-server Version: 3.12.0 https://github.com/cdr/code-server/commit/b37ff28a0a582aee84a8f961755d0cb40a4081db (Installed via the official installation script) Remote OS: Windows 10 (10.0.19041.1288) x64 code-server Version: 3.12.0 https://github.com/cdr/code-server/commit/4cd55f94c0a72f05c18cea070e10b969996614d2 (Installed from npm)

Only occurred on Safari 15 whereas the others are working great. Google Chrome: (95.0.4638.54-arm64) Firefox Developer Edition: (94.0b9-arm64) Safari 14.1.2: (14611.3.10.1.7-arm64)

It’s same in Safari 15.0 15612.1.29.41.4, 15612 (macOS 10.15.7-Intel)

——

I figured out that despite Safari 14.1.2 works well, It prints “Error while parsing the 'sandbox' attribute: 'allow-downloads' is an invalid sandbox flag” log on console. Perhaps this output is not a problem.

zp4rker commented 2 years ago

It appears to be a WebGL rendering issue, surprisingly enabling the Experimental Feature > WebGL 2.0 actually causes it to not display but disabling that feature fixes it. Hopefully Apple fixes up their WebGL game.

T2SU commented 2 years ago

As soon as I've turn off the WebGL 2.0 feature, the terminal came back. very big thanks. ❤️

I have no idea what Apple has done.

zp4rker commented 2 years ago

As soon as I've turn off the WebGL 2.0 feature, the terminal came back. very big thanks. ❤️

I have no idea what Apple has done.

No worries!

To be fair to Apple, it is an experimental feature.

jsjoeio commented 2 years ago

It appears to be a WebGL rendering issue, surprisingly enabling the Experimental Feature > WebGL 2.0 actually causes it to not display but disabling that feature fixes it.

Okay, I have to know...how did you figure that out?! 🤯

code-asher commented 2 years ago

Looks like this was worked around upstream to skip using WebGL on Safari (previously it only skipped on iOS) so once we update this should be resolved.

jsjoeio commented 2 years ago

Looks like this was worked around upstream to skip using WebGL on Safari

Can you post a link to where you found this information?

code-asher commented 2 years ago

Here is the latest: https://github.com/microsoft/vscode/blob/a4906e7a1517d077c2c5dba78d87f8e09b20f35a/src/vs/workbench/contrib/terminal/browser/xterm/xtermTerminal.ts#L176

While on v3.12.0 ours looks like:

https://github.com/cdr/vscode/blob/1.60.0-code-server-patch/src/vs/workbench/contrib/terminal/browser/terminalInstance.ts#L1517

I think I originally found this by searching xterm issues for webgl:

https://github.com/xtermjs/xterm.js/search?q=webgl+safari&type=issues

RyanBalfanz commented 2 years ago

As soon as I've turn off the WebGL 2.0 feature, the terminal came back. very big thanks. ❤️

I have no idea what Apple has done.

I can confirming this fix works for me too. Also noting that the feature was likely enabled by default. I don't remember ever enabling it, nor can I imagine that I ever would have.

rcarmo commented 2 years ago

Ditto for this being enabled by default. Just checked on a new Monterey install.

stale[bot] commented 2 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no activity occurs in the next 5 days.

Iloveyoutensiya commented 8 months ago

Hello, can you do me a favor?

coder / code-server