ANSI colors break gatsby develop output on Linux

[Mithgarthsormr]

Hello,
I've got a problem with gatsby develop. In November it worked properly but now the output on the console seems wrong (as you see on the screenshot).

Steps to reproduce:

1. Set up a new gatsby page, I've used this instruction to make sure the page is minimal: https://www.gatsbyjs.com/docs/using-gatsby-professionally/setting-up-gatsby-without-gatsby-new/
2. try gatsby develop, it will work this time
3. Add a minimal gatsby-config.js file like this:
   module.exports = {
   plugins: [
   ],
   }
4. try gatsby develop again, the outcome should be the same as on the screenshot.

The development mode itself does work, but the logging on the console doesn't.

By the way, I'm working on Ubuntu 20.04 if this makes a difference.

edit:
Using an existing git repo seems to trigger this issue, too. Without the git repo it now seems to work after updating gatsby-cli, But after I clone a git repo it doesn't.

[ishan-biztech]

Same issue with me. I'm converting an existing application from create-react-app to gatsby, but seems like output is not showing in console, whereas when navigating to http://localhost:8000/, the site works fine.

In addition, there's also few 404 errors showing in console "GET http://localhost:8000/page-data/404.html/page-data.json"

P.S. I'm on Ubuntu 20.04.1 LTS

[LekoArts]

I can't reproduce this on my terminals on Windows, WSL or Mac. If you use the mouse to highlight text, do you see any text?

Maybe your CLI colors are set up incorrectly. Anyways, we'll need more information on how to reproduce this.

[Mithgarthsormr]

Nope, still nothing.

[ascorbic]

Could you try disabling colors like so:

FORCE_COLOR=0 gatsby develop

[ishan-biztech]

Thanks @ascorbic, that worked for me. Do you know the issue? Will it be fixed in next release?

[Mithgarthsormr]

@ascorbic: Thanks a lot, this worked for me, too!

[ascorbic]

Great! No, this isn't a known issue, so we would need to work out the cause. Could you both share details of your platform, terminal etc and if you have cusotm terminal fonts for example

[Mithgarthsormr]

This is the current project I'm working on, but the problem happened with much less packages. With an older git repo combined with a new gatsby page, it happened even with an empty gatsby-config.js file.

System:
OS: Linux 5.8 Ubuntu 20.04.2 LTS (Focal Fossa)
CPU: (4) x64 Intel(R) Core(TM) i5-6300U CPU @ 2.40GHz
Shell: 5.0.17 - /bin/bash
Binaries:
Node: 12.18.3 - ~/.nvm/versions/node/v12.18.3/bin/node
npm: 6.14.11 - ~/.nvm/versions/node/v12.18.3/bin/npm
Browsers:
Firefox: 85.0.1
npmPackages:
gatsby: ^2.32.3 => 2.32.3
gatsby-image: ^2.11.0 => 2.11.0
gatsby-plugin-manifest: ^2.12.0 => 2.12.0
gatsby-plugin-material-ui: ^2.1.10 => 2.1.10
gatsby-plugin-matomo: ^0.9.0 => 0.9.0
gatsby-plugin-mdx: ^1.10.0 => 1.10.0
gatsby-plugin-offline: ^3.10.0 => 3.10.0
gatsby-plugin-page-creator: ^2.10.0 => 2.10.0
gatsby-plugin-react-helmet: ^3.10.0 => 3.10.0
gatsby-plugin-sass: ^3.2.0 => 3.2.0
gatsby-plugin-sharp: ^2.14.1 => 2.14.1
gatsby-source-filesystem: ^2.11.0 => 2.11.0
gatsby-transformer-sharp: ^2.12.0 => 2.12.0
npmGlobalPackages:
gatsby-cli: 2.19.1
gatsby: 2.31.1

[aaronkai]

I'm seeing this error as well.

I'm not in ubuntu, but Fedora 33. Regular gterm terminal. I am using oh-my-zsh and custom terminal font MesloLGS NF with zsh theme ZSH_THEME="powerlevel10k/powerlevel10k"

Running FORCE_COLOR=0 gatsby develop worked for me.

[pieh]

I could repro on ubuntu in virtual machine:

As a temporary workaround you can use GATSBY_LOGGER=yurnalist gatsby develop (that logger seem unaffected):

It seems to be caused by usage of terminal-link here in combination with our default logger (ink) in some terminals

gatsby/packages/gatsby/src/utils/handle-flags.ts

Line 136 in 4638cd6

message += ` · (${terminalLink(`Umbrella Issue`, flag.umbrellaIssue)})`

Will remove the use of terminal-link tomorrow - it's not critical to have nice links that it produces if it cause issues like that in some terminals

[Mithgarthsormr]

@pieh: Thanks a lot! This should do until the bug is fixed!

[ascorbic]

Fixed in [email protected]