1

I am trying to get colorful console for Nativescript application for debugging mode. When we use

tns debug android/ios

We get a URL to use in chrome for debugging like this

chrome-devtools://devtools/bundled/inspector.html?experiments=true&ws=localhost:40000

I have tried few suggestion as listed here to use CSS in console e.g.

const warningTitleCSS = 'color:red; font-size:60px; font-weight: bold; -webkit-text-stroke: 1px black;';
console.log('%cStop!', warningTitleCSS);

but it simply prints

%cStop! color:red; font-size:60px; font-weight: bold; -webkit-text-stroke: 1px black;

is it something related to chrome debug tools or am I trying something wrong here? enter image description here

Narendra
  • 4,264
  • 2
  • 17
  • 35
  • You're missing a space between %c and Stop – Daniel Tate Oct 09 '18 at 23:55
  • I have tried console.log('%c Oh my heavens! ', 'background: #222; color: #bada55'); with space after %c and it is simply printing %c Oh my heavens! background: #222; color: #bada55 – Narendra Oct 09 '18 at 23:57
  • Are you actually doing this in chrome or an emulated android or IOS browser? I just tried this on chrome and it works... I literally copy pasted your code into the browser console... – Daniel Tate Oct 10 '18 at 00:01
  • I am doing this in chrome. – Narendra Oct 10 '18 at 00:03
  • open your devtools and try this does it work there? – Daniel Tate Oct 10 '18 at 00:04
  • Yes, it works if I copy and paste same code in devtools in console but it does not work if I paste in chrome-devtools console. I have share that screenshot in question Looks like chrome-devtools:// issue. – Narendra Oct 10 '18 at 00:05
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/181579/discussion-between-daniel-tate-and-narendra). – Daniel Tate Oct 10 '18 at 00:09

1 Answers1

1

The NativeScript console is actually an implementation of the native logs (e.g. the LogCat for Android). The console.log is a stub JS class which actual implementation is overwritten in the native projects. So it does not have much in common with the Chrome console and this said - the NativeScript console is not supporting the CSS properties.

Note: the option to apply colors is logged as a feature here

Nick Iliev
  • 9,295
  • 2
  • 31
  • 85