tests

public/app/features/datasources/DashboardsTable.test.tsx

+import React from 'react';
+import { shallow } from 'enzyme';
+import DashboardsTable, { Props } from './DashboardsTable';
+import { PluginDashboard } from '../../types';
+
+const setup = (propOverrides?: object) => {
+  const props: Props = {
+    dashboards: [] as PluginDashboard[],
+    onImport: jest.fn(),
+    onRemove: jest.fn(),
+  };
+
+  Object.assign(props, propOverrides);
+
+  return shallow(<DashboardsTable {...props} />);
+};
+
+describe('Render', () => {
+  it('should render component', () => {
+    const wrapper = setup();
+
+    expect(wrapper).toMatchSnapshot();
+  });
+
+  it('should render table', () => {
+    const wrapper = setup({
+      dashboards: [
+        {
+          dashboardId: 0,
+          description: '',
+          folderId: 0,
+          imported: false,
+          importedRevision: 0,
+          importedUri: '',
+          importedUrl: '',
+          path: 'dashboards/carbon_metrics.json',
+          pluginId: 'graphite',
+          removed: false,
+          revision: 1,
+          slug: '',
+          title: 'Graphite Carbon Metrics',
+        },
+        {
+          dashboardId: 0,
+          description: '',
+          folderId: 0,
+          imported: true,
+          importedRevision: 0,
+          importedUri: '',
+          importedUrl: '',
+          path: 'dashboards/carbon_metrics.json',
+          pluginId: 'graphite',
+          removed: false,
+          revision: 1,
+          slug: '',
+          title: 'Graphite Carbon Metrics',
+        },
+      ],
+    });
+
+    expect(wrapper).toMatchSnapshot();
+  });
+});

public/app/features/datasources/DashboardsTable.tsx

 import React, { SFC } from 'react';
 import React, { SFC } from 'react';
 import { PluginDashboard } from '../../types';
 import { PluginDashboard } from '../../types';
 
 
-interface Props {
+export interface Props {
   dashboards: PluginDashboard[];
   dashboards: PluginDashboard[];
   onImport: (dashboard, overwrite) => void;
   onImport: (dashboard, overwrite) => void;
   onRemove: (dashboard) => void;
   onRemove: (dashboard) => void;

public/app/features/datasources/DataSourceDashboards.test.tsx

+import React from 'react';
+import { shallow } from 'enzyme';
+import { DataSourceDashboards, Props } from './DataSourceDashboards';
+import { DataSource, NavModel, PluginDashboard } from 'app/types';
+
+const setup = (propOverrides?: object) => {
+  const props: Props = {
+    navModel: {} as NavModel,
+    dashboards: [] as PluginDashboard[],
+    dataSource: {} as DataSource,
+    pageId: 1,
+    importDashboard: jest.fn(),
+    loadDataSource: jest.fn(),
+    loadPluginDashboards: jest.fn(),
+    removeDashboard: jest.fn(),
+  };
+
+  Object.assign(props, propOverrides);
+
+  return shallow(<DataSourceDashboards {...props} />);
+};
+
+describe('Render', () => {
+  it('should render component', () => {
+    const wrapper = setup();
+
+    expect(wrapper).toMatchSnapshot();
+  });
+});

public/app/features/datasources/__snapshots__/DashboardsTable.test.tsx.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Render should render component 1`] = `
+<table
+  className="filter-table"
+>
+  <tbody />
+</table>
+`;
+
+exports[`Render should render table 1`] = `
+<table
+  className="filter-table"
+>
+  <tbody>
+    <tr
+      key="0-0"
+    >
+      <td
+        className="width-1"
+      >
+        <i
+          className="icon-gf icon-gf-dashboard"
+        />
+      </td>
+      <td>
+        <span>
+          Graphite Carbon Metrics
+        </span>
+      </td>
+      <td
+        style={
+          Object {
+            "textAlign": "right",
+          }
+        }
+      >
+        <button
+          className="btn btn-secondary btn-small"
+          onClick={[Function]}
+        >
+          Import
+        </button>
+      </td>
+    </tr>
+    <tr
+      key="0-1"
+    >
+      <td
+        className="width-1"
+      >
+        <i
+          className="icon-gf icon-gf-dashboard"
+        />
+      </td>
+      <td>
+        <a
+          href=""
+        >
+          Graphite Carbon Metrics
+        </a>
+      </td>
+      <td
+        style={
+          Object {
+            "textAlign": "right",
+          }
+        }
+      >
+        <button
+          className="btn btn-secondary btn-small"
+          onClick={[Function]}
+        >
+          Update
+        </button>
+        <button
+          className="btn btn-danger btn-small"
+          onClick={[Function]}
+        >
+          <i
+            className="fa fa-trash"
+          />
+        </button>
+      </td>
+    </tr>
+  </tbody>
+</table>
+`;

public/app/features/datasources/__snapshots__/DataSourceDashboards.test.tsx.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Render should render component 1`] = `
+<div>
+  <PageHeader
+    model={Object {}}
+  />
+  <div
+    className="page-container page-body"
+  >
+    <DashboardsTable
+      dashboards={Array []}
+      onImport={[Function]}
+      onRemove={[Function]}
+    />
+  </div>
+</div>
+`;