diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details.tsx
index 54f0fe8412551..dc5a2b2f3f62c 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/common/monitor_test_result/result_details.tsx
@@ -54,10 +54,10 @@ export const TimingDetails = ({ step }: { step: JourneyStep }) => {
) : (
),
};
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/common/network_data/data_formatting.ts b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/common/network_data/data_formatting.ts
index 8bb33235cc0b0..aa1a64d9eb447 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/common/network_data/data_formatting.ts
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/common/network_data/data_formatting.ts
@@ -491,9 +491,12 @@ export const colourPalette: ColourPalette = { ...TIMING_PALETTE, ...MIME_TYPE_PA
export const formatTooltipHeading = (index: number, fullText: string): string =>
isNaN(index) ? fullText : `${index}. ${fullText}`;
-export const formatMillisecond = (ms: number, maxMillis = 1000) => {
+export const formatMillisecond = (
+ ms: number,
+ { maxMillis = 1000, digits }: { digits?: number; maxMillis?: number }
+) => {
if (ms < maxMillis) {
- return `${ms.toFixed(digits??0)} ms`;
+ return `${ms.toFixed(digits ?? 0)} ms`;
}
return `${(ms / 1000).toFixed(digits ?? 1)} s`;
};
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/breakdown_legend.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/breakdown_legend.tsx
index 46c81f98198bc..6e2e0a144755c 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/breakdown_legend.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/breakdown_legend.tsx
@@ -32,7 +32,7 @@ export const BreakdownLegend = () => {
- {formatMillisecond(value)}
+ {formatMillisecond(value, {})}
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/network_timings_donut.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/network_timings_donut.tsx
index 439cc300afe4f..a65248c7fcc18 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/network_timings_donut.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_timing_breakdown/network_timings_donut.tsx
@@ -58,7 +58,7 @@ export const NetworkTimingsDonut = () => {
data={networkTimings.timingsWithLabels}
layout={PartitionLayout.sunburst}
valueAccessor={(d: Datum) => d?.value}
- valueFormatter={(d: number) => formatMillisecond(d)}
+ valueFormatter={(d: number) => formatMillisecond(d, {})}
layers={[
{
groupByRollup: (d: Datum) => d.label,
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_waterfall_chart/waterfall/waterfall_marker/waterfall_markers.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_waterfall_chart/waterfall/waterfall_marker/waterfall_markers.tsx
index ef5b02229fbd3..c1a8db93c3e6a 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_waterfall_chart/waterfall/waterfall_marker/waterfall_markers.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/step_details_page/step_waterfall_chart/waterfall/waterfall_marker/waterfall_markers.tsx
@@ -99,7 +99,7 @@ export function WaterfallChartMarkers() {
{
dataValue: offset,
details: label,
- header: formatMillisecond(offset, 4000),
+ header: formatMillisecond(offset, { maxMillis: 4000 }),
},
]}
marker={}