BrowserSync / browser-sync

Keep multiple browsers & devices in sync when building websites. https://browsersync.io
https://discord.gg/2d2xUThp
Apache License 2.0
12.14k stars 754 forks source link

bug(ansi): X11 color names in console #2060

Open Kristinita opened 5 months ago

Kristinita commented 5 months ago

1. Summary

Browsersync prints X11 color names to console.

2. MCVE

2.1. Reproducibility

  1. I reproduce this problem for command prompt (cmd.exe), ConEmu + Far Manager and Cygwin terminals on my local machine.
  2. I reproduce the problem on CI services. See my Travis CI build and AppVeyor CI build.

2.2. CLI commands

npm install --global browser-sync

browser-sync --logLevel debug --no-open .

2.3. Behavior

2.3.1. Current

cyan and magenta in strings like {cyan:port} or {magenta:http}.

See parts of my Travis build and AppVeyor build:

[Browsersync] [debug] -> Starting Step: Finding an empty port

[Browsersync] [debug] Found a free port: 3000

[Browsersync] [debug] Setting Option: {cyan:port} - {magenta:3000

[Browsersync] [debug] +  Step Complete: Finding an empty port

[Browsersync] [debug] -> Starting Step: Getting an extra port for Proxy

[Browsersync] [debug] +  Step Complete: Getting an extra port for Proxy

[Browsersync] [debug] -> Starting Step: Checking online status

[Browsersync] [debug] Resolved www.google.com, setting online: true

[Browsersync] [debug] Setting Option: {cyan:online} - {magenta:true

[Browsersync] [debug] +  Step Complete: Checking online status

[Browsersync] [debug] -> Starting Step: Resolve user plugins from options

[Browsersync] [debug] +  Step Complete: Resolve user plugins from options

[Browsersync] [debug] -> Starting Step: Set Urls and other options that rely on port/online status

[Browsersync] [debug] Setting multiple Options

[Browsersync] [debug] +  Step Complete: Set Urls and other options that rely on port/online status

[Browsersync] [debug] -> Starting Step: Setting Internal Events

[Browsersync] [debug] +  Step Complete: Setting Internal Events

[Browsersync] [debug] -> Starting Step: Setting file watchers

[Browsersync] [debug] +  Step Complete: Setting file watchers

[Browsersync] [debug] -> Starting Step: Merging middlewares from core + plugins

[Browsersync] [debug] Setting Option: {cyan:middleware} - {magenta:List []

[Browsersync] [debug] +  Step Complete: Merging middlewares from core + plugins

[Browsersync] [debug] -> Starting Step: Starting the Server

[Browsersync] [debug] Static Server running ({magenta:http}) …

[Browsersync] [debug] Running mode: SERVER

[Browsersync] [debug] +  Step Complete: Starting the Server

[Browsersync] [debug] -> Starting Step: Starting the HTTPS Tunnel

[Browsersync] [debug] +  Step Complete: Starting the HTTPS Tunnel

[Browsersync] [debug] -> Starting Step: Starting the web-socket server

[Browsersync] [debug] Setting Option: {cyan:clientEvents} - {magenta:List [ "scroll", "scroll:element", "input:text", "input:toggles", "form:submit", "form:reset", "click" ]

[Browsersync] [debug] +  Step Complete: Starting the web-socket server

[Browsersync] [debug] -> Starting Step: Starting the UI

[Browsersync] [debug] Setting Option: {cyan:session} - {magenta:1706334118539

[Browsersync] [UI] Starting Step: Setting default plugins

[Browsersync] [UI] Step Complete: %s Setting default plugins

[Browsersync] [UI] Starting Step: Finding a free port

[Browsersync] [UI] Step Complete: %s Finding a free port

[Browsersync] [UI] Starting Step: Setting options also relevant to UI from BS

[Browsersync] [UI] Step Complete: %s Setting options also relevant to UI from BS

[Browsersync] [UI] Starting Step: Setting available URLS for UI

[Browsersync] [debug] Getting option via path: {magenta:[ 'urls' ]

[Browsersync] [UI] Step Complete: %s Setting available URLS for UI

[Browsersync] [UI] Starting Step: Starting the Control Panel Server

[Browsersync] [UI] Using port 3001

[Browsersync] [UI] Step Complete: %s Starting the Control Panel Server

[Browsersync] [UI] Starting Step: Add element events

[Browsersync] [UI] Step Complete: %s Add element events

[Browsersync] [UI] Starting Step: Registering default plugins

[Browsersync] [UI] Step Complete: %s Registering default plugins

[Browsersync] [UI] Starting Step: Add options setting event

[Browsersync] [UI] Step Complete: %s Add options setting event

[Browsersync] [debug] +  Step Complete: Starting the UI

[Browsersync] [debug] -> Starting Step: Merge UI settings

[Browsersync] [debug] Setting Option: {cyan:urls} - {magenta:Map { "local": "http://localhost:3000", "external": "http://10.30.0.46:3000", "ui": "http://localhost:3001", "ui-external": "http://10.30.0.46:3001" }

[Browsersync] [debug] +  Step Complete: Merge UI settings

[Browsersync] [debug] -> Starting Step: Init user plugins

[Browsersync] [debug] Setting Option: {cyan:userPlugins} - {magenta:

[Browsersync] [debug] +  Step Complete: Init user plugins

[Browsersync] Access URLs:

 -----------------------------------

       Local: http://localhost:3000

    External: http://10.30.0.46:3000

 -----------------------------------

          UI: http://localhost:3001

 UI External: http://10.30.0.46:3001

 -----------------------------------

[Browsersync] Serving files from: /home/travis/build/Kristinita/SashaTravis
2.3.2. Expected

I’m guessing that instead of X11 color names, Browsersync should print colored strings. Examples:

$\textcolor{cyan}{\textsf{port}}$ instead of {cyan:port} $\textcolor{magenta}{\textsf{http}}$ instead of {magenta:http}

3. Environment

  1. Operating system:

    1. Local — Windows 11 [Version 10.0.22621.2861]
    2. Travis — Ubuntu 22.04.3 LTS Jammy Jellyfish
    3. AppVeyor — Windows Server 2019
  2. Terminals:

    1. Default Windows command prompt (cmd.exe) and default Travis and AppVeyor online consoles
    2. Local — ConEmu 230724 [64] + Far Manager, version 3.0.5858.0 x64
    3. Local — Cygwin 3.4.8-1.x86_64
  3. Node.js v21.6.1

  4. browser-sync 3.0.2

Thanks.