thunderclient / thunder-client-support

Thunder Client is a lightweight Rest API Client Extension for VS Code.
https://www.thunderclient.com
Other
3.61k stars 126 forks source link

Extension not working on latest Safari (MacOS, iPadOS) using vscode tunnel #1504

Closed ste-el-bow closed 4 months ago

ste-el-bow commented 5 months ago

if started vscode server via code tunnel and use Safari to access dev env in the browser, extension is not working, some fields are not visible and Send button isn't working image

To Reproduce spin up dev server with code tunnel Access tunel using Safari (both on full MacOS and iPadOS) Try to send any request.

Expected behavior Body->Form should be rendered correctly, Send Button should actually send request

Platform:

Version: 1.87.2 Commit: 863d2581ecda6849923a2118d93a088b0745d9d6 Date: 2024-03-08T15:15:59.953Z Browser: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.3.1 Safari/605.1.15

Extension version: v2.19.5

Are you using the free version/paid version/trial: free

Seems to be similar to https://github.com/rangav/thunder-client-support/issues/662

rangav commented 5 months ago

Thanks @ste-el-bow for reporting the bug.

Any previous version working before?

ste-el-bow commented 5 months ago

I don't think so. It never worked for me, but I'm using remote tunnel since around 2 months.

rangav commented 5 months ago

ok thanks for confirmation

can you share instructions how to setup remote tunnel and test it. Will look into it asap.

ste-el-bow commented 5 months ago

You need to have vscode installed on your machine. Then open any terminal, type: code tunnel and follow instructions:

❯ code tunnel
*
* Visual Studio Code Server
*
* By using the software, you agree to
* the Visual Studio Code Server License Terms (https://aka.ms/vscode-server-license) and
* the Microsoft Privacy Statement (https://privacy.microsoft.com/en-US/privacystatement).
*
[2024-03-19 12:05:07] info Using Github for authentication, run `code tunnel user login --provider <provider>` option to change this.
To grant access to the server, please log into https://github.com/login/device and use code XXXX-XXXXX

after you authorize in browser terminal will produce url you have to use to access your machine via browser:

[2024-03-19 12:08:05] info Creating tunnel with the name: macbook-pro-dariuszl

Open this link in your browser https://vscode.dev/tunnel/macbook-pro-dariuszl/Users/utytlanyjoe/Work/Projects/sample-project

When you open that url in browser you'll get cloud version of vscode. Install extension as usually and test. It is working fine on edge/chrome, however not on Safari.

ste-el-bow commented 5 months ago

Not sure if it is anyhow helpfull, but i can see some errors in safari when switching to thunder client tab, while these are not present on chrome:

[Log] No service worker controller found. Waiting for controllerchange. (index.html, line 273)
[Error] Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.min.css because it violates the resource's Cross-Origin-Resource-Policy response header.
[Error] Cannot load https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.min.css.
[Error] Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.min.css because it violates the resource's Cross-Origin-Resource-Policy response header.
[Error] Failed to load resource: Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.min.css because it violates the resource's Cross-Origin-Resource-Policy response header. (main.min.css, line 0)
[Error] Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.bundle.js because it violates the resource's Cross-Origin-Resource-Policy response header.
[Error] Cannot load https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.bundle.js.
[Error] Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.bundle.js because it violates the resource's Cross-Origin-Resource-Policy response header.
[Error] Failed to load resource: Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/main.bundle.js because it violates the resource's Cross-Origin-Resource-Policy response header. (main.bundle.js, line 0)
[Error] Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/modes/ace.js because it violates the resource's Cross-Origin-Resource-Policy response header.
[Error] Cannot load https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/modes/ace.js.
[Error] Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/modes/ace.js because it violates the resource's Cross-Origin-Resource-Policy response header.
[Error] Cross-origin script load denied by Cross-Origin Resource Sharing policy. (x2)
[Error] Failed to load resource: Cancelled load to https://vscode-remote+tunnel-002bmikrus-002d3-002d5.vscode-resource.vscode-cdn.net/home/steelbow/.vscode-server/extensions/rangav.vscode-thunder-client-2.20.3/dist/modes/ace.js because it violates the resource's Cross-Origin-Resource-Policy response header. (ace.js, line 0)
[Error] Unrecognized Content-Security-Policy directive 'require-trusted-types-for'.

[Error] Unrecognized Content-Security-Policy directive 'trusted-types'.

[Error] Unrecognized Content-Security-Policy directive 'require-trusted-types-for'.

[Error] Unrecognized Content-Security-Policy directive 'trusted-types'.

Is this related to extension itself or more general vscode in browser - Safari compatibility issue?

rangav commented 4 months ago

The issue is with cross-origin restrictions in Safari.

Reference: https://stackoverflow.com/a/12158217/4035948