diff --git a/src/alignSpanningCell.ts b/src/alignSpanningCell.ts index 990fa71..7581206 100644 --- a/src/alignSpanningCell.ts +++ b/src/alignSpanningCell.ts @@ -1,3 +1,4 @@ +import stringWidth from 'string-width'; import { alignString, } from './alignString'; @@ -58,7 +59,7 @@ export const alignVerticalRangeContent = (range: RangeConfig, content: string[], return padCellVertically(content, availableRangeHeight, verticalAlignment).map((line) => { if (line.length === 0) { - return ' '.repeat(content[0].length); + return ' '.repeat(stringWidth(content[0])); } return line; diff --git a/test/alignSpanningCell.ts b/test/alignSpanningCell.ts index 45975d7..f2c8e42 100644 --- a/test/alignSpanningCell.ts +++ b/test/alignSpanningCell.ts @@ -1,6 +1,7 @@ import { expect, } from 'chai'; +import chalk from 'chalk'; import { alignVerticalRangeContent, wrapRangeContent, @@ -267,4 +268,34 @@ describe('alignVerticalRangeContent', () => { ]); }); }); + + it('with ansi string', () => { + const result = alignVerticalRangeContent(baseRangeConfig, [ + ` ${chalk.red('ECMAScript')} (or ES) `, + ' is a ', + ' general-purpose ', + ' programming ', + ' language, ', + ' standardised by ', + ` ${chalk.bgGreen('Ecma')} ${chalk.bold.blue('International')} `, + ' according to the ', + ' document ECMA-262. ', + ], {...baseSpanningCellContext, + rowHeights: [12]}); + + expect(result).to.deep.equal([ + ` ${chalk.red('ECMAScript')} (or ES) `, + ' is a ', + ' general-purpose ', + ' programming ', + ' language, ', + ' standardised by ', + ` ${chalk.bgGreen('Ecma')} ${chalk.bold.blue('International')} `, + ' according to the ', + ' document ECMA-262. ', + ' ', + ' ', + ' ', + ]); + }); });