Support "Open Preview" via JavaScript

[meysholdt]

The examples from tensorflow/tfjs-examples#281 try to launch a web browser by themselves.

This doesn't work and I get this stack trace in the console:

Unexpected error while opening in browser: true
Error: Exited with code 3
    at ChildProcess.cp.once.code (/workspace/tfjs-examples/iris/node_modules/opn/index.js:87:18)
    at Object.onceWrapper (events.js:277:13)
    at ChildProcess.emit (events.js:189:13)
    at maybeClose (internal/child_process.js:970:16)
    at Socket.stream.socket.on (internal/child_process.js:389:11)
    at Socket.emit (events.js:189:13)
    at Pipe._handle.close (net.js:597:12)

Ignoring the stack trace and using Gitpod's "open-preview on port-open" mechanism doesn't work because the port opens much earlier than the server actually serves content. Thus, the Preview View opens too early and remains empty due to a timeout error.

A bit of debugging reveals that the JS code tries to run this sh script:
node_modules/opn/xdg-open http://localhost:1236

When I run node_modules/opn/xdg-open $(gp url 1234) manually, I get this error output:

/workspace/tfjs-examples/iris/node_modules/opn/xdg-open: 881: /workspace/tfjs-examples/iris/node_modules/opn/xdg-open: www-browser: not found
/workspace/tfjs-examples/iris/node_modules/opn/xdg-open: 881: /workspace/tfjs-examples/iris/node_modules/opn/xdg-open: links2: not found
/workspace/tfjs-examples/iris/node_modules/opn/xdg-open: 881: /workspace/tfjs-examples/iris/node_modules/opn/xdg-open: elinks: not found
/workspace/tfjs-examples/iris/node_modules/opn/xdg-open: 881: /workspace/tfjs-examples/iris/node_modules/opn/xdg-open: links: not found
/workspace/tfjs-examples/iris/node_modules/opn/xdg-open: 881: /workspace/tfjs-examples/iris/node_modules/opn/xdg-open: lynx: not found
/workspace/tfjs-examples/iris/node_modules/opn/xdg-open: 881: /workspace/tfjs-examples/iris/node_modules/opn/xdg-open: w3m: not found
xdg-open: no method available for opening 'https://1234-d41cae65-b66f-4dcd-b2b4-821a0eb87264.ws-eu0.gitpod.io/'

Todo: npm-package opn should work by default on Gitpod.

[meysholdt]

Workaround:

set export BROWSER="$(pwd)/.gitpod-preview.sh"
with .gitpod-preview.sh:

#!/bin/bash
# workaround for https://github.com/gitpod-io/gitpod/issues/596
URL=$1
PORT=${URL##*:}
PUB=$(gp url $PORT)
gp preview $PUB 

see here for applied workaround.

Proposed solution

1. we should set ENV BROWSER by default and have it point to gp preview.
2. gp preview should detect when the URL points to localhost or an internal IP and re-write the URL to it's public format, using the same logic as gp url <port> does.

[svenefftinge]

This has been done and is now in production.