Skip to content

Commit

Permalink
test: Update/fix tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@yusuf-musleh
yusuf-musleh committed Dec 10, 2023
1 parent ede10db commit 7de9d9b
Show file tree
Hide file tree
Showing 7 changed files with 200 additions and 40 deletions.
47 changes: 47 additions & 0 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,7 @@
"@edx/typescript-config": "^1.0.1",
"@testing-library/jest-dom": "5.17.0",
"@testing-library/react": "12.1.5",
"@testing-library/react-hooks": "^8.0.1",
"@testing-library/user-event": "^13.2.1",
"@wojtekmaj/enzyme-adapter-react-17": "0.8.0",
"axios-mock-adapter": "1.22.0",
Expand Down
58 changes: 48 additions & 10 deletions src/content-tags-drawer/ContentTagsCollapsible.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,12 @@ jest.mock('./data/apiHooks', () => ({
mutate: jest.fn(),
})),
useTaxonomyTagsData: jest.fn(() => ({
isSuccess: false,
data: {},
hasMorePages: false,
tagPages: [{
isLoading: true,
isError: false,
data: [],
}],
})),
}));

Expand Down Expand Up @@ -83,19 +87,36 @@ describe('<ContentTagsCollapsible />', () => {

it('should render new tags as they are checked in the dropdown', async () => {
useTaxonomyTagsData.mockReturnValue({
isSuccess: true,
data: {
results: [{
hasMorePages: false,
tagPages: [{
isLoading: false,
isError: false,
data: [{
value: 'Tag 1',
externalId: null,
childCount: 0,
depth: 0,
parentValue: null,
id: 12345,
subTagsUrl: null,
}, {
value: 'Tag 2',
externalId: null,
childCount: 0,
depth: 0,
parentValue: null,
id: 12346,
subTagsUrl: null,
}, {
value: 'Tag 3',
externalId: null,
childCount: 0,
depth: 0,
parentValue: null,
id: 12347,
subTagsUrl: null,
}],
},
}],
});

await act(async () => {
Expand Down Expand Up @@ -141,19 +162,36 @@ describe('<ContentTagsCollapsible />', () => {

it('should remove tag when they are unchecked in the dropdown', async () => {
useTaxonomyTagsData.mockReturnValue({
isSuccess: true,
data: {
results: [{
hasMorePages: false,
tagPages: [{
isLoading: false,
isError: false,
data: [{
value: 'Tag 1',
externalId: null,
childCount: 0,
depth: 0,
parentValue: null,
id: 12345,
subTagsUrl: null,
}, {
value: 'Tag 2',
externalId: null,
childCount: 0,
depth: 0,
parentValue: null,
id: 12346,
subTagsUrl: null,
}, {
value: 'Tag 3',
externalId: null,
childCount: 0,
depth: 0,
parentValue: null,
id: 12347,
subTagsUrl: null,
}],
},
}],
});

await act(async () => {
Expand Down
4 changes: 2 additions & 2 deletions src/content-tags-drawer/ContentTagsDropDownSelector.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,8 @@ const ContentTagsDropDownSelector = ({
return (
<div style={{ marginLeft: `${level * 1 }rem` }}>
{tagPages.map((tagPage, pageNum) => (
// Array index represents the page number
// eslint-disable-next-line react/no-array-index-key
<React.Fragment key={`tag-page-${pageNum}`}>
{tagPage.isLoading ? (
<div className="d-flex justify-content-center align-items-center flex-row">
Expand All @@ -79,7 +81,6 @@ const ContentTagsDropDownSelector = ({
<div
className="d-flex flex-row"
style={{
// paddingLeft: `${level * 1}rem`,
minHeight: '44px',
}}
>
Expand Down Expand Up @@ -131,7 +132,6 @@ const ContentTagsDropDownSelector = ({
? (
<div className="d-flex justify-content-center align-items-center flex-row">
<Button
// style={{ marginLeft: `${level * 1 }rem` }}
variant="outline-primary"
onClick={loadMoreTags}
className="mb-2 taxonomy-tags-load-more-button"
Expand Down
42 changes: 31 additions & 11 deletions src/content-tags-drawer/ContentTagsDropDownSelector.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,12 @@ import { useTaxonomyTagsData } from './data/apiHooks';

jest.mock('./data/apiHooks', () => ({
useTaxonomyTagsData: jest.fn(() => ({
isSuccess: false,
data: {},
hasMorePages: false,
tagPages: [{
isLoading: true,
isError: false,
data: [],
}],
})),
}));

Expand Down Expand Up @@ -68,14 +72,22 @@ describe('<ContentTagsDropDownSelector />', () => {

it('should render taxonomy tags drop down selector with no sub tags', async () => {
useTaxonomyTagsData.mockReturnValue({
isSuccess: true,
data: {
results: [{
hasMorePages: false,
tagPages: [{
isLoading: false,
isError: false,
data: [{
value: 'Tag 1',
externalId: null,
childCount: 0,
depth: 0,
parentValue: null,
id: 12345,
subTagsUrl: null,
}],
},
}],
});

await act(async () => {
const { container, getByText } = render(
<ContentTagsDropDownSelectorComponent
Expand All @@ -94,14 +106,22 @@ describe('<ContentTagsDropDownSelector />', () => {

it('should render taxonomy tags drop down selector with sub tags', async () => {
useTaxonomyTagsData.mockReturnValue({
isSuccess: true,
data: {
results: [{
hasMorePages: false,
tagPages: [{
isLoading: false,
isError: false,
data: [{
value: 'Tag 2',
subTagsUrl: 'https://example.com',
externalId: null,
childCount: 1,
depth: 0,
parentValue: null,
id: 12345,
subTagsUrl: 'http://localhost:18010/api/content_tagging/v1/taxonomies/4/tags/?parent_tag=Tag%202',
}],
},
}],
});

await act(async () => {
const { container, getByText } = render(
<ContentTagsDropDownSelectorComponent
Expand Down
28 changes: 24 additions & 4 deletions src/content-tags-drawer/data/api.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,13 +47,33 @@ describe('content tags drawer api calls', () => {
expect(result).toEqual(taxonomyTagsMock);
});

it('should get taxonomy tags data with fullPathProvided', async () => {
it('should get taxonomy tags data with parentTag', async () => {
const taxonomyId = 123;
const fullPathProvided = 'http://example.com/';
const options = { parentTag: 'Sample Tag' };
axiosMock.onGet().reply(200, taxonomyTagsMock);
const result = await getTaxonomyTagsData(taxonomyId, fullPathProvided);
const result = await getTaxonomyTagsData(taxonomyId, options);

expect(axiosMock.history.get[0].url).toEqual(new URL(`${fullPathProvided}`));
expect(axiosMock.history.get[0].url).toContain('parent_tag=Sample+Tag');
expect(result).toEqual(taxonomyTagsMock);
});

it('should get taxonomy tags data with page', async () => {
const taxonomyId = 123;
const options = { page: 2 };
axiosMock.onGet().reply(200, taxonomyTagsMock);
const result = await getTaxonomyTagsData(taxonomyId, options);

expect(axiosMock.history.get[0].url).toContain('page=2');
expect(result).toEqual(taxonomyTagsMock);
});

it('should get taxonomy tags data with searchTerm', async () => {
const taxonomyId = 123;
const options = { searchTerm: 'memo' };
axiosMock.onGet().reply(200, taxonomyTagsMock);
const result = await getTaxonomyTagsData(taxonomyId, options);

expect(axiosMock.history.get[0].url).toContain('search_term=memo');
expect(result).toEqual(taxonomyTagsMock);
});

Expand Down
60 changes: 47 additions & 13 deletions src/content-tags-drawer/data/apiHooks.test.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { useQuery, useMutation } from '@tanstack/react-query';
import { useQuery, useMutation, useQueries } from '@tanstack/react-query';
import { act } from '@testing-library/react';
import { renderHook } from '@testing-library/react-hooks';
import {
useTaxonomyTagsData,
useContentTaxonomyTagsData,
Expand All @@ -13,27 +14,60 @@ jest.mock('@tanstack/react-query', () => ({
useQuery: jest.fn(),
useMutation: jest.fn(),
useQueryClient: jest.fn(),
useQueries: jest.fn(),
}));

jest.mock('./api', () => ({
updateContentTaxonomyTags: jest.fn(),
}));

describe('useTaxonomyTagsData', () => {
it('should return success response', () => {
useQuery.mockReturnValueOnce({ isSuccess: true, data: 'data' });
it('should call useQueries with the correct arguments', () => {
const taxonomyId = 123;
const result = useTaxonomyTagsData(taxonomyId);

expect(result).toEqual({ isSuccess: true, data: 'data' });
});

it('should return failure response', () => {
useQuery.mockReturnValueOnce({ isSuccess: false });
const taxonomyId = 123;
const result = useTaxonomyTagsData(taxonomyId);
const mockData1 = {
results: [
{
value: 'tag 1',
externalId: null,
childCount: 16,
depth: 0,
parentValue: null,
id: 635951,
subTagsUrl: 'http://localhost:18010/api/content_tagging/v1/taxonomies/4/tags/?parent_tag=tag%201',
},
{
value: 'tag 2',
externalId: null,
childCount: 16,
depth: 0,
parentValue: null,
id: 636992,
subTagsUrl: 'http://localhost:18010/api/content_tagging/v1/taxonomies/4/tags/?parent_tag=tag%202',
},
],
};

useQueries.mockReturnValue([
{ data: mockData1, isLoading: false, isError: false },
]);

const { result } = renderHook(() => useTaxonomyTagsData(taxonomyId));

// Assert that useQueries was called with the correct arguments
expect(useQueries).toHaveBeenCalledWith({
queries: [
{ queryKey: ['taxonomyTags', taxonomyId, null, 1, ''], queryFn: expect.any(Function), staleTime: Infinity },
],
});

expect(result).toEqual({ isSuccess: false });
expect(result.current.hasMorePages).toEqual(false);
expect(result.current.tagPages).toEqual([
{
isLoading: false,
isError: false,
data: mockData1.results,
},
]);
});
});

Expand Down

0 comments on commit 7de9d9b

Please sign in to comment.