tests

src/Blocks/EmbedTableauVisualization/Edit.test.jsx

@@ -0,0 +1,87 @@
+import React from 'react';
+import renderer from 'react-test-renderer';
+import configureStore from 'redux-mock-store';
+import { Provider } from 'react-intl-redux';
+import config from '@plone/volto/registry';
+
+import Edit from './Edit';
+import installEmbedTableau from '.';
+
+installEmbedTableau(config);
+
+const mockStore = configureStore([]);
+
+window.URL.createObjectURL = jest.fn(() => 'test');
+
+jest.mock('@plone/volto/components', () => ({
+  Icon: ({ children }) => <img alt="incon">{children}</img>,
+  Toast: ({ children }) => <p>{children}</p>,
+  SidebarPortal: jest.requireActual(
+    '@plone/volto/components/manage/Sidebar/SidebarPortal',
+  ).default,
+}));
+
+jest.mock('@eeacms/volto-matomo/utils', () => ({
+  trackLink: jest.fn(),
+}));
+
+jest.mock(
+  '@eeacms/volto-embed/PrivacyProtection/PrivacyProtection',
+  () => ({ children }) => {
+    return children;
+  },
+);
+
+jest.mock('@eeacms/volto-embed/helpers', () => ({
+  pickMetadata: (data) => data,
+}));
+
+const store = mockStore({
+  intl: {
+    locale: 'en',
+    messages: {},
+  },
+  content: {
+    create: {},
+    subrequests: [],
+  },
+  connected_data_parameters: {},
+});
+
+describe('Edit', () => {
+  const data = {
+    '@type': 'embed_tableau_visualization',
+    dataprotection: {
+      enabled: false,
+    },
+    tableau_vis_url: 'http://localhost:3000/tableau-ct',
+    with_download: true,
+    with_more_info: true,
+    with_notes: true,
+    with_share: true,
+  };
+
+  it('should render the component', () => {
+    const component = renderer.create(
+      <Provider store={store}>
+        <Edit
+          id="my-tableau"
+          data={data}
+          pathname="/news"
+          selected={false}
+          block="1234"
+          index={1}
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          content={{}}
+        />
+      </Provider>,
+    );
+    const json = component.toJSON();
+    expect(json).toMatchSnapshot();
+  });
+});

src/Blocks/EmbedTableauVisualization/__snapshots__/Edit.test.jsx.snap

@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Edit should render the component 1`] = `
+<div
+  className="embed-tableau"
+>
+  <div
+    className="tableau-wrapper"
+  >
+    <div
+      className="tableau tableau-2.8.0"
+      style={
+        Object {
+          "height": "700px",
+        }
+      }
+    />
+  </div>
+</div>
+`;

src/Utils/Download.test.jsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import renderer from 'react-test-renderer';
+import configureStore from 'redux-mock-store';
+import { Provider } from 'react-intl-redux';
+
+import Download from './Download';
+
+const mockStore = configureStore([]);
+
+window.URL.createObjectURL = jest.fn(() => 'test');
+
+jest.mock('semantic-ui-react', () => ({
+  Popup: ({ content, trigger }) => {
+    return (
+      <div className="popup">
+        <div className="trigger">{trigger}</div>
+        <div className="content">{content}</div>
+      </div>
+    );
+  },
+}));
+
+const store = mockStore({
+  intl: {
+    locale: 'en',
+    messages: {},
+  },
+  content: {
+    create: {},
+    subrequests: [],
+  },
+});
+
+describe('Edit', () => {
+  it('should render the component', () => {
+    const component = renderer.create(
+      <Provider store={store}>
+        <Download />
+      </Provider>,
+    );
+    const json = component.toJSON();
+    expect(json).toMatchSnapshot();
+  });
+});

src/Utils/__snapshots__/Download.test.jsx.snap

@@ -0,0 +1,111 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Edit should render the component 1`] = `
+<div
+  className="popup"
+>
+  <div
+    className="trigger"
+  >
+    <div
+      className="tableau-download-container"
+    >
+      <button
+        className="trigger-button"
+      >
+        <i
+          className="ri-download-fill"
+        />
+        Download
+      </button>
+    </div>
+  </div>
+  <div
+    className="content"
+  >
+    <div
+      className="item"
+    >
+      <span
+        className="label"
+      >
+        Data formats
+      </span>
+      <div
+        className="types"
+      >
+        <div
+          className="type"
+        >
+          <button
+            onClick={[Function]}
+          >
+            <span>
+              CSV
+            </span>
+          </button>
+        </div>
+        <div
+          className="type"
+        >
+          <button
+            onClick={[Function]}
+          >
+            <span>
+              Excel
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <div
+      className="item"
+    >
+      <span
+        className="label"
+      >
+        Image formats
+      </span>
+      <div
+        className="types"
+      >
+        <div
+          className="type"
+        >
+          <button
+            onClick={[Function]}
+          >
+            <span>
+              PNG
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <div
+      className="item"
+    >
+      <span
+        className="label"
+      >
+        Other formats
+      </span>
+      <div
+        className="types"
+      >
+        <div
+          className="type"
+        >
+          <button
+            onClick={[Function]}
+          >
+            <span>
+              PDF
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;