From 726c1578736c28f28e81e6e37900045d7cc8bed9 Mon Sep 17 00:00:00 2001 From: Devlin Junker Date: Sun, 20 Aug 2023 21:45:08 -0700 Subject: cleanup and rename FeedItemRow component Signed-off-by: Devlin Junker --- tests/javascript/unit/components/FeedItem.spec.ts | 141 --------------------- .../javascript/unit/components/FeedItemRow.spec.ts | 132 +++++++++++++++++++ tests/javascript/unit/components/Starred.spec.ts | 4 +- 3 files changed, 134 insertions(+), 143 deletions(-) delete mode 100644 tests/javascript/unit/components/FeedItem.spec.ts create mode 100644 tests/javascript/unit/components/FeedItemRow.spec.ts (limited to 'tests') diff --git a/tests/javascript/unit/components/FeedItem.spec.ts b/tests/javascript/unit/components/FeedItem.spec.ts deleted file mode 100644 index 88991201f..000000000 --- a/tests/javascript/unit/components/FeedItem.spec.ts +++ /dev/null @@ -1,141 +0,0 @@ -import { shallowMount, createLocalVue, Wrapper } from '@vue/test-utils' - -import FeedItem from '../../../../src/components/FeedItem.vue' -import { ACTIONS } from '../../../../src/store' - -describe('FeedItem.vue', () => { - 'use strict' - const localVue = createLocalVue() - let wrapper: Wrapper - - const mockItem = { - feedId: 1, - title: 'feed item', - pubDate: Date.now() / 1000, - } - const mockFeed = { - id: 1, - } - - const dispatchStub = jest.fn() - beforeAll(() => { - wrapper = shallowMount(FeedItem, { - propsData: { - item: mockItem, - }, - localVue, - mocks: { - $store: { - getters: { - feeds: [mockFeed], - }, - state: { - feeds: [], - folders: [], - }, - dispatch: dispatchStub, - }, - }, - }) - }) - - beforeEach(() => { - dispatchStub.mockReset() - }) - - it('should initialize without expanded and without keepUnread', () => { - expect(wrapper.vm.$data.expanded).toBeFalsy() - expect(wrapper.vm.$data.keepUnread).toBeFalsy() - }) - - it('should expand when clicked', async () => { - await wrapper.find('.feed-item-row').trigger('click') - - expect(wrapper.vm.$data.expanded).toBe(true) - }) - - it('should format date correctly', () => { - const epoch = Date.now() // Provide an epoch timestamp - const formattedDate = (wrapper.vm as any).formatDate(epoch) - - expect(formattedDate).toEqual(new Date(epoch).toLocaleString()) - }) - - it('should format datetime correctly', () => { - const epoch = Date.now() // Provide an epoch timestamp - const formattedDate = (wrapper.vm as any).formatDatetime(epoch) - - expect(formattedDate).toEqual(new Date(epoch).toISOString()) - }) - - it('should calculate relative timestamp correctly', () => { - const currentTimestamp = Date.now() - let pastTimestamp = currentTimestamp - 1000 * 10 // 10 seconds ago - - let relativeTimestamp = (wrapper.vm as any).getRelativeTimestamp(pastTimestamp) - - expect(relativeTimestamp).toEqual('10 seconds') - - pastTimestamp = currentTimestamp - 1000 * 60 * 10 // 10 minutes ago - - relativeTimestamp = (wrapper.vm as any).getRelativeTimestamp(pastTimestamp) - - expect(relativeTimestamp).toEqual('10 minutes ago') - }) - - it('should retrieve feed by ID', () => { - const feed = (wrapper.vm as any).getFeed(mockFeed.id) - - expect(feed).toEqual(mockFeed) - }) - - describe('markRead', () => { - it('should mark item as read when keepUnread is false', () => { - wrapper.vm.$data.keepUnread = false; - (wrapper.vm as any).markRead(wrapper.vm.$props.item) - - expect(dispatchStub).toHaveBeenCalledWith(ACTIONS.MARK_READ, { - item: wrapper.vm.$props.item, - }) - }) - - it('should not mark item as read when keepUnread is true', () => { - wrapper.vm.$data.keepUnread = true; - (wrapper.vm as any).markRead(wrapper.vm.$data.item) - - expect(dispatchStub).not.toHaveBeenCalled() - }) - }) - - it('toggles keepUnread state', () => { - const initialKeepUnread = wrapper.vm.$data.keepUnread; - (wrapper.vm as any).toggleKeepUnread(wrapper.vm.$data.item) - const updatedKeepUnread = wrapper.vm.$data.keepUnread - - expect(updatedKeepUnread).toBe(!initialKeepUnread) - }) - - it('toggles starred state', () => { - wrapper.vm.$props.item.starred = true; - - (wrapper.vm as any).toggleStarred(wrapper.vm.$props.item) - expect(dispatchStub).toHaveBeenCalledWith(ACTIONS.UNSTAR_ITEM, { - item: wrapper.vm.$props.item, - }) - - wrapper.vm.$props.item.starred = false; - - (wrapper.vm as any).toggleStarred(wrapper.vm.$props.item) - expect(dispatchStub).toHaveBeenCalledWith(ACTIONS.STAR_ITEM, { - item: wrapper.vm.$props.item, - }) - }) - - xit('TODO test: getMediaType(mime: any): audio | video | false', () => { - // TODO: finish tests after audio/video playback is supported - }) - - xit('TODO test: play(item: any): void', () => { - // TODO: finish tests after audio/video playback is supported - }) -}) diff --git a/tests/javascript/unit/components/FeedItemRow.spec.ts b/tests/javascript/unit/components/FeedItemRow.spec.ts new file mode 100644 index 000000000..9abe384d6 --- /dev/null +++ b/tests/javascript/unit/components/FeedItemRow.spec.ts @@ -0,0 +1,132 @@ +import { shallowMount, createLocalVue, Wrapper } from '@vue/test-utils' + +import FeedItemRow from '../../../../src/components/FeedItemRow.vue' +import { ACTIONS } from '../../../../src/store' + +describe('FeedItemRow.vue', () => { + 'use strict' + const localVue = createLocalVue() + let wrapper: Wrapper + + const mockItem = { + feedId: 1, + title: 'feed item', + pubDate: Date.now() / 1000, + } + const mockFeed = { + id: 1, + } + + const dispatchStub = jest.fn() + beforeAll(() => { + wrapper = shallowMount(FeedItemRow, { + propsData: { + item: mockItem, + }, + localVue, + mocks: { + $store: { + getters: { + feeds: [mockFeed], + }, + state: { + feeds: [], + folders: [], + }, + dispatch: dispatchStub, + }, + }, + }) + }) + + beforeEach(() => { + dispatchStub.mockReset() + }) + + it('should initialize without expanded and without keepUnread', () => { + expect(wrapper.vm.$data.keepUnread).toBeFalsy() + }) + + it('should expand when clicked', async () => { + await wrapper.find('.feed-item-row').trigger('click') + + expect(wrapper.vm.$data.expanded).toBe(true) + }) + + it('should format date correctly', () => { + const epoch = Date.now() // Provide an epoch timestamp + const formattedDate = (wrapper.vm as any).formatDate(epoch) + + expect(formattedDate).toEqual(new Date(epoch).toLocaleString()) + }) + + it('should format datetime correctly', () => { + const epoch = Date.now() // Provide an epoch timestamp + const formattedDate = (wrapper.vm as any).formatDatetime(epoch) + + expect(formattedDate).toEqual(new Date(epoch).toISOString()) + }) + + it('should calculate relative timestamp correctly', () => { + const currentTimestamp = Date.now() + let pastTimestamp = currentTimestamp - 1000 * 10 // 10 seconds ago + + let relativeTimestamp = (wrapper.vm as any).getRelativeTimestamp(pastTimestamp) + + expect(relativeTimestamp).toEqual('10 seconds') + + pastTimestamp = currentTimestamp - 1000 * 60 * 10 // 10 minutes ago + + relativeTimestamp = (wrapper.vm as any).getRelativeTimestamp(pastTimestamp) + + expect(relativeTimestamp).toEqual('10 minutes ago') + }) + + it('should retrieve feed by ID', () => { + const feed = (wrapper.vm as any).getFeed(mockFeed.id) + + expect(feed).toEqual(mockFeed) + }) + + describe('markRead', () => { + it('should mark item as read when keepUnread is false', () => { + wrapper.vm.$data.keepUnread = false; + (wrapper.vm as any).markRead(wrapper.vm.$props.item) + + expect(dispatchStub).toHaveBeenCalledWith(ACTIONS.MARK_READ, { + item: wrapper.vm.$props.item, + }) + }) + + it('should not mark item as read when keepUnread is true', () => { + wrapper.vm.$data.keepUnread = true; + (wrapper.vm as any).markRead(wrapper.vm.$data.item) + + expect(dispatchStub).not.toHaveBeenCalled() + }) + }) + + it('toggles keepUnread state', () => { + const initialKeepUnread = wrapper.vm.$data.keepUnread; + (wrapper.vm as any).toggleKeepUnread(wrapper.vm.$data.item) + const updatedKeepUnread = wrapper.vm.$data.keepUnread + + expect(updatedKeepUnread).toBe(!initialKeepUnread) + }) + + it('toggles starred state', () => { + wrapper.vm.$props.item.starred = true; + + (wrapper.vm as any).toggleStarred(wrapper.vm.$props.item) + expect(dispatchStub).toHaveBeenCalledWith(ACTIONS.UNSTAR_ITEM, { + item: wrapper.vm.$props.item, + }) + + wrapper.vm.$props.item.starred = false; + + (wrapper.vm as any).toggleStarred(wrapper.vm.$props.item) + expect(dispatchStub).toHaveBeenCalledWith(ACTIONS.STAR_ITEM, { + item: wrapper.vm.$props.item, + }) + }) +}) diff --git a/tests/javascript/unit/components/Starred.spec.ts b/tests/javascript/unit/components/Starred.spec.ts index 212c69f6e..36d4e53a1 100644 --- a/tests/javascript/unit/components/Starred.spec.ts +++ b/tests/javascript/unit/components/Starred.spec.ts @@ -3,7 +3,7 @@ import { shallowMount, createLocalVue, Wrapper } from '@vue/test-utils' import Starred from '../../../../src/components/Starred.vue' import VirtualScroll from '../../../../src/components/VirtualScroll.vue' -import FeedItem from '../../../../src/components/FeedItem.vue' +import FeedItemRow from '../../../../src/components/FeedItemRow.vue' jest.mock('@nextcloud/axios') @@ -47,7 +47,7 @@ describe('Explore.vue', () => { }) it('should get starred items from state', () => { - expect((wrapper.findAllComponents(FeedItem).length)).toEqual(1) + expect((wrapper.findAllComponents(FeedItemRow).length)).toEqual(1) }) it('should check starredLoaded and mounted to determine if the virtual scroll has reached end ', () => { -- cgit v1.2.3