Open Mini browser from command line

[Tpuljak]

It would be great that the Mini browser could be opened from the Terminal.

For example when starting a react-scripts project, Chrome open automatically to localhost:3000. I am trying to find a way to open the Mini browser instead of Chrome so users can have a browser side by side to their code with hot reload functionality.

I know that I can input the url in Preview: Open URL, but I would like this to be done automatically.

I tried to see how open works (the npm that react-scripts uses) but I didn't have any luck in trying to bind that to Mini browser.

If this can be done, I would happily contribute to the extension to make it work.

[msujew]

Well, combining input/output from the backend shell and Theia is always a bit more involved, as everything is running in separate processes. Gitpod (who were using Theia as their default IDE until April) used a custom Theia extension that send a notification to the frontend anytime a new port opens, which looks like this:

I imagine it doesn't make a whole lot of sense to implement this feature for certain scripts/apps. Rather, one should implement it on a container level for all ports.

[Tpuljak]

I already have an extension that does something like that, but I was wondering if something could be done to make it a bit more seamless like opening Chrome when React starts.

Is there a way to listen to input/output of the backend shell (on the backend of course)?

[msujew]

Sure, the TerminalServer.create method returns an id that can be fed into the ProcessManager to get the appropriate TerminalProcess. You can then follow up like in the TerminalBackendContribution:

theia/packages/terminal/src/node/terminal-backend-contribution.ts

Lines 35 to 40 in 0226158

	const termProcess = this.processManager.get(id);
	if (termProcess instanceof TerminalProcess) {
	const output = termProcess.createOutputStream();
	output.on('data', data => connection.sendNotification('onData', data.toString()));
	connection.onRequest('write', (data: string) => termProcess.write(data));
	connection.onClose(() => output.dispose());

[Tpuljak]

Nice. Thank you, I'll see if that's going to help my case or just do what Gitpod does 😄.