diff --git a/public/app/features/explore/Logs/LogsTable.test.tsx b/public/app/features/explore/Logs/LogsTable.test.tsx index 2b059941158..dc8665e810d 100644 --- a/public/app/features/explore/Logs/LogsTable.test.tsx +++ b/public/app/features/explore/Logs/LogsTable.test.tsx @@ -1,13 +1,23 @@ import { render, screen, waitFor } from '@testing-library/react'; import React, { ComponentProps } from 'react'; -import { FieldType, LogRowModel, LogsSortOrder, standardTransformersRegistry, toUtc } from '@grafana/data'; +import { DataFrame, FieldType, LogsSortOrder, standardTransformersRegistry, toUtc } from '@grafana/data'; import { organizeFieldsTransformer } from '@grafana/data/src/transformations/transformers/organize'; import { config } from '@grafana/runtime'; import { extractFieldsTransformer } from 'app/features/transformers/extractFields/extractFields'; import { LogsTable } from './LogsTable'; +jest.mock('@grafana/runtime', () => { + const actual = jest.requireActual('@grafana/runtime'); + return { + ...actual, + getTemplateSrv: () => ({ + replace: (val: string) => (val ? val.replace('$input', '10').replace('$window', '10s') : val), + }), + }; +}); + describe('LogsTable', () => { beforeAll(() => { const transformers = [extractFieldsTransformer, organizeFieldsTransformer]; @@ -25,7 +35,7 @@ describe('LogsTable', () => { }); }); - const getComponent = (partialProps?: Partial>, logs?: LogRowModel[]) => { + const getComponent = (partialProps?: Partial>, logs?: DataFrame) => { const testDataFrame = { fields: [ { @@ -69,12 +79,12 @@ describe('LogsTable', () => { to: toUtc('2019-01-01 16:00:00'), raw: { from: 'now-1h', to: 'now' }, }} - logsFrames={[testDataFrame]} + logsFrames={[logs ?? testDataFrame]} {...partialProps} /> ); }; - const setup = (partialProps?: Partial>, logs?: LogRowModel[]) => { + const setup = (partialProps?: Partial>, logs?: DataFrame) => { return render(getComponent(partialProps, logs)); }; @@ -130,4 +140,48 @@ describe('LogsTable', () => { expect(columns.length).toBe(0); }); }); + + it('should render a datalink for each row', async () => { + render( + getComponent( + {}, + { + fields: [ + { + config: {}, + name: 'Time', + type: FieldType.time, + values: ['2019-01-01 10:00:00', '2019-01-01 11:00:00', '2019-01-01 12:00:00'], + }, + { + config: {}, + name: 'line', + type: FieldType.string, + values: ['log message 1', 'log message 2', 'log message 3'], + }, + { + config: { + links: [ + { + url: 'http://example.com', + title: 'foo', + }, + ], + }, + name: 'link', + type: FieldType.string, + values: ['ts1', 'ts2', 'ts3'], + }, + ], + length: 3, + } + ) + ); + + await waitFor(() => { + const links = screen.getAllByRole('link'); + + expect(links.length).toBe(3); + }); + }); }); diff --git a/public/app/features/explore/Logs/LogsTable.tsx b/public/app/features/explore/Logs/LogsTable.tsx index f4a7c75d828..ebcb13dfc0a 100644 --- a/public/app/features/explore/Logs/LogsTable.tsx +++ b/public/app/features/explore/Logs/LogsTable.tsx @@ -72,9 +72,11 @@ export const LogsTable: React.FunctionComponent = (props) => { }); }; field.config = { + ...field.config, custom: { filterable: true, inspect: true, + ...field.config.custom, }, }; }