Move code

src/report/reporters/boxplot/main.js

@@ -1,7 +1,8 @@
+import { getCombNamePaddedColor } from '../../utils/name.js'
+
 import { getPositions, getBox, getLabels } from './content.js'
 import { getMinMaxAll } from './min_max.js'
 import { normalizeQuantiles } from './normalize.js'
-import { getCombinationTitles } from './titles.js'
 import { getWidths } from './width.js'
 
 // Reporter showing boxplot of measures (min, q1, median, q3, max)
@@ -41,7 +42,7 @@ const serializeBoxPlot = function ({
   contentWidth,
   mini,
 }) {
-  const combinationTitles = getCombinationTitles(combination)
+  const combinationTitles = getCombNamePaddedColor(combination)
 
   if (quantiles === undefined) {
     return getEmptyCombination(combinationTitles, mini)

src/report/reporters/boxplot/width.js

@@ -1,13 +1,14 @@
+import { getCombinationPaddedName } from '../../utils/name.js'
+
 import { addStatPadding } from './pad.js'
-import { getTitlesWidth } from './titles.js'
 
 // Retrieve the width of all blocks, in order:
 //  - Combination titles
 //  - Padding space reserved for the leftmost `min`
 //  - Content, i.e. box plot and their labels
 //  - Padding space reserved for the rightmost `max`
 export const getWidths = function (combinations, screenWidth, mini) {
-  const titlesWidth = getTitlesWidth(combinations)
+  const titlesWidth = getCombinationPaddedName(combinations[0]).length
   const minBlockWidth = getMinMaxBlockWidth(combinations, mini, 'min')
   const maxBlockWidth = getMinMaxBlockWidth(combinations, mini, 'max')
   const contentWidth = Math.max(

src/report/utils/name.js

@@ -1,4 +1,15 @@
 import { titleColor } from './colors.js'
+import { NAME_SEPARATOR, NAME_SEPARATOR_COLORED } from './separator.js'
+
+// Retrieve a combination's name with padding and color
+export const getCombNamePaddedColor = function (combination) {
+  return `${getCombinationNameColor(combination)}${NAME_SEPARATOR_COLORED}`
+}
+
+// Retrieve a combination's name with padding
+export const getCombinationPaddedName = function (combination) {
+  return `${getCombinationName(combination)}${NAME_SEPARATOR}`
+}
 
 // Retrieve the prettified combination name to used as a first column
 export const getCombinationNameColor = function (combination) {