From ca33ca5a4c74fe493bdda179108d984ef392d94e Mon Sep 17 00:00:00 2001
From: Mateusz Bolewski <mateusz.bolewski@appunite.com>
Date: Tue, 5 Dec 2023 09:05:33 +0100
Subject: [PATCH] feat(map): added missing tests
---
.../BioEntityDrawer.component.test.tsx | 181 ++++++++++++++++++
.../BioEntityDrawer.component.tsx | 11 +-
.../Map/Drawer/Drawer.component.test.tsx | 31 +++
3 files changed, 218 insertions(+), 5 deletions(-)
create mode 100644 src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.test.tsx
diff --git a/src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.test.tsx b/src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.test.tsx
new file mode 100644
index 00000000..64308bbf
--- /dev/null
+++ b/src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.test.tsx
@@ -0,0 +1,181 @@
+/* eslint-disable no-magic-numbers */
+import {
+ InitialStoreState,
+ getReduxWrapperWithStore,
+} from '@/utils/testing/getReduxWrapperWithStore';
+import { render, screen } from '@testing-library/react';
+import { DRAWER_INITIAL_STATE } from '@/redux/drawer/drawer.constants';
+import { StoreType } from '@/redux/store';
+import {
+ bioEntitiesContentFixture,
+ bioEntityContentFixture,
+} from '@/models/fixtures/bioEntityContentsFixture';
+import { FIRST_ARRAY_ELEMENT } from '@/constants/common';
+import { BioEntityDrawer } from './BioEntityDrawer.component';
+
+const renderComponent = (initialStoreState: InitialStoreState = {}): { store: StoreType } => {
+ const { Wrapper, store } = getReduxWrapperWithStore(initialStoreState);
+
+ return (
+ render(
+ <Wrapper>
+ <BioEntityDrawer />
+ </Wrapper>,
+ ),
+ {
+ store,
+ }
+ );
+};
+
+describe('BioEntityDrawer - component', () => {
+ beforeEach(() => {
+ jest.resetAllMocks();
+ jest.clearAllMocks();
+ });
+
+ describe("when there's NO matching bioEntity", () => {
+ beforeEach(() =>
+ renderComponent({
+ bioEntity: {
+ data: [],
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ drawer: DRAWER_INITIAL_STATE,
+ }),
+ );
+
+ it('should not show drawer content', () => {
+ expect(screen.queryByText('Compartment:')).toBeNull();
+ expect(screen.queryByText('Full name:')).toBeNull();
+ expect(screen.queryByText('Annotations:')).toBeNull();
+ expect(screen.queryByText('Source:')).toBeNull();
+ });
+ });
+ describe('when there IS a matching bioEntity', () => {
+ const { bioEntity } = bioEntitiesContentFixture[FIRST_ARRAY_ELEMENT];
+
+ it('should show drawer header', () => {
+ renderComponent({
+ bioEntity: {
+ data: [
+ {
+ searchQueryElement: '',
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ data: bioEntitiesContentFixture,
+ },
+ ],
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ drawer: {
+ ...DRAWER_INITIAL_STATE,
+ bioEntityDrawerState: {
+ bioentityId: bioEntity.id,
+ },
+ },
+ });
+
+ expect(screen.getByText(bioEntity.stringType, { exact: false })).toBeInTheDocument();
+ expect(screen.getByText(bioEntity.name, { exact: false })).toBeInTheDocument();
+ });
+
+ it('should show drawer bioEntity full name', () => {
+ renderComponent({
+ bioEntity: {
+ data: [
+ {
+ searchQueryElement: '',
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ data: [
+ {
+ ...bioEntityContentFixture,
+ bioEntity: {
+ ...bioEntityContentFixture.bioEntity,
+ fullName: 'BioEntity Full Name',
+ },
+ },
+ ],
+ },
+ ],
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ drawer: {
+ ...DRAWER_INITIAL_STATE,
+ bioEntityDrawerState: {
+ bioentityId: bioEntityContentFixture.bioEntity.id,
+ },
+ },
+ });
+
+ expect(screen.getByText('Full name:', { exact: false })).toBeInTheDocument();
+ expect(screen.getByText('BioEntity Full Name', { exact: false })).toBeInTheDocument();
+ });
+
+ it("should not show drawer bioEntity full name if it doesn't exists", () => {
+ renderComponent({
+ bioEntity: {
+ data: [
+ {
+ searchQueryElement: '',
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ data: [
+ {
+ ...bioEntityContentFixture,
+ bioEntity: {
+ ...bioEntityContentFixture.bioEntity,
+ fullName: null,
+ },
+ },
+ ],
+ },
+ ],
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ drawer: {
+ ...DRAWER_INITIAL_STATE,
+ bioEntityDrawerState: {
+ bioentityId: bioEntityContentFixture.bioEntity.id,
+ },
+ },
+ });
+
+ expect(screen.queryByText('Full name:')).toBeNull();
+ });
+
+ it('should show list of annotations ', () => {
+ renderComponent({
+ bioEntity: {
+ data: [
+ {
+ searchQueryElement: '',
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ data: bioEntitiesContentFixture,
+ },
+ ],
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ drawer: {
+ ...DRAWER_INITIAL_STATE,
+ bioEntityDrawerState: {
+ bioentityId: bioEntity.id,
+ },
+ },
+ });
+
+ expect(screen.getByText('Annotations:')).toBeInTheDocument();
+ expect(screen.getByText(bioEntity.references[0].type, { exact: false })).toBeInTheDocument();
+ expect(
+ screen.getByText(bioEntity.references[0].resource, { exact: false }),
+ ).toBeInTheDocument();
+ });
+ });
+});
diff --git a/src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.tsx b/src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.tsx
index a0368e2b..98b0c7bf 100644
--- a/src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.tsx
+++ b/src/components/Map/Drawer/BioEntityDrawer/BioEntityDrawer.component.tsx
@@ -1,5 +1,4 @@
import { DrawerHeading } from '@/shared/DrawerHeading';
-// import { bioEnititiesResultListSelector } from '@/redux/drawer/drawer.selectors';
import { useAppSelector } from '@/redux/hooks/useAppSelector';
import { searchedFromMapBioEntityElement } from '@/redux/bioEntity/bioEntity.selectors';
import { Icon } from '@/shared/Icon';
@@ -12,7 +11,7 @@ export const BioEntityDrawer = (): React.ReactNode => {
}
return (
- <div className="h-full max-h-full" data-testid="reaction-drawer">
+ <div className="h-full max-h-full" data-testid="bioentity-drawer">
<DrawerHeading
title={
<>
@@ -25,9 +24,11 @@ export const BioEntityDrawer = (): React.ReactNode => {
<div className="text-sm font-normal">
Compartment: <b className="font-semibold">{bioEntityData.compartment}</b>
</div>
- <div className="text-sm font-normal">
- Full name: <b className="font-semibold">{bioEntityData.fullName}</b>
- </div>
+ {bioEntityData.fullName && (
+ <div className="text-sm font-normal">
+ Full name: <b className="font-semibold">{bioEntityData.fullName}</b>
+ </div>
+ )}
<h3 className="font-semibold">Annotations:</h3>
{bioEntityData.references.map(reference => {
return (
diff --git a/src/components/Map/Drawer/Drawer.component.test.tsx b/src/components/Map/Drawer/Drawer.component.test.tsx
index a0cbbdfc..fb4be23d 100644
--- a/src/components/Map/Drawer/Drawer.component.test.tsx
+++ b/src/components/Map/Drawer/Drawer.component.test.tsx
@@ -1,6 +1,7 @@
import { FIRST_ARRAY_ELEMENT } from '@/constants/common';
import { reactionsFixture } from '@/models/fixtures/reactionFixture';
import {
+ openBioEntityDrawerById,
openReactionDrawerById,
openSearchDrawerWithSelectedTab,
openSubmapsDrawer,
@@ -13,6 +14,7 @@ import {
} from '@/utils/testing/getReduxWrapperWithStore';
import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
import type {} from 'redux-thunk/extend-redux';
+import { bioEntitiesContentFixture } from '@/models/fixtures/bioEntityContentsFixture';
import { Drawer } from './Drawer.component';
const renderComponent = (initialStore?: InitialStoreState): { store: StoreType } => {
@@ -109,4 +111,33 @@ describe('Drawer - component', () => {
await waitFor(() => expect(screen.getByTestId('reaction-drawer')).toBeInTheDocument());
});
});
+
+ describe('bioEntity drawer', () => {
+ it.skip('should open drawer and display bioEntity', async () => {
+ const { id } = bioEntitiesContentFixture[FIRST_ARRAY_ELEMENT].bioEntity;
+
+ const { store } = renderComponent({
+ bioEntity: {
+ data: [
+ {
+ searchQueryElement: '',
+ loading: 'succeeded',
+ error: { name: '', message: '' },
+ data: bioEntitiesContentFixture,
+ },
+ ],
+ loading: 'succeeded',
+ error: { message: '', name: '' },
+ },
+ });
+
+ expect(screen.queryByTestId('bioentity-drawer')).not.toBeInTheDocument();
+
+ await act(() => {
+ store.dispatch(openBioEntityDrawerById(id));
+ });
+
+ await waitFor(() => expect(screen.getByTestId('bioentity-drawer')).toBeInTheDocument());
+ });
+ });
});
--
GitLab