Show event context (#9198)

This adds a link to the detail view of discover rows to switch to a view of the documents immediately before and after the selected document. Since that view uses the timestamp field of the index pattern, it is only available for time-based indices.

See #9198 for detailed screenshots.

test/functional/apps/context/_discover_navigation.js

@@ -0,0 +1,54 @@
+import expect from 'expect.js';
+
+import { bdd, esClient } from '../../../support';
+import PageObjects from '../../../support/page_objects';
+
+
+const TEST_DISCOVER_START_TIME = '2015-09-19 06:31:44.000';
+const TEST_DISCOVER_END_TIME = '2015-09-23 18:31:44.000';
+const TEST_COLUMN_NAMES = ['@message'];
+
+bdd.describe('context link in discover', function contextSize() {
+  bdd.before(async function() {
+    await PageObjects.common.navigateToApp('discover');
+    await PageObjects.header.setAbsoluteRange(TEST_DISCOVER_START_TIME, TEST_DISCOVER_END_TIME);
+    await Promise.all(TEST_COLUMN_NAMES.map((columnName) => (
+      PageObjects.discover.clickFieldListItemAdd(columnName)
+    )));
+  });
+
+  bdd.it('should open the context view with the selected document as anchor', async function () {
+    const discoverDocTable = await PageObjects.docTable.getTable();
+    const firstRow = (await PageObjects.docTable.getBodyRows(discoverDocTable))[0];
+    const firstTimestamp = await (await PageObjects.docTable.getFields(firstRow))[0]
+      .getVisibleText();
+
+    // add a column in Discover
+    await (await PageObjects.docTable.getRowExpandToggle(firstRow)).click();
+    const firstDetailsRow = (await PageObjects.docTable.getDetailsRows(discoverDocTable))[0];
+    await (await PageObjects.docTable.getRowActions(firstDetailsRow))[0].click();
+
+    // check the column in the Context View
+    await PageObjects.common.try(async () => {
+      const contextDocTable = await PageObjects.docTable.getTable();
+      const anchorRow = await PageObjects.docTable.getAnchorRow(contextDocTable);
+      const anchorTimestamp = await (await PageObjects.docTable.getFields(anchorRow))[0]
+        .getVisibleText();
+      expect(anchorTimestamp).to.equal(firstTimestamp);
+    });
+  });
+
+  bdd.it('should open the context view with the same columns', async function () {
+    const docTable = await PageObjects.docTable.getTable();
+    await PageObjects.common.try(async () => {
+      const headerFields = await PageObjects.docTable.getHeaderFields(docTable);
+      const columnNames = await Promise.all(headerFields.map((headerField) => (
+        headerField.getVisibleText()
+      )));
+      expect(columnNames).to.eql([
+        'Time',
+        ...TEST_COLUMN_NAMES,
+      ]);
+    });
+  });
+});

test/functional/apps/context/_size.js

@@ -0,0 +1,63 @@
+import expect from 'expect.js';
+
+import { bdd, esClient } from '../../../support';
+import PageObjects from '../../../support/page_objects';
+
+
+const TEST_INDEX_PATTERN = 'logstash-*';
+const TEST_ANCHOR_TYPE = 'apache';
+const TEST_ANCHOR_ID = 'AU_x3_BrGFA8no6QjjaI';
+const TEST_DEFAULT_CONTEXT_SIZE = 7;
+const TEST_STEP_SIZE = 3;
+
+bdd.describe('context size', function contextSize() {
+  bdd.before(async function() {
+    await esClient.updateConfigDoc({
+      'context:defaultSize': `${TEST_DEFAULT_CONTEXT_SIZE}`,
+      'context:step': `${TEST_STEP_SIZE}`,
+    });
+  });
+
+  bdd.it('should default to the `context:defaultSize` setting', async function () {
+    await PageObjects.context.navigateTo(TEST_INDEX_PATTERN, TEST_ANCHOR_TYPE, TEST_ANCHOR_ID);
+
+    const docTable = await PageObjects.docTable.getTable();
+    await PageObjects.common.try(async function () {
+      expect(await PageObjects.docTable.getBodyRows(docTable)).to.have.length(2 * TEST_DEFAULT_CONTEXT_SIZE + 1);
+    });
+    await PageObjects.common.try(async function() {
+      const predecessorCountPicker = await PageObjects.context.getPredecessorCountPicker();
+      expect(await predecessorCountPicker.getProperty('value')).to.equal(`${TEST_DEFAULT_CONTEXT_SIZE}`);
+    });
+    await PageObjects.common.try(async function() {
+      const successorCountPicker = await PageObjects.context.getSuccessorCountPicker();
+      expect(await successorCountPicker.getProperty('value')).to.equal(`${TEST_DEFAULT_CONTEXT_SIZE}`);
+    });
+  });
+
+  bdd.it('should increase according to the `context:step` setting when clicking the `load newer` button', async function() {
+    await PageObjects.context.navigateTo(TEST_INDEX_PATTERN, TEST_ANCHOR_TYPE, TEST_ANCHOR_ID);
+
+    const docTable = await PageObjects.docTable.getTable();
+    await (await PageObjects.context.getPredecessorLoadMoreButton()).click();
+    await PageObjects.common.try(async function () {
+      expect(await PageObjects.docTable.getBodyRows(docTable)).to.have.length(
+        2 * TEST_DEFAULT_CONTEXT_SIZE + TEST_STEP_SIZE + 1
+      );
+    });
+  });
+
+  bdd.it('should increase according to the `context:step` setting when clicking the `load older` button', async function() {
+    await PageObjects.context.navigateTo(TEST_INDEX_PATTERN, TEST_ANCHOR_TYPE, TEST_ANCHOR_ID);
+
+    const docTable = await PageObjects.docTable.getTable();
+    const successorLoadMoreButton = await PageObjects.context.getSuccessorLoadMoreButton();
+    await this.remote.moveMouseTo(successorLoadMoreButton);  // possibly scroll until the button is visible
+    await successorLoadMoreButton.click();
+    await PageObjects.common.try(async function () {
+      expect(await PageObjects.docTable.getBodyRows(docTable)).to.have.length(
+        2 * TEST_DEFAULT_CONTEXT_SIZE + TEST_STEP_SIZE + 1
+      );
+    });
+  });
+});

test/functional/apps/context/index.js

@@ -0,0 +1,28 @@
+
+import {
+  bdd,
+  defaultTimeout,
+  elasticDump,
+  remote,
+  scenarioManager,
+} from '../../../support';
+
+import PageObjects from '../../../support/page_objects';
+
+bdd.describe('context app', function () {
+  this.timeout = defaultTimeout;
+
+  bdd.before(async function () {
+    await PageObjects.remote.setWindowSize(1200,800);
+    await scenarioManager.loadIfEmpty('logstashFunctional');
+    await elasticDump.elasticLoad('visualize','.kibana');
+    await PageObjects.common.navigateToApp('discover');
+  });
+
+  bdd.after(function unloadMakelogs() {
+    return scenarioManager.unload('logstashFunctional');
+  });
+
+  require('./_discover_navigation');
+  require('./_size');
+});