KPC
Kevin Powell - Community•2y ago
denertog

padEnd not padding equally among multiple lines

Why would this code generate the screenshotted output (not printing directly below HeroicFeats but one indent (tab) less? 
return `${"Sanctuary".padEnd(15, ' ')}\t\tHeroicFeats
----------------
${this.sanctuary.pools[0].toString().padEnd(15, ' ')}\t\t${this.heroicFeats.platforms[0]}
return `${"Sanctuary".padEnd(15, ' ')}\t\tHeroicFeats
----------------
${this.sanctuary.pools[0].toString().padEnd(15, ' ')}\t\t${this.heroicFeats.platforms[0]}
3 Replies
denertog
denertogOP•2y ago
never mind, this.sanctuary.pools[0].toString() makes use of chalkmethods (https://github.com/chalk/chalk) which doens't support String.prototype methods, so I'm assuming it's output doesn't either
GitHub
GitHub - chalk/chalk: 🖍 Terminal string styling done right
🖍 Terminal string styling done right. Contribute to chalk/chalk development by creating an account on GitHub.
WebMechanic
WebMechanic•2y ago
put the output in a template string first and use your string methods on the result, i.e. 
`${this.sanctuary.pools[0]}`
  .padEnd(15, ' ')
  .concat(`\t\t${this.heroicFeats.platforms[0]}`);
`${this.sanctuary.pools[0]}`
  .padEnd(15, ' ')
  .concat(`\t\t${this.heroicFeats.platforms[0]}`);
the output also contains ANSI color sequences which add to the overall string's length but vanish when rendered on the console so it might be "too long" to allow padding with these color sequences still inside. "\x1b[34mHi\x1b[0m" becomes a coloured Hi
denertog
denertogOP•2y ago
Yeah, fixed it by calculating the length of the unstyled string and then add the padding myself with a utility method. The original string needs different colors at the same time, so coloring afterwards is not an option

Did you find this page helpful?