diff --git a/.editorconfig b/.editorconfig index a20e82ce2d..c68d3c80ac 100644 --- a/.editorconfig +++ b/.editorconfig @@ -1,4 +1,4 @@ -[*.{js,css,sass,scss,json,coffee,vue,html}] +[*.{js,ts,css,sass,scss,json,coffee,vue,html}] indent_style = space indent_size = 2 diff --git a/resources/assets/js/__tests__/components/artist/info.spec.ts b/resources/assets/js/__tests__/components/artist/info.spec.ts deleted file mode 100644 index ec686200cb..0000000000 --- a/resources/assets/js/__tests__/components/artist/info.spec.ts +++ /dev/null @@ -1,45 +0,0 @@ -import Component from '@/components/artist/ArtistInfo.vue' -import ArtistThumbnail from '@/components/ui/AlbumArtistThumbnail.vue' -import factory from '@/__tests__/factory' -import { shallow, mount } from '@/__tests__/adapter' - -describe('components/artist/info', () => { - it('displays the info as a sidebar by default', () => { - const wrapper = shallow(Component, { - propsData: { - artist: factory('artist') - } - }) - expect(wrapper.findAll('.artist-info.sidebar')).toHaveLength(1) - expect(wrapper.findAll('.artist-info.full')).toHaveLength(0) - }) - - it('can display the info in full mode', () => { - const wrapper = shallow(Component, { - propsData: { - artist: factory('artist'), - mode: 'full' - } - }) - expect(wrapper.findAll('.artist-info.sidebar')).toHaveLength(0) - expect(wrapper.findAll('.artist-info.full')).toHaveLength(1) - }) - - it('triggers showing full bio', () => { - const artist = factory('artist') - const wrapper = shallow(Component, { - propsData: { artist } - }) - wrapper.click('.bio button.more') - expect(wrapper.html()).toMatch(artist.info!.bio!.full) - }) - - it('shows the artist thumbnail', async () => { - const artist = factory('artist') - const wrapper = mount(Component, { - propsData: { artist } - }) - await wrapper.vm.$nextTick() - expect(wrapper.has(ArtistThumbnail)).toBe(true) - }) -}) diff --git a/resources/assets/js/__tests__/components/auth/__snapshots__/login-form.spec.ts.snap b/resources/assets/js/__tests__/components/auth/__snapshots__/login-form.spec.ts.snap deleted file mode 100644 index 43f0963803..0000000000 --- a/resources/assets/js/__tests__/components/auth/__snapshots__/login-form.spec.ts.snap +++ /dev/null @@ -1,9 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`components/auth/LoginForm renders properly 1`] = ` -
- - - Log In -
-`; diff --git a/resources/assets/js/__tests__/components/auth/login-form.spec.ts b/resources/assets/js/__tests__/components/auth/login-form.spec.ts deleted file mode 100644 index 310a6c2ec7..0000000000 --- a/resources/assets/js/__tests__/components/auth/login-form.spec.ts +++ /dev/null @@ -1,26 +0,0 @@ -import Component from '@/components/auth/LoginForm.vue' -import { userStore } from '@/stores' -import { mock } from '@/__tests__/__helpers__' -import { shallow } from '@/__tests__/adapter' - -describe('components/auth/LoginForm', () => { - afterEach(() => { - jest.resetModules() - jest.clearAllMocks() - }) - - it('renders properly', () => { - expect(shallow(Component)).toMatchSnapshot() - }) - - it('triggers login when form is submitted', () => { - const loginStub = mock(userStore, 'login') - shallow(Component, { - data: () => ({ - email: 'john@doe.com', - password: 'secret' - }) - }).submit('form') - expect(loginStub).toHaveBeenCalledWith('john@doe.com', 'secret') - }) -}) diff --git a/resources/assets/js/components/auth/LoginForm.spec.ts b/resources/assets/js/components/auth/LoginForm.spec.ts new file mode 100644 index 0000000000..902f119a90 --- /dev/null +++ b/resources/assets/js/components/auth/LoginForm.spec.ts @@ -0,0 +1,37 @@ +import { mockHelper, render } from '@/__tests__/__helpers__' +import { cleanup, fireEvent } from '@testing-library/vue' +import { beforeEach, expect, it } from 'vitest' +import { userStore } from '@/stores' +import LoginFrom from './LoginForm.vue' +import Btn from '@/components/ui/Btn.vue' + +beforeEach(() => { + mockHelper.restoreAllMocks() + cleanup() +}) + +it('renders', () => expect(render(LoginFrom, { + global: { + stubs: { + Btn + } + } +}).html()).toMatchSnapshot()) + +it('triggers login when submitted', async () => { + const mock = mockHelper.mock(userStore, 'login') + + const { getByTestId, getByPlaceholderText } = render(LoginFrom, { + global: { + stubs: { + Btn + } + } + }) + + await fireEvent.update(getByPlaceholderText('Email Address'), 'john@doe.com') + await fireEvent.update(getByPlaceholderText('Password'), 'secret') + await fireEvent.submit(getByTestId('login-form')) + + expect(mock).toHaveBeenCalledWith('john@doe.com', 'secret') +}) \ No newline at end of file diff --git a/resources/assets/js/components/auth/LoginForm.vue b/resources/assets/js/components/auth/LoginForm.vue index 6a142d617f..66023f6843 100644 --- a/resources/assets/js/components/auth/LoginForm.vue +++ b/resources/assets/js/components/auth/LoginForm.vue @@ -5,7 +5,7 @@ - Log In + Log In @@ -53,19 +53,19 @@ const login = async () => { */ @keyframes shake { 8%, 41% { - -webkit-transform: translateX(-10px); + transform: translateX(-10px); } 25%, 58% { - -webkit-transform: translateX(10px); + transform: translateX(10px); } 75% { - -webkit-transform: translateX(-5px); + transform: translateX(-5px); } 92% { - -webkit-transform: translateX(5px); + transform: translateX(5px); } 0%, 100% { - -webkit-transform: translateX(0); + transform: translateX(0); } } diff --git a/resources/assets/js/components/auth/__snapshots__/LoginForm.spec.ts.snap b/resources/assets/js/components/auth/__snapshots__/LoginForm.spec.ts.snap new file mode 100644 index 0000000000..ab06a0c16f --- /dev/null +++ b/resources/assets/js/components/auth/__snapshots__/LoginForm.spec.ts.snap @@ -0,0 +1,7 @@ +// Vitest Snapshot v1 + +exports[`renders 1`] = ` +"
+
\\"Koel's
+
" +`;