diff --git a/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/MetricsModal.test.tsx b/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/MetricsModal.test.tsx index ca0c28916c3..d314a7b6d70 100644 --- a/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/MetricsModal.test.tsx +++ b/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/MetricsModal.test.tsx @@ -187,6 +187,38 @@ describe('MetricsModal', () => { expect(metricABucket).toBeInTheDocument(); }); }); + + // native histograms are given a custom type. + // They are histograms but are given the type 'native histogram' + // to distinguish then from old histograms. + it('displays a type for a native histogram', async () => { + setup(defaultQuery, listOfMetrics); + await waitFor(() => { + expect(screen.getByText('new_histogram')).toBeInTheDocument(); + }); + + expect(screen.getByText('native histogram')).toBeInTheDocument(); + }); + + it('has a filter for selected type', async () => { + setup(defaultQuery, listOfMetrics); + + const selectType = screen.getByText('Filter by type'); + + await userEvent.click(selectType); + + const nativeHistogramOption = await screen.getByText('Native histograms are different', { exact: false }); + + await userEvent.click(nativeHistogramOption); + + const classicHistogram = await screen.queryByText('a_bucket'); + + expect(classicHistogram).toBeNull(); + + const nativeHistogram = await screen.getByText('new_histogram'); + + expect(nativeHistogram).toBeInTheDocument(); + }); }); const defaultQuery: PromVisualQuery = { @@ -195,7 +227,21 @@ const defaultQuery: PromVisualQuery = { operations: [], }; -const listOfMetrics: string[] = ['all-metrics', 'a_bucket', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']; +const listOfMetrics: string[] = [ + 'all-metrics', + 'a_bucket', + 'new_histogram', + 'a', + 'b', + 'c', + 'd', + 'e', + 'f', + 'g', + 'h', + 'i', + 'j', +]; function createDatasource(withLabels?: boolean) { const languageProvider = new EmptyLanguageProviderMock() as unknown as PromQlLanguageProvider; @@ -220,9 +266,13 @@ function createDatasource(withLabels?: boolean) { help: 'a-metric-help', }, a_bucket: { - type: 'counter', + type: 'histogram', help: 'for functions', }, + new_histogram: { + type: 'histogram', + help: 'a native histogram', + }, // missing metadata for other metrics is tested for, see below }; } diff --git a/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/state/helpers.ts b/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/state/helpers.ts index 19d016eafd0..393b6b3a4ca 100644 --- a/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/state/helpers.ts +++ b/packages/grafana-prometheus/src/querybuilder/components/metrics-modal/state/helpers.ts @@ -74,6 +74,12 @@ function buildMetricData(metric: string, datasource: PrometheusDatasource): Metr } }); + const oldHistogramMatch = metric.match(/^\w+_bucket$|^\w+_bucket{.*}$/); + + if (type === 'histogram' && !oldHistogramMatch) { + type = 'native histogram'; + } + const metricData: MetricData = { value: metric, type: type, @@ -237,6 +243,11 @@ export const promTypes: PromFilterOption[] = [ description: 'A histogram samples observations (usually things like request durations or response sizes) and counts them in configurable buckets.', }, + { + value: 'native histogram', + description: + 'Native histograms are different from classic Prometheus histograms in a number of ways: Native histogram bucket boundaries are calculated by a formula that depends on the scale (resolution) of the native histogram, and are not user defined.', + }, { value: 'summary', description: