diff --git a/kolibri/plugins/learn/assets/src/composables/__mocks__/usePinnedDevices.js b/kolibri/plugins/learn/assets/src/composables/__mocks__/usePinnedDevices.js new file mode 100644 index 00000000000..df3f5912a32 --- /dev/null +++ b/kolibri/plugins/learn/assets/src/composables/__mocks__/usePinnedDevices.js @@ -0,0 +1,47 @@ +/** + * `usePinnedDevices` composable function mock. + * + * If default values are sufficient for tests, + * you only need call `jest.mock('')` + * at the top of a test file. + * + * If you need to override some default values from some tests, + * you can import a helper function `usePinnedDevicesMock` that accepts + * an object with values to be overriden and use it together + * with `mockImplementation` as follows: + * + * ``` + * // eslint-disable-next-line import/named + * import usePinnedDevices, { usePinnedDevicesMock } from ''; + * + * jest.mock('') + * + * it('test', () => { + * usePinnedDevices.mockImplementation( + * () => usePinnedDevicesMock({ channels: [{ id: 'channel-1' }] }) + * ); + * }) + * ``` + * + * You can reset your mock implementation back to default values + * for other tests by calling the following in `beforeEach`: + * + * ``` + * usePinnedDevices.mockImplementation(() => usePinnedDevicesMock()) + * ``` + */ + +const MOCK_DEFAULTS = { + createPinForUser: jest.fn(() => ''), + deletePinForUser: jest.fn(() => ''), + fetchPinsForUser: jest.fn(() => []), +}; + +export function usePinnedDevicesMock(overrides = {}) { + return { + ...MOCK_DEFAULTS, + ...overrides, + }; +} + +export default jest.fn(() => usePinnedDevicesMock()); diff --git a/kolibri/plugins/learn/assets/test/views/library-page.spec.js b/kolibri/plugins/learn/assets/test/views/library-page.spec.js index 2735c9728bc..dedc0a4c29e 100644 --- a/kolibri/plugins/learn/assets/test/views/library-page.spec.js +++ b/kolibri/plugins/learn/assets/test/views/library-page.spec.js @@ -35,19 +35,20 @@ const mockStore = new Vuex.Store({ }, }); +jest.mock('../../src/composables/useChannels'); jest.mock('../../src/composables/useDevices'); jest.mock('../../src/composables/useSearch'); jest.mock('../../src/composables/useLearnerResources'); jest.mock('../../src/composables/useLearningActivities'); -jest.mock('../../src/composables/usePinnedDevices'); jest.mock('../../src/composables/useContentLink'); +jest.mock('../../src/composables/usePinnedDevices'); jest.mock('kolibri-design-system/lib/useKResponsiveWindow'); +jest.mock('kolibri.resources'); jest.mock('kolibri.urls'); -//ToDo: fix tests suit, overhaul could be require here describe('LibraryPage', () => { describe('filters button', () => { - it.skip('is visible when the page is not large', () => { + it('is visible when the page is not large', () => { useKResponsiveWindow.mockImplementation(() => ({ windowIsLarge: false, })); @@ -57,7 +58,7 @@ describe('LibraryPage', () => { }); expect(wrapper.find('[data-test="filter-button"').element).toBeTruthy(); }); - it.skip('is hidden when the page is large', () => { + it('is hidden when the page is large', () => { useKResponsiveWindow.mockImplementation(() => ({ windowIsLarge: true, })); @@ -70,7 +71,7 @@ describe('LibraryPage', () => { }); describe('when user clicks the filters button', () => { - it.skip('displays the filters side panel, which is not displayed by default', async () => { + it('displays the filters side panel, which is not displayed by default', async () => { useKResponsiveWindow.mockImplementation(() => ({ windowIsLarge: false, })); @@ -91,7 +92,7 @@ describe('LibraryPage', () => { describe('displaying channels and recent/popular content ', () => { /** useSearch#displayingSearchResults is falsy and there are rootNodes.length */ - it.skip('displays a grid of channel cards', () => { + it('displays a grid of channel cards', () => { useSearch.mockImplementation(() => useSearchMock({ displayingSearchResults: false })); const wrapper = shallowMount(LibraryPage, { localVue, @@ -99,7 +100,7 @@ describe('LibraryPage', () => { }); expect(wrapper.find("[data-test='channel-cards']").exists()).toBe(true); }); - it.skip('displays a ResumableContentGrid', () => { + it('displays a ResumableContentGrid', () => { useSearch.mockImplementation(() => useSearchMock({ displayingSearchResults: false })); const wrapper = shallowMount(LibraryPage, { localVue, @@ -110,7 +111,7 @@ describe('LibraryPage', () => { }); describe('when page is loading', () => { - it.skip('shows a KCircularLoader', () => { + it('shows a KCircularLoader', () => { useSearch.mockImplementation(() => useSearchMock({ searchLoading: true })); const wrapper = shallowMount(LibraryPage, { localVue,