diff --git a/x-pack/legacy/plugins/reporting/public/components/__snapshots__/report_listing.test.tsx.snap b/x-pack/legacy/plugins/reporting/public/components/__snapshots__/report_listing.test.tsx.snap new file mode 100644 index 0000000000000..80a471795e360 --- /dev/null +++ b/x-pack/legacy/plugins/reporting/public/components/__snapshots__/report_listing.test.tsx.snap @@ -0,0 +1,609 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`ReportListing Report job listing with some items 1`] = ` +Array [ + +
+
+ +
+ +
+ +
+ + +
+ +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+ + Report + +
+
+
+ + Created at + +
+
+
+ + Status + +
+
+
+ + Actions + +
+
+
+ + Loading reports + +
+
+
+
+ +
+ +
+ + + +
+ +
+ + +
+ + + +
+
+
+ + +
+ +
+ , +
+
+ +
+ +
+ +
+ + +
+ +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+
+ + Report + +
+
+
+ + Created at + +
+
+
+ + Status + +
+
+
+ + Actions + +
+
+
+ + Loading reports + +
+
+
+
+ +
+ +
+ + + +
+ +
+ + +
+ + + +
+
+
+ + +
+ +
, +] +`; diff --git a/x-pack/legacy/plugins/reporting/public/components/report_info_button.test.mocks.ts b/x-pack/legacy/plugins/reporting/public/components/report_info_button.test.mocks.ts index 7f1392cb2a49a..9dd7cbb5fc567 100644 --- a/x-pack/legacy/plugins/reporting/public/components/report_info_button.test.mocks.ts +++ b/x-pack/legacy/plugins/reporting/public/components/report_info_button.test.mocks.ts @@ -4,5 +4,5 @@ * you may not use this file except in compliance with the Elastic License. */ -export const mockJobQueueClient = { getInfo: jest.fn() }; +export const mockJobQueueClient = { list: jest.fn(), total: jest.fn(), getInfo: jest.fn() }; jest.mock('../lib/job_queue_client', () => ({ jobQueueClient: mockJobQueueClient })); diff --git a/x-pack/legacy/plugins/reporting/public/components/report_info_button.tsx b/x-pack/legacy/plugins/reporting/public/components/report_info_button.tsx index 28db93a910439..52dd1071deaa4 100644 --- a/x-pack/legacy/plugins/reporting/public/components/report_info_button.tsx +++ b/x-pack/legacy/plugins/reporting/public/components/report_info_button.tsx @@ -35,15 +35,11 @@ interface State { const NA = 'n/a'; const UNKNOWN = 'unknown'; -const getDimensions = (info: JobInfo) => { +const getDimensions = (info: JobInfo): string => { const defaultDimensions = { width: null, height: null }; const { width, height } = get(info, 'payload.layout.dimensions', defaultDimensions); if (width && height) { - return ( - - Width: {width} x Height: {height} - - ); + return `Width: ${width} x Height: ${height}`; } return NA; }; @@ -77,8 +73,21 @@ export class ReportInfoButton extends Component { const jobType = info.jobtype || NA; - // TODO queue method (clicked UI, watcher, etc) - const jobInfoParts = { + interface JobInfo { + title: string; + description: string; + } + + interface JobInfoMap { + [thing: string]: JobInfo[]; + } + + const attempts = info.attempts ? info.attempts.toString() : NA; + const maxAttempts = info.max_attempts ? info.max_attempts.toString() : NA; + const priority = info.priority ? info.priority.toString() : NA; + const timeout = info.timeout ? info.timeout.toString() : NA; + + const jobInfoParts: JobInfoMap = { datetimes: [ { title: 'Created By', @@ -105,21 +114,21 @@ export class ReportInfoButton extends Component { }, { title: 'Browser Timezone', - description: info.payload.browserTimezone || NA, + description: get(info, 'payload.browserTimezone') || NA, }, ], payload: [ { title: 'Title', - description: info.payload.title || NA, + description: get(info, 'payload.title') || NA, }, { title: 'Type', - description: info.payload.type || NA, + description: get(info, 'payload.type') || NA, }, { title: 'Layout', - description: info.meta.layout || NA, + description: get(info, 'meta.layout') || NA, }, { title: 'Dimensions', @@ -131,29 +140,29 @@ export class ReportInfoButton extends Component { }, { title: 'Content Type', - description: info.output.content_type || NA, + description: get(info, 'output.content_type') || NA, }, { title: 'Size in Bytes', - description: info.output.size || NA, + description: get(info, 'output.size') || NA, }, ], status: [ { title: 'Attempts', - description: info.attempts || NA, + description: attempts, }, { title: 'Max Attempts', - description: info.max_attempts || NA, + description: maxAttempts, }, { title: 'Priority', - description: info.priority || NA, + description: priority, }, { title: 'Timeout', - description: info.timeout || NA, + description: timeout, }, { title: 'Status', diff --git a/x-pack/legacy/plugins/reporting/public/components/report_listing.test.tsx b/x-pack/legacy/plugins/reporting/public/components/report_listing.test.tsx new file mode 100644 index 0000000000000..87360efe04e8b --- /dev/null +++ b/x-pack/legacy/plugins/reporting/public/components/report_listing.test.tsx @@ -0,0 +1,77 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +interface JobData { + _index: string; + _id: string; + _source: { + browser_type: string; + created_at: string; + jobtype: string; + created_by: string; + payload: { + type: string; + title: string; + }; + kibana_name?: string; // undefined if job is pending (not yet claimed by an instance) + kibana_id?: string; // undefined if job is pending (not yet claimed by an instance) + output?: { content_type: string; size: number }; // undefined if job is incomplete + completed_at?: string; // undefined if job is incomplete + }; +} + +jest.mock('ui/chrome', () => ({ + getInjected() { + return { + jobsRefresh: { + interval: 10, + intervalErrorMultiplier: 2, + }, + }; + }, +})); + +jest.mock('ui/kfetch', () => ({ + kfetch: ({ pathname }: { pathname: string }): Promise => { + if (pathname === '/api/reporting/jobs/list') { + return Promise.resolve([ + { _index: '.reporting-2019.08.18', _id: 'jzoik8dh1q2i89fb5f19znm6', _source: { payload: { layout: { id: 'preserve_layout', dimensions: { width: 1635, height: 792 } }, type: 'dashboard', title: 'Names', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:24.869Z', jobtype: 'printable_pdf', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoik7tn1q2i89fb5f60e5ve', _score: null, _source: { payload: { layout: { id: 'preserve_layout', dimensions: { width: 1635, height: 792 } }, type: 'dashboard', title: 'Names', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:24.155Z', jobtype: 'printable_pdf', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoik5tb1q2i89fb5fckchny', _score: null, _source: { payload: { layout: { id: 'png', dimensions: { width: 1898, height: 876 } }, title: 'cool dashboard', type: 'dashboard', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:21.551Z', jobtype: 'PNG', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoik5a11q2i89fb5f130t2m', _score: null, _source: { payload: { layout: { id: 'png', dimensions: { width: 1898, height: 876 } }, title: 'cool dashboard', type: 'dashboard', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:20.857Z', jobtype: 'PNG', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoik3ka1q2i89fb5fdx93g7', _score: null, _source: { payload: { layout: { id: 'preserve_layout', dimensions: { width: 1898, height: 876 } }, type: 'dashboard', title: 'cool dashboard', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:18.634Z', jobtype: 'printable_pdf', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoik2vt1q2i89fb5ffw723n', _score: null, _source: { payload: { layout: { id: 'preserve_layout', dimensions: { width: 1898, height: 876 } }, type: 'dashboard', title: 'cool dashboard', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:17.753Z', jobtype: 'printable_pdf', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoik1851q2i89fb5fdge6e7', _score: null, _source: { payload: { layout: { id: 'preserve_layout', dimensions: { width: 1080, height: 720 } }, type: 'canvas workpad', title: 'My Canvas Workpad - Dark', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:15.605Z', jobtype: 'printable_pdf', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoijyre1q2i89fb5fa7xzvi', _score: null, _source: { payload: { type: 'dashboard', title: 'tests-panels', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:12.410Z', jobtype: 'printable_pdf', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jzoijv5h1q2i89fb5ffklnhx', _score: null, _source: { payload: { type: 'dashboard', title: 'tests-panels', }, max_attempts: 3, browser_type: 'chromium', created_at: '2019-08-23T19:34:07.733Z', jobtype: 'printable_pdf', created_by: 'elastic', attempts: 0, status: 'pending', }, }, // prettier-ignore + { _index: '.reporting-2019.08.18', _type: '_doc', _id: 'jznhgk7r1bx789fb5f6hxok7', _score: null, _source: { kibana_name: 'spicy.local', browser_type: 'chromium', created_at: '2019-08-23T02:15:47.799Z', jobtype: 'printable_pdf', created_by: 'elastic', kibana_id: 'ca75e26c-2b7d-464f-aef0-babb67c735a0', output: { content_type: 'application/pdf', size: 877114 }, completed_at: '2019-08-23T02:15:57.707Z', payload: { type: 'dashboard (legacy)', title: 'tests-panels', }, max_attempts: 3, started_at: '2019-08-23T02:15:48.794Z', attempts: 1, status: 'completed', }, }, // prettier-ignore + ]); + } + + // query for jobs count + return Promise.resolve(18); + }, +})); + +import React from 'react'; +import { mountWithIntl } from 'test_utils/enzyme_helpers'; +import { ReportListing } from './report_listing'; + +describe('ReportListing', () => { + it('Report job listing with some items', () => { + const wrapper = mountWithIntl( + + ); + wrapper.update(); + const input = wrapper.find('[data-test-subj="reportJobListing"]'); + expect(input).toMatchSnapshot(); + }); +}); diff --git a/x-pack/legacy/plugins/reporting/public/components/report_listing.tsx b/x-pack/legacy/plugins/reporting/public/components/report_listing.tsx index 673e371da5331..1a75b65f70eb4 100644 --- a/x-pack/legacy/plugins/reporting/public/components/report_listing.tsx +++ b/x-pack/legacy/plugins/reporting/public/components/report_listing.tsx @@ -315,6 +315,7 @@ class ReportListingUi extends Component { } pagination={pagination} onChange={this.onTableChange} + data-test-subj="reportJobListing" /> ); }