Add tests

test/js/component/app/__snapshots__/app.test.jsx.snap

@@ -17,6 +17,9 @@ exports[`app component > should render app element 1`] = `
     <div>
       Mocked Menu
     </div>
+    <div
+      class="toast-container position-absolute top-0 end-0 mt-3 me-3"
+    />
   </div>
 </DocumentFragment>
 `;

test/js/component/message/__snapshots__/message.test.jsx.snap

@@ -0,0 +1,102 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`message component > should render error message 1`] = `
+<DocumentFragment>
+  <div
+    class="toast-container position-absolute top-0 end-0 mt-3 me-3"
+  >
+    <div
+      aria-atomic="true"
+      aria-live="assertive"
+      class="toast align-items-center bg-secondary fade show showing"
+      data-bs-autohide="false"
+      initialized="true"
+      role="alert"
+    >
+      <div
+        class="d-flex"
+      >
+        <div
+          class="ms-3 m-auto h4"
+        >
+          <i
+            class="bi bi-exclamation-triangle-fill text-bg-secondary"
+          />
+        </div>
+        <div
+          class="toast-body text-bg-secondary"
+        >
+          foo
+        </div>
+      </div>
+    </div>
+    <div
+      aria-atomic="true"
+      aria-live="assertive"
+      class="toast align-items-center bg-danger fade show showing"
+      data-bs-autohide="false"
+      initialized="true"
+      role="alert"
+    >
+      <div
+        class="d-flex"
+      >
+        <div
+          class="ms-3 m-auto h4"
+        >
+          <i
+            class="bi bi-x-octagon-fill text-bg-danger"
+          />
+        </div>
+        <div
+          class="toast-body text-bg-danger"
+        >
+          foo
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`message component > should render message container 1`] = `
+<DocumentFragment>
+  <div
+    class="toast-container position-absolute top-0 end-0 mt-3 me-3"
+  />
+</DocumentFragment>
+`;
+
+exports[`message component > should render warning message 1`] = `
+<DocumentFragment>
+  <div
+    class="toast-container position-absolute top-0 end-0 mt-3 me-3"
+  >
+    <div
+      aria-atomic="true"
+      aria-live="assertive"
+      class="toast align-items-center bg-secondary fade show showing"
+      data-bs-autohide="false"
+      initialized="true"
+      role="alert"
+    >
+      <div
+        class="d-flex"
+      >
+        <div
+          class="ms-3 m-auto h4"
+        >
+          <i
+            class="bi bi-exclamation-triangle-fill text-bg-secondary"
+          />
+        </div>
+        <div
+          class="toast-body text-bg-secondary"
+        >
+          foo
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

test/js/component/message/message.test.jsx

@@ -0,0 +1,39 @@
+import {act, render} from '@testing-library/react';
+import React from "react";
+import {Provider} from "react-redux";
+
+import OerebMessage from "../../../../oereb_client/static/src/component/message/message";
+import MainStore from "../../../../oereb_client/static/src/store/main";
+import { error, warning } from '../../../../oereb_client/static/src/reducer/message';
+
+describe('message component', () => {
+
+  let component;
+
+  beforeEach(() => {
+    component = render(
+      <Provider store={MainStore}>
+        <OerebMessage />
+      </Provider>
+    );
+  });
+
+  it('should render message container', () => {
+    expect(component.asFragment()).toMatchSnapshot();
+  });
+
+  it('should render warning message', () => {
+    act(() => {
+      MainStore.dispatch(warning('foo'));
+    });
+    expect(component.asFragment()).toMatchSnapshot();
+  });
+
+  it('should render error message', () => {
+    act(() => {
+      MainStore.dispatch(error('foo'));
+    });
+    expect(component.asFragment()).toMatchSnapshot();
+  });
+
+});

test/js/reducer/message.test.js

@@ -0,0 +1,73 @@
+import {vi} from 'vitest';
+
+import reducer, {
+  cleanMessages,
+  error,
+  showError,
+  showWarning,
+  warning} from '../../../oereb_client/static/src/reducer/message';
+import * as messageSlice from '../../../oereb_client/static/src/reducer/message';
+
+describe('message reducer', () => {
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it('should return the initial state', () => {
+    expect(reducer(undefined, {})).toEqual({
+      messages: []
+    });
+  });
+
+  it('should add warning message', () => {
+    let state = reducer(undefined, {});
+    state = reducer(state, warning('foo'));
+    expect(state.messages).toHaveLength(1);
+    expect(state.messages[0].text).toEqual('foo');
+    expect(state.messages[0].type).toEqual('warning');
+    expect(typeof state.messages[0].id).toBe('string');
+    expect(typeof state.messages[0].timestamp).toBe('number');
+  });
+
+  it('should add error message', () => {
+    let state = reducer(undefined, {});
+    state = reducer(state, error('foo'));
+    expect(state.messages).toHaveLength(1);
+    expect(state.messages[0].text).toEqual('foo');
+    expect(state.messages[0].type).toEqual('error');
+    expect(typeof state.messages[0].id).toBe('string');
+    expect(typeof state.messages[0].timestamp).toBe('number');
+  });
+
+  it('should remove timed-out messages', () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date(2023, 1, 1, 0, 0, 0));
+    let state = reducer(undefined, {});
+    state = reducer(state, warning('foo'));
+    expect(state.messages).toHaveLength(1);
+    vi.setSystemTime(new Date(2023, 1, 1, 0, 0, 11));
+    state = reducer(state, cleanMessages());
+    expect(state.messages).toHaveLength(0);
+    vi.useRealTimers();
+  });
+
+  it('should show warning with async removal', () => {
+    const state = reducer(undefined, {});
+    const warningSpy = vi.spyOn(messageSlice, 'warning');
+    const cleanSpy = vi.spyOn(messageSlice, 'cleanMessages');
+    reducer(state, showWarning('foo'));
+    vi.waitFor(() => expect(warningSpy).toHaveBeenCalledWith('foo'));
+    vi.waitFor(() => expect(cleanSpy).toHaveBeenCalled());
+  });
+
+  it('should show error with async removal', () => {
+    const state = reducer(undefined, {});
+    const errorSpy = vi.spyOn(messageSlice, 'error');
+    const cleanSpy = vi.spyOn(messageSlice, 'cleanMessages');
+    reducer(state, showError('foo'));
+    vi.waitFor(() => expect(errorSpy).toHaveBeenCalledWith('foo'));
+    vi.waitFor(() => expect(cleanSpy).toHaveBeenCalled());
+  });
+
+});

test/js/util/error.test.js

@@ -0,0 +1,10 @@
+import {expect} from "vitest";
+
+import {NoDataError} from "../../../oereb_client/static/src/util/error";
+
+describe('NoDataError', () => {
+  it('should have correct name', () => {
+    const error = new NoDataError();
+    expect(error.name).toEqual('NoDataError');
+  });
+});