Output not visible while giving interactive inputs

[thequantumquirk]

When I try to execute any commands with interactive inputs like the next.js initialization command
It will not give me any outputs and just stay blank
But after I blindly select all the options it gives me all the outputs in the end as shown below:

Is there any way to fix it?

[ehmicky]

Hi @thequantumquirk,

Thanks for reaching out.
This is most likely not a bug with Execa, but a general question on TTYs.

For it to be considered a bug, would you be able to create a minimal reproduction example, with no external dependencies except Execa? Thanks.

[thequantumquirk]

Yeah I'll do it asap.

[thequantumquirk]

Hi @thequantumquirk,

Thanks for reaching out. This is most likely not a bug with Execa, but a general question on TTYs.

For it to be considered a bug, would you be able to create a minimal reproduction example, with no external dependencies except Execa? Thanks.

Here's the link of the repo: https://github.com/thequantumquirk/execa-test/

npm install
node index.js

After running this the console output will be blank
when you press enter several times
the command will complete and show the output at the end including the interactive interactive inputs

[ehmicky]

A process' stdout is controlled by the stdout option.

Relevant documentation links: process.stdout and stdout option.

It defaults to pipe, which means that process.stdout is set as a stream. With Execa, it also means the stdout result will be returned. It also means the process stdout is not redirected to the parent process. In other words, you (intentionally) do not see the process's output in the console.

It can be set to inherit to redirect the child process' stdout to the parent's instead, i.e. to see the output in the console.

await $({ stdout: 'inherit' })`npx create-next-app@latest my-app`;

Or:

const $$ = $({ stdout: 'inherit' });
await $$`npx create-next-app@latest my-app`;

However, you won't be able to retrieve the result anymore. If you want to do both, you'll need to do this:

const childProcess = $`npx create-next-app@latest my-app`;
childProcess.stdout.pipe(process.stdout);
const { stdout } = await childProcess

The behavior described above is not Execa-specific, this is how the child_process core module works. I.e. this is more a general support question about Node.js core behavior.

Please note that I am currently implementing #620, which will allow you, in the next release, to do this instead:

const { stdout } = await $({ stdout: ['pipe', 'inherit'] })`npx create-next-app@latest my-app`;

[thequantumquirk]

It can be set to inherit to redirect the child process' stdout to the parent's instead, i.e. to see the output in the console.

await $({ stdout: 'inherit' })`npx create-next-app@latest my-app`;

This works like charm.
I think this should be featured in the README and/or may be a separate in-depth example.
Shall I create another issue so that you can assign it to me and I'll write the documentation for that?

[ehmicky]

Thanks @thequantumquirk!

However, we are currently working on significant changes of the stdin/stdout/stderr options, which will influence that documentation (or might even potentially remove its need), so we should wait on that first.

[ehmicky]

You might want to check out Execa 9.0.0: release post and the changelog. In particular, the new ['pipe', 'inherit'] feature I mentioned above is now available. Also, the documentation for inputs and outputs has been improved, which should clarify the problems raised in this issue.