[Support stdout updates] Every progress bar update occupies a new line

iSuslov commented 2 months ago

Verify canary release

[X] I verified that the issue exists in the latest Turborepo canary release.

Link to code that reproduces this issue

I provide shell script to reproduce

What package manager are you using / does the bug impact?

npm

What operating system are you using?

Mac

Which canary version will you have in your reproduction?

2.0.15-canary.3

Describe the Bug

When child script outputs progress bar, turborepo outputs every update of this progress bar as a new line.

In my example I'm using rsbuild that implements progress bar.


app:build: ●  ━━━━━━━━━━━━━━━━━━━━━━━━━ (0%) setup compilation                                                                                                                                                                                                 
 ●  ━━━━━━━━━━━━━━━━━━━━━━━━━ (8%) setup compilation                                                                                                                                                                                                 
 ●  ━━━━━━━━━━━━━━━━━━━━━━━━━ (8%) setup compilation                                                                                                                                                                                                 
 ●  ━━━━━━━━━━━━━━━━━━━━━━━━━ (9%) setup compilation                                                                                                                                                                                                 
 ●  ━━━━━━━━━━━━━━━━━━━━━━━━━ (0%) setup compilation                                                                                                                                                                                                 
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (0%) setup compilation                                                                                                                                                                                              
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (0%) make                                                                                                                                                                                                           
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (1%) make                                                                                                                                                                                                           
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (1%) building builtin:swc-loader??ruleSet[1].rules[2].use[0]!/Users/user/Projects/DeleteMe/_turborepo_sample/apps/app/src/index.tsx                                                                              
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (10%) building builtin:swc-loader??ruleSet[1].rules[2].use[0]!/Users/user/Projects/DeleteMe/_turborepo_sample/apps/app/src/index.tsx                                                                             
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (10%) building builtin:swc-loader??ruleSet[1].rules[2].use[0]!/Users/user/Projects/DeleteMe/_turborepo_sample/apps/app/src/App.tsx                                                                               
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (37%) building builtin:swc-loader??ruleSet[1].rules[2].use[0]!/Users/user/Projects/DeleteMe/_turborepo_sample/apps/app/src/App.tsx                                                                               
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (37%) building /Users/user/Projects/DeleteMe/node_modules/react-dom/client.js                                                                                                                                    
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (28%) building /Users/user/Projects/DeleteMe/node_modules/react-dom/client.js                                                                                                                                    
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (28%) building /Users/user/Projects/DeleteMe/node_modules/react/index.js                                                                                                                                         
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (21%) building /Users/user/Projects/DeleteMe/node_modules/react/index.js                                                                                                                                         
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (21%) building /Users/user/Projects/DeleteMe/node_modules/react/jsx-runtime.js                                                                                                                                   
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (21%) building /Users/user/Projects/DeleteMe/node_modules/react/jsx-runtime.js                                                                                                                                   
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (21%) building /Users/user/Projects/DeleteMe/node_modules/react/index.js                                                                                                                                         
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (32%) building /Users/user/Projects/DeleteMe/node_modules/react/index.js                                                                                                                                         
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (32%) building builtin:swc-loader??ruleSet[1].rules[2].use[0]!/Users/user/Projects/DeleteMe/_turborepo_sample/apps/app/src/App.tsx                                                                               
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (43%) building builtin:swc-loader??ruleSet[1].rules[2].use[0]!/Users/user/Projects/DeleteMe/_turborepo_sample/apps/app/src/App.tsx                                                                               
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (43%) building /Users/user/Projects/DeleteMe/node_modules/react/cjs/react.production.min.js                                                                                                                      
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (37%) building /Users/user/Projects/DeleteMe/node_modules/react/cjs/react.production.min.js                                                                                                                      
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (37%) building /Users/user/Projects/DeleteMe/node_modules/react/cjs/react-jsx-runtime.production.min.js                                                                                                          
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (48%) building /Users/user/Projects/DeleteMe/node_modules/@rspack/core/dist/builtin-plugin/css-extract/loader.js!commonjs|/Users/user/Projects/DeleteMe/node_modules/@rsbuild/core/compiled/css-loa            ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (50%) building commonjs|/Users/user/Projects/DeleteMe/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[1].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[1].use[2]!/Use            ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (52%) building commonjs|/Users/user/Projects/DeleteMe/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[1].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[1].use[2]!/Use            ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (56%) building /Users/user/Projects/DeleteMe/node_modules/@rspack/core/dist/builtin-plugin/css-extract/loader.js!commonjs|/Users/user/Projects/DeleteMe/node_modules/@rsbuild/core/compiled/css-loa            ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (70%) sealing module and chunk tree optimization                                                                                                                                                                    
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (70%) sealing after asset optimization                                                                                                                                                                              
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (70%) sealing after asset optimization                                                                                                                                                                              
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (70%) emitting emit                                                                                                                                                                                                 
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (98%) emitting emit                                                                                                                                                                                                 
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (98%) emitting after emit                                                                                                                                                                                           
 ● web ━━━━━━━━━━━━━━━━━━━━━━━━━ (100%) emitting after emit                                                                                                                                                                                          ready   Compiled in 0.17 s (web)
app:build: info    Production file sizes for web:
app:build:   app:build:   File                                    Size        Gzipped
app:build:   dist/static/css/index.cedcba3e.css      0.34 kB     0.25 kB
app:build:   dist/index.html                         0.37 kB     0.25 kB
app:build:   dist/static/js/index.7c507b3f.js        1.5 kB      0.82 kB
app:build:   dist/static/js/lib-react.29d1fe60.js    140.2 kB    45.0 kB
app:build:
app:build:   Total size:  142.4 kB
app:build:   Gzipped size:  46.4 kB
app:build:

Expected Behavior

Stdout update should be supported.

To Reproduce

npx create-turbo@latest -e with-shell-commands _reproduce -m npm && cd _reproduce && npm create rsbuild@latest -- -d ./apps/app -t react-ts && npm i && npx turbo build

Use this script which:

Creates turborepo template in ./_reproduce folder
In this repo it creates rsbuild application in ./_reproduce/apps/app
Installs node_modules and runs npx turbo build
Observe output

Additional context

No response

chris-olszewski commented 2 months ago

Please use the TUI if you wish to run a task with that uses ANSI codes to alter the terminal.

With the streamed log output, there is no good way for us to prevent/modify underlying task ANSI instructions from changing the incorrect part of the terminal. The TUI was built for the purpose of providing a contained section of the terminal that would only contain the output of a single task.

iSuslov commented 2 months ago

For future reference: I tried "tui" without success.

chris-olszewski commented 2 months ago

I think I see the issue, it appears that rspack adds enough trailing spaces in the progress bar output the fill the current line:

● ESC[1mESC[0m ESC[32mESC[37mESC[2m━━━━━━━━━━━━━━━━━━━━━━━━━ESC[0mESC[0m (0%) ESC[2msetup compilation                                                                                                                                           ESC[0m^MESC[2K

The ESC[2K operation at the erases the current line, but if the trailing spaces have caused the line to wrap, it won't erase the intended line instead just the line overflow. This probably indicates we have a mismatch in the PTY dimensions and the virtual terminal dimensions so rspack is outputting too many spaces for the terminal.

I'll look at making sure the underlying PTY has the exact same dimensions as the virtual terminal.

vercel / turborepo