Skip to content
2 changes: 2 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
{
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Might be a good idea to add this to the .gitignore, that way git won't accidently pick up config files.

}
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,7 @@
"transformIgnorePatterns": [
"[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs|cjs|ts|tsx)$",
"^.+\\.module\\.(css|sass|scss)$",
"node_modules\/(?!axios)"
"node_modules/(?!axios)"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice catch!

],
"modulePaths": [
"src"
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
import { render, screen } from '@testing-library/react';
// TypeError: Cannot read properties of undefined (reading '__buildHTMLFromChapter')
// (src/screens/EPub/controllers/file-builders/EPubParser.js:6:46)
import { v4 as uuidv4 } from 'uuid';
import ChapterContent from './ChapterContent';

const test_uuid = '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d';

jest.mock('uuid', () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

really good use of mock for a randomized ID from an external library. Once you merge this PR, you should definitely add this as an example test file in the Testing wiki

return {
v4: jest.fn(() => test_uuid),
};
});


describe('ChapterContent Component', () => {
const mockDispatch = jest.fn();
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we aren't using these variables anywhere else, might be simpler to just have jest.fn() in props directly similar to your other test files, though this works fine too since the readability is quite clear in both cases.

const mockOnInsert = jest.fn();
const mockOnRemove = jest.fn();
const mockOnTextChange = jest.fn();
const mockOnImageChange = jest.fn();

const props = {
id: 'ch-content-12345-uuid-0',
key: 'ch-content-12345-uuid-12345',
content: 'Sample text content',
index: 0,
dispatch: mockDispatch,
onRemove: mockOnRemove,
onTextChange: mockOnTextChange,
onImageChange: mockOnImageChange,
onInsert: mockOnInsert,
};

it('should render text content correctly', () => {
render(<ChapterContent {...props} />);

expect(screen.getByText('Sample text content')).toBeVisible();
});

it('should render Tags components with correct keys', () => {
const { getAllByTestId } = render(<ChapterContent {...props} />);

const tags = getAllByTestId('tag');
tags.forEach((tag) => {
expect(tag).toHaveAttribute('key', `tag-${props.key}-${test_uuid}`);
});
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import { render, screen } from '@testing-library/react';
import { v4 as uuidv4 } from 'uuid';
import ChapterInfo from './ChapterInfo';

const test_uuid = '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d';

jest.mock('uuid', () => {
return {
v4: jest.fn(() => test_uuid),
};
});

describe('ChapterInfo Component', () => {
const baseProps = {
chapter: { id: 'chapter-id-1', title: 'Sample Chapter', contents: ["content 1", "content 2"], condition: "condition"},
currChIndex: 0,
dispatch: jest.fn()
};

it('should render ChapterContent components with correct keys', () => {
// Invariant Violation: Could not find "store"
render(<ChapterInfo {...baseProps} />);

const contents = getAllByTestId('content');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like jest isn't able to work without a redux state, which is unfortunately wrapped by DvaJS. This might need some research on how to mock but we'll figure this out later.

contents.forEach((content) => {
expect(content).toHaveAttribute('key', `ch-content-chapter-id-1-${test_uuid}`);
});
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import { render, screen } from '@testing-library/react';
import SubChapterItem from './SubChapterItem';
import { v4 as uuidv4 } from 'uuid';

const test_uuid = '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d';

jest.mock('uuid', () => {
return {
v4: jest.fn(() => test_uuid),
};
});

describe('SubChapterItem Component', () => {
const baseProps = {
subChapter: { title: "title", id: 'chapter-id-1', contents : ["content 1", "content 2"] },
subChapterIndex: 0,
currChIndex: 0,
dispatch: jest.fn()
};

it('should render SubChapterItem components with correct keys', () => {
// Invariant Violation: Could not find "store"
render(<SubChapterItem {...baseProps} />);

const contents = getAllByTestId('content');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This probably needs to be screen.getAllByTestId to fix the error

contents.forEach((content) => {
expect(content).toHaveAttribute('key', `sch-content-chapter-id-1-${test_uuid}}`);
});
});
});
31 changes: 31 additions & 0 deletions src/screens/EPub/views/EditINote/INoteEditor/INoteChapter.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import { render, screen } from '@testing-library/react';
// TypeError: Cannot read properties of undefined (reading '__buildHTMLFromChapter')
// (src/screens/EPub/controllers/file-builders/EPubParser.js:6:46)
import { v4 as uuidv4 } from 'uuid';
import INoteChapter from './INoteChapter';

const test_uuid = '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d';

jest.mock('uuid', () => {
return {
v4: jest.fn(() => test_uuid),
};
});

describe('INoteChapter Component', () => {
const baseProps = {
chapter: {id: "chapter-id-1", title: "Sample title"},
chIdx: 0,
images: [],
dispatch: jest.fn()
};

it('should render INoteChapter components with correct keys', () => {
render(<INoteChapter {...baseProps} />);

const contents = getAllByTestId('content');
contents.forEach((content) => {
expect(content).toHaveAttribute('key', `ch-content-chapter-id-1-${test_uuid}}`);
});
});
});