Vue 3 upgrade #551
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,4 @@ | ||
| FROM node:19 | ||
|
|
||
|
|
||
| EXPOSE 8080 | ||
|
|
||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,3 @@ | ||
| module.exports = { | ||
| presets: ['@vue/app'], | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,78 +1,159 @@ | ||
| import { mount as nativeMount } from '@vue/test-utils'; | ||
| import { vi } from 'vitest'; | ||
|
There was a problem hiding this comment. Do I understand correctly that we are nesting Vitest in Jest? If that's correct (just to get up to speed) why we are doing this? Again - if the answer demands too much let's skip it. I'm just fishing if there's something that should be added in the docs to explain how it works. There was a problem hiding this comment. We are not nesting it, but unfortunately we are using both jest and vitest for now. At some point we need to reconfigure eslint to use vitest, and move all subpackages that are dependent on jest to something different (and most likely reconfigure that too). |
||
| import { createVuetify } from 'vuetify'; | ||
| import { createStore } from 'vuex'; | ||
| import Vuex from 'vuex'; | ||
| import * as components from 'vuetify/components'; | ||
| import * as directives from 'vuetify/directives'; | ||
| import HacknightWrapper from '../src/components/Dashboard/Hacknight/HacknightWrapper.vue'; | ||
| import HacknightsParticipants from '../src/components/Dashboard/HacknightsParticipants/HacknightsParticipants.vue'; | ||
| import DashboardHeader from '../src/components/Dashboard/Header/DashboardHeader.vue'; | ||
| import ParticipantsSearch from '../src/components/Dashboard/Participants/ParticipantsSearch/ParticipantsSearch.vue'; | ||
| import ParticipantsList from '../src/components/Dashboard/Participants/ParticipantsList.vue'; | ||
| import ParticipantsChart from '../src/components/Dashboard/ParticipantsChart/ParticipantsChart.vue'; | ||
| import DashboardMain from '../src/components/Dashboard/DashboardMain.vue'; | ||
| import AboutUs from '../src/components/HomePage/AboutUs/AboutUs.vue'; | ||
| import ContactUs from '../src/components/HomePage/ContactUs/ContactUs.vue'; | ||
| import HomePageHeader from '../src/components/HomePage/Header/HomePageHeader.vue'; | ||
| import JoinUs from '../src/components/HomePage/JoinUs/JoinUs.vue'; | ||
| import OurProjects from '../src/components/HomePage/OurProjects/OurProjects.vue'; | ||
| import ModalContent from '../src/components/HomePage/OurProjects/ModalContent/ModalContent.vue'; | ||
| import PageFooter from '../src/components/HomePage/PageFooter/PageFooter.vue'; | ||
| import SocialMedia from '../src/components/HomePage/SocialMedia/SocialMedia.vue'; | ||
| import HomePage from '../src/components/HomePage/HomePage.vue'; | ||
| import LoginForm from '../src/components/Login/LoginForm.vue'; | ||
|
|
||
| const storeObject = { | ||
| modules: { | ||
| hacknight: { | ||
| namespaced: true, | ||
| getters: { | ||
| getHacknights: vi.fn(() => []), | ||
| getHacknight: vi.fn(() => ({ participants: [] })), | ||
| getError: vi.fn(), | ||
| }, | ||
| actions: { getHacknights: vi.fn() }, | ||
| }, | ||
| participant: { | ||
| namespaced: true, | ||
| getters: { getParticipants: vi.fn(() => []), getError: vi.fn() }, | ||
| actions: { getParticipants: vi.fn() }, | ||
| }, | ||
| auth: { | ||
| namespaced: true, | ||
| getters: { getError: vi.fn() }, | ||
| }, | ||
| contact: { | ||
| namespaced: true, | ||
| getters: { successfullySent: vi.fn(), msgErrorRaised: vi.fn() }, | ||
| }, | ||
| }, | ||
| }; | ||
|
|
||
| // mount function from @vue/test-utils | ||
| // needs this enhancement to render vuetify components correctly | ||
| // source: https://vuetifyjs.com/en/getting-started/unit-testing/#mocking-vuetify | ||
|
|
||
| export const getMountWithVuetify = () => { | ||
| const vuetify = createVuetify({ | ||
| components, | ||
| directives, | ||
| }); | ||
|
|
||
| return nativeMount({ | ||
| props: {}, | ||
| global: { | ||
| components: { | ||
| HacknightWrapper, | ||
| HacknightsParticipants, | ||
| DashboardHeader, | ||
| ParticipantsSearch, | ||
| ParticipantsList, | ||
| ParticipantsChart, | ||
| DashboardMain, | ||
| AboutUs, | ||
| ContactUs, | ||
| HomePageHeader, | ||
| JoinUs, | ||
| OurProjects, | ||
| ModalContent, | ||
| PageFooter, | ||
| SocialMedia, | ||
| HomePage, | ||
| LoginForm, | ||
| }, | ||
| plugins: [vuetify], | ||
| }, | ||
| }); | ||
| }; | ||
|
|
||
| // mount function from @vue/test-utils | ||
| // needs this enhancement to render components using vuex correctly | ||
| // source: https://vue-test-utils.vuejs.org/guides/using-with-vuex.html | ||
|
|
||
| export const getMountWithVuex = () => { | ||
| const store = createStore(storeObject); | ||
|
|
||
| return nativeMount({ | ||
| props: {}, | ||
| global: { | ||
| components: { | ||
| HacknightWrapper, | ||
| HacknightsParticipants, | ||
| DashboardHeader, | ||
| ParticipantsSearch, | ||
| ParticipantsList, | ||
| ParticipantsChart, | ||
| DashboardMain, | ||
| AboutUs, | ||
| ContactUs, | ||
| HomePageHeader, | ||
| JoinUs, | ||
| OurProjects, | ||
| ModalContent, | ||
| PageFooter, | ||
| SocialMedia, | ||
| HomePage, | ||
| LoginForm, | ||
| }, | ||
| plugins: [store], | ||
| }, | ||
| }); | ||
| }; | ||
|
|
||
| // Use this function if you need to test a component | ||
| // that uses both Vuex and Vuetify | ||
|
|
||
| export const getMountWithProviders = () => { | ||
| const store = createStore(storeObject); | ||
| const vuetify = createVuetify({ | ||
| components, | ||
| directives, | ||
| }); | ||
|
|
||
| return nativeMount({ | ||
| props: {}, | ||
| global: { | ||
| components: { | ||
| HacknightWrapper, | ||
| HacknightsParticipants, | ||
| DashboardHeader, | ||
| ParticipantsSearch, | ||
| ParticipantsList, | ||
| ParticipantsChart, | ||
| DashboardMain, | ||
| AboutUs, | ||
| ContactUs, | ||
| HomePageHeader, | ||
| JoinUs, | ||
| OurProjects, | ||
| ModalContent, | ||
| PageFooter, | ||
| SocialMedia, | ||
| HomePage, | ||
| LoginForm, | ||
| }, | ||
| plugins: [store, vuetify], | ||
| }, | ||
| }); | ||
| }; | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is it a workaround? Not sure how it works exactly but it seems that
trueis made to ignore this rule [docs here].There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
From the documentation you linked, the value
Defaults to trueIt means that there is no change in the logic. I don't remember adding that flag manually (although it is very possible that I forgot that I did it :) ) It is possible that it was added automatically when updating some package.