Show multi Events in one stream

frontend/integration-tests/protractor.conf.ts

@@ -58,6 +58,7 @@ const testSuites = {
     'tests/modal-annotations.scenario.ts',
     'tests/environment.scenario.ts',
   ]),
+  event: suite(['tests/event.scenario.ts']),
   crudBasic: suite(['tests/crud.scenario.ts']),
   monitoring: suite(['tests/monitoring.scenario.ts']),
   newApp: suite(['tests/overview/overview.scenario.ts', 'tests/deploy-image.scenario.ts']),
@@ -93,6 +94,7 @@ const testSuites = {
     'tests/crd-extensions.scenario.ts',
     'tests/oauth.scenario.ts',
     'tests/devconsole/pipeline.scenario.ts',
+    'tests/event.scenario.ts',
   ]),
   release: suite([
     'tests/crud.scenario.ts',
@@ -104,6 +106,7 @@ const testSuites = {
     'tests/performance.scenario.ts',
     'tests/monitoring.scenario.ts',
     'tests/crd-extensions.scenario.ts',
+    'tests/event.scenario.ts',
   ]),
   all: suite([
     'tests/crud.scenario.ts',
@@ -123,6 +126,7 @@ const testSuites = {
     'tests/devconsole/pipeline.scenario.ts',
     'tests/crd-extensions.scenario.ts',
     'tests/oauth.scenario.ts',
+    'tests/event.scenario.ts',
   ]),
   clusterSettings: suite(['tests/cluster-settings.scenario.ts']),
   alertmanager: suite(['tests/alertmanager.scenario.ts']),

frontend/integration-tests/tests/event.scenario.ts

@@ -0,0 +1,53 @@
+import { browser, $, element, by, ExpectedConditions as until } from 'protractor';
+import { appHost, checkLogs, checkErrors, testName } from '../protractor.conf';
+import { execSync } from 'child_process';
+
+describe('Events', () => {
+  const name = `${testName}-pod`;
+  const testpod = {
+    apiVersion: 'v1',
+    kind: 'Pod',
+    metadata: {
+      name,
+      namespace: testName,
+    },
+    spec: {
+      containers: [
+        {
+          name: 'hello-openshift',
+          image: 'openshift/hello-openshift',
+        },
+      ],
+    },
+  };
+  beforeAll(() => {
+    execSync(`echo '${JSON.stringify(testpod)}' | kubectl create -n ${testName} -f -`);
+  });
+  afterEach(() => {
+    checkLogs();
+    checkErrors();
+  });
+  afterAll(() => {
+    try {
+      execSync(`kubectl delete --cascade pods ${name} -n ${testName}`);
+    } catch (error) {
+      console.error(`Failed to delete pods ${name}:\n${error}`);
+    }
+  });
+  describe('Events', () => {
+    it('displays Events all resources', async () => {
+      await browser.get(`${appHost}/k8s/all-namespaces/events`);
+      await browser.wait(until.presenceOf($('.co-sysevent__box')));
+      expect($('.co-sysevent__box').isPresent()).toBe(true);
+    });
+
+    it('event view displays created pod', async () => {
+      await browser.get(`${appHost}/ns/${testName}/events`);
+      await browser.wait(until.presenceOf($('.co-sysevent-stream__status')), 10000);
+      await browser.wait(until.presenceOf($('.co-sysevent__box')), 10000);
+      await browser.wait(until.presenceOf(element(by.linkText(name))), 10000);
+      await browser.wait(until.presenceOf($(`[data-test-id=${name}]`)));
+      expect($(`[data-test-id=${name}]`).getText()).toEqual(name);
+    });
+  });
+});

frontend/public/components/events.jsx

@@ -64,14 +64,19 @@ const kindFilter = (reference, { involvedObject }) => {
   if (reference === 'all') {
     return true;
   }
-
-  if (isGroupVersionKind(reference)) {
-    const group = apiGroupForReference(reference);
-    const kind = kindForReference(reference);
-    const { group: eventGroup } = groupVersionFor(involvedObject.apiVersion);
-    return involvedObject.kind === kind && eventGroup === group;
-  }
-  return involvedObject.kind === reference;
+  const kinds = reference.split(',');
+  return kinds.some((ref) => {
+    if (isGroupVersionKind(ref)) {
+      const group = apiGroupForReference(ref);
+      const kind = kindForReference(ref);
+      if (typeof involvedObject.apiVersion === 'undefined') {
+        return false;
+      }
+      const { group: eventGroup } = groupVersionFor(involvedObject.apiVersion);
+      return involvedObject.kind === kind && eventGroup === group;
+    }
+    return involvedObject.kind === ref;
+  });
 };
 
 const Inner = connectToFlags(FLAGS.CAN_LIST_NODE)(
@@ -175,51 +180,8 @@ export class EventsList extends React.Component {
     this.setState({ selected: new Set(['All']) });
   };
 
-  getEvents = () => {
-    const { selected, type, textFilter } = this.state;
-    const events = [];
-    if (selected.has('All') || selected.size === 0) {
-      events.push(
-        <div key="all">
-          <span>
-            <ResourceIcon kind="All" />
-            All resources
-          </span>
-          <EventStream
-            {...this.props}
-            key="all-resources-event"
-            type={type}
-            kind="all"
-            mock={this.props.mock}
-            textFilter={textFilter}
-          />
-        </div>,
-      );
-    } else {
-      selected.forEach((kind) => {
-        events.push(
-          <div key={kind}>
-            <span>
-              <ResourceIcon kind={kind} />
-              {kindForReference(kind)}
-            </span>
-            <EventStream
-              {...this.props}
-              key={kind}
-              type={type}
-              kind={kind}
-              mock={this.props.mock}
-              textFilter={textFilter}
-            />
-          </div>,
-        );
-      });
-    }
-    return <div className="co-search co-m-pane__body">{events}</div>;
-  };
-
   render() {
-    const { type, selected } = this.state;
+    const { type, selected, textFilter } = this.state;
     const { autoFocus = true } = this.props;
 
     return (
@@ -266,7 +228,14 @@ export class EventsList extends React.Component {
             </ChipGroup>
           </div>
         </PageHeading>
-        {this.getEvents()}
+        <EventStream
+          {...this.props}
+          key={[...selected].join(',')}
+          type={type}
+          kind={selected.has('All') || selected.size === 0 ? 'all' : [...selected].join(',')}
+          mock={this.props.mock}
+          textFilter={textFilter}
+        />
       </>
     );
   }