mirror of
https://github.com/lingble/chatwoot.git
synced 2025-11-03 12:37:56 +00:00
feat: Use vitest instead of jest, run all the specs anywhere in app/ folder in the CI (#9722)
Due to the pattern `**/specs/*.spec.js` defined in CircleCI, none of the frontend spec in the folders such as `specs/<domain-name>/getters.spec.js` were not executed in Circle CI. This PR fixes the issue, along with the following changes: - Use vitest instead of jest - Remove jest dependancies - Update tests to work with vitest --------- Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
This commit is contained in:
@@ -41,7 +41,6 @@
|
||||
|
||||
<script>
|
||||
import Sidebar from '../../components/layout/Sidebar.vue';
|
||||
import CommandBar from './commands/commandbar.vue';
|
||||
import { BUS_EVENTS } from 'shared/constants/busEvents';
|
||||
import WootKeyShortcutModal from 'dashboard/components/widgets/modal/WootKeyShortcutModal.vue';
|
||||
import AddAccountModal from 'dashboard/components/layout/sidebarComponents/AddAccountModal.vue';
|
||||
@@ -50,6 +49,7 @@ import AddLabelModal from 'dashboard/routes/dashboard/settings/labels/AddLabel.v
|
||||
import NotificationPanel from 'dashboard/routes/dashboard/notifications/components/NotificationPanel.vue';
|
||||
import uiSettingsMixin from 'dashboard/mixins/uiSettings';
|
||||
import wootConstants from 'dashboard/constants/globals';
|
||||
const CommandBar = () => import('./commands/commandbar.vue');
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
||||
@@ -15,7 +15,7 @@ describe('AddReminder', () => {
|
||||
});
|
||||
|
||||
it('tests resetValue', () => {
|
||||
const resetValue = jest.spyOn(wrapper.vm, 'resetValue');
|
||||
const resetValue = vi.spyOn(wrapper.vm, 'resetValue');
|
||||
wrapper.vm.content = 'test';
|
||||
wrapper.vm.date = '08/11/2022';
|
||||
wrapper.vm.resetValue();
|
||||
@@ -25,7 +25,7 @@ describe('AddReminder', () => {
|
||||
});
|
||||
|
||||
it('tests optionSelected', () => {
|
||||
const optionSelected = jest.spyOn(wrapper.vm, 'optionSelected');
|
||||
const optionSelected = vi.spyOn(wrapper.vm, 'optionSelected');
|
||||
wrapper.vm.label = '';
|
||||
wrapper.vm.optionSelected({ target: { value: 'test' } });
|
||||
expect(wrapper.vm.label).toEqual('test');
|
||||
@@ -33,7 +33,7 @@ describe('AddReminder', () => {
|
||||
});
|
||||
|
||||
it('tests onAdd', () => {
|
||||
const onAdd = jest.spyOn(wrapper.vm, 'onAdd');
|
||||
const onAdd = vi.spyOn(wrapper.vm, 'onAdd');
|
||||
wrapper.vm.label = 'label';
|
||||
wrapper.vm.content = 'content';
|
||||
wrapper.vm.date = '08/11/2022';
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
/* eslint arrow-body-style: 0 */
|
||||
import { frontendURL } from '../../../helper/URLHelper';
|
||||
const ConversationView = () => import('./ConversationView');
|
||||
const ConversationView = () => import('./ConversationView.vue');
|
||||
|
||||
export default {
|
||||
routes: [
|
||||
|
||||
@@ -59,13 +59,12 @@
|
||||
</template>
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import UpgradePage from './UpgradePage';
|
||||
import UpgradePage from './UpgradePage.vue';
|
||||
import { frontendURL } from '../../../../helper/URLHelper';
|
||||
import Sidebar from 'dashboard/components/layout/Sidebar.vue';
|
||||
import { BUS_EVENTS } from 'shared/constants/busEvents';
|
||||
import PortalPopover from '../components/PortalPopover.vue';
|
||||
import HelpCenterSidebar from '../components/Sidebar/Sidebar.vue';
|
||||
import CommandBar from 'dashboard/routes/dashboard/commands/commandbar.vue';
|
||||
import WootKeyShortcutModal from 'dashboard/components/widgets/modal/WootKeyShortcutModal.vue';
|
||||
import AccountSelector from 'dashboard/components/layout/sidebarComponents/AccountSelector.vue';
|
||||
import NotificationPanel from 'dashboard/routes/dashboard/notifications/components/NotificationPanel.vue';
|
||||
@@ -73,6 +72,8 @@ import uiSettingsMixin from 'dashboard/mixins/uiSettings';
|
||||
import portalMixin from '../mixins/portalMixin';
|
||||
import AddCategory from '../pages/categories/AddCategory.vue';
|
||||
import { FEATURE_FLAGS } from 'dashboard/featureFlags';
|
||||
const CommandBar = () =>
|
||||
import('dashboard/routes/dashboard/commands/commandbar.vue');
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
||||
@@ -1,30 +1,32 @@
|
||||
import HelpCenterLayout from './components/HelpCenterLayout';
|
||||
import HelpCenterLayout from './components/HelpCenterLayout.vue';
|
||||
import { getPortalRoute } from './helpers/routeHelper';
|
||||
|
||||
const ListAllPortals = () => import('./pages/portals/ListAllPortals');
|
||||
const NewPortal = () => import('./pages/portals/NewPortal');
|
||||
const ListAllPortals = () => import('./pages/portals/ListAllPortals.vue');
|
||||
const NewPortal = () => import('./pages/portals/NewPortal.vue');
|
||||
|
||||
const EditPortal = () => import('./pages/portals/EditPortal');
|
||||
const EditPortalBasic = () => import('./pages/portals/EditPortalBasic');
|
||||
const EditPortal = () => import('./pages/portals/EditPortal.vue');
|
||||
const EditPortalBasic = () => import('./pages/portals/EditPortalBasic.vue');
|
||||
const EditPortalCustomization = () =>
|
||||
import('./pages/portals/EditPortalCustomization');
|
||||
import('./pages/portals/EditPortalCustomization.vue');
|
||||
const EditPortalLocales = () => import('./pages/portals/EditPortalLocales.vue');
|
||||
const ShowPortal = () => import('./pages/portals/ShowPortal');
|
||||
const PortalDetails = () => import('./pages/portals/PortalDetails');
|
||||
const PortalCustomization = () => import('./pages/portals/PortalCustomization');
|
||||
const ShowPortal = () => import('./pages/portals/ShowPortal.vue');
|
||||
const PortalDetails = () => import('./pages/portals/PortalDetails.vue');
|
||||
const PortalCustomization = () =>
|
||||
import('./pages/portals/PortalCustomization.vue');
|
||||
const PortalSettingsFinish = () =>
|
||||
import('./pages/portals/PortalSettingsFinish');
|
||||
import('./pages/portals/PortalSettingsFinish.vue');
|
||||
|
||||
const ListAllCategories = () => import('./pages/categories/ListAllCategories');
|
||||
const NewCategory = () => import('./pages/categories/NewCategory');
|
||||
const EditCategory = () => import('./pages/categories/EditCategory');
|
||||
const ListAllCategories = () =>
|
||||
import('./pages/categories/ListAllCategories.vue');
|
||||
const NewCategory = () => import('./pages/categories/NewCategory.vue');
|
||||
const EditCategory = () => import('./pages/categories/EditCategory.vue');
|
||||
const ListCategoryArticles = () =>
|
||||
import('./pages/articles/ListCategoryArticles');
|
||||
const ListAllArticles = () => import('./pages/articles/ListAllArticles');
|
||||
import('./pages/articles/ListCategoryArticles.vue');
|
||||
const ListAllArticles = () => import('./pages/articles/ListAllArticles.vue');
|
||||
const DefaultPortalArticles = () =>
|
||||
import('./pages/articles/DefaultPortalArticles');
|
||||
const NewArticle = () => import('./pages/articles/NewArticle');
|
||||
const EditArticle = () => import('./pages/articles/EditArticle');
|
||||
import('./pages/articles/DefaultPortalArticles.vue');
|
||||
const NewArticle = () => import('./pages/articles/NewArticle.vue');
|
||||
const EditArticle = () => import('./pages/articles/EditArticle.vue');
|
||||
|
||||
const portalRoutes = [
|
||||
{
|
||||
|
||||
@@ -36,7 +36,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const EmojiInput = () => import('shared/components/emoji/EmojiInput');
|
||||
const EmojiInput = () => import('shared/components/emoji/EmojiInput.vue');
|
||||
|
||||
export default {
|
||||
components: { EmojiInput },
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
import Facebook from './channels/Facebook';
|
||||
import Website from './channels/Website';
|
||||
import Twitter from './channels/Twitter';
|
||||
import Api from './channels/Api';
|
||||
import Email from './channels/Email';
|
||||
import Sms from './channels/Sms';
|
||||
import Whatsapp from './channels/Whatsapp';
|
||||
import Line from './channels/Line';
|
||||
import Telegram from './channels/Telegram';
|
||||
import Facebook from './channels/Facebook.vue';
|
||||
import Website from './channels/Website.vue';
|
||||
import Twitter from './channels/Twitter.vue';
|
||||
import Api from './channels/Api.vue';
|
||||
import Email from './channels/Email.vue';
|
||||
import Sms from './channels/Sms.vue';
|
||||
import Whatsapp from './channels/Whatsapp.vue';
|
||||
import Line from './channels/Line.vue';
|
||||
import Telegram from './channels/Telegram.vue';
|
||||
|
||||
const channelViewList = {
|
||||
facebook: Facebook,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { shallowMount, createLocalVue } from '@vue/test-utils';
|
||||
import Vuex from 'vuex';
|
||||
import ReportsFiltersAgents from '../../Filters/Agents';
|
||||
import ReportsFiltersAgents from '../../Filters/Agents.vue';
|
||||
|
||||
const localVue = createLocalVue();
|
||||
localVue.use(Vuex);
|
||||
@@ -16,7 +16,7 @@ const mockStore = new Vuex.Store({
|
||||
getAgents: state => state.agents,
|
||||
},
|
||||
actions: {
|
||||
get: jest.fn(),
|
||||
get: vi.fn(),
|
||||
},
|
||||
},
|
||||
},
|
||||
@@ -50,7 +50,7 @@ describe('ReportsFiltersAgents.vue', () => {
|
||||
});
|
||||
|
||||
it('dispatches the "agents/get" action when the component is mounted', () => {
|
||||
const dispatchSpy = jest.spyOn(mockStore, 'dispatch');
|
||||
const dispatchSpy = vi.spyOn(mockStore, 'dispatch');
|
||||
|
||||
shallowMount(ReportsFiltersAgents, mountParams);
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { shallowMount } from '@vue/test-utils';
|
||||
import ReportsFiltersDateGroupBy from '../../Filters/DateGroupBy';
|
||||
import ReportsFiltersDateGroupBy from '../../Filters/DateGroupBy.vue';
|
||||
import { GROUP_BY_OPTIONS } from '../../../constants';
|
||||
|
||||
const mountParams = {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { shallowMount } from '@vue/test-utils';
|
||||
import ReportFiltersDateRange from '../../Filters/DateRange';
|
||||
import ReportFiltersDateRange from '../../Filters/DateRange.vue';
|
||||
import { DATE_RANGE_OPTIONS } from '../../../constants';
|
||||
|
||||
const mountParams = {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { shallowMount, createLocalVue } from '@vue/test-utils';
|
||||
import Vuex from 'vuex';
|
||||
import ReportsFiltersInboxes from '../../Filters/Inboxes';
|
||||
import ReportsFiltersInboxes from '../../Filters/Inboxes.vue';
|
||||
|
||||
const localVue = createLocalVue();
|
||||
localVue.use(Vuex);
|
||||
@@ -26,7 +26,7 @@ describe('ReportsFiltersInboxes.vue', () => {
|
||||
],
|
||||
},
|
||||
actions: {
|
||||
get: jest.fn(),
|
||||
get: vi.fn(),
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { shallowMount, createLocalVue } from '@vue/test-utils';
|
||||
import Vuex from 'vuex';
|
||||
import ReportsFiltersLabels from '../../Filters/Labels';
|
||||
import ReportsFiltersLabels from '../../Filters/Labels.vue';
|
||||
|
||||
const localVue = createLocalVue();
|
||||
localVue.use(Vuex);
|
||||
@@ -26,7 +26,7 @@ describe('ReportsFiltersLabels.vue', () => {
|
||||
],
|
||||
},
|
||||
actions: {
|
||||
get: jest.fn(),
|
||||
get: vi.fn(),
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { shallowMount, createLocalVue } from '@vue/test-utils';
|
||||
import ReportFiltersRatings from '../../Filters/Ratings';
|
||||
import ReportFiltersRatings from '../../Filters/Ratings.vue';
|
||||
import { CSAT_RATINGS } from 'shared/constants/messages';
|
||||
|
||||
const mountParams = {
|
||||
|
||||
@@ -26,7 +26,7 @@ describe('ReportsFiltersTeams.vue', () => {
|
||||
],
|
||||
},
|
||||
actions: {
|
||||
get: jest.fn(),
|
||||
get: vi.fn(),
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
||||
|
||||
exports[`CsatMetrics.vue computes response count correctly 1`] = `
|
||||
<div class="flex-col lg:flex-row flex flex-wrap mx-0 bg-white dark:bg-slate-800 rounded-[4px] p-4 mb-5 border border-solid border-slate-75 dark:border-slate-700">
|
||||
exports[`CsatMetrics.vue > computes response count correctly 1`] = `
|
||||
"<div class="flex-col lg:flex-row flex flex-wrap mx-0 bg-white dark:bg-slate-800 rounded-[4px] p-4 mb-5 border border-solid border-slate-75 dark:border-slate-700">
|
||||
<csat-metric-card-stub label="CSAT_REPORTS.METRIC.TOTAL_RESPONSES.LABEL" value="100" infotext="CSAT_REPORTS.METRIC.TOTAL_RESPONSES.TOOLTIP" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]"></csat-metric-card-stub>
|
||||
<csat-metric-card-stub label="CSAT_REPORTS.METRIC.SATISFACTION_SCORE.LABEL" value="--" infotext="CSAT_REPORTS.METRIC.SATISFACTION_SCORE.TOOLTIP" disabled="true" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]"></csat-metric-card-stub>
|
||||
<csat-metric-card-stub label="CSAT_REPORTS.METRIC.RESPONSE_RATE.LABEL" value="90%" infotext="CSAT_REPORTS.METRIC.RESPONSE_RATE.TOOLTIP" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]"></csat-metric-card-stub>
|
||||
<!---->
|
||||
</div>
|
||||
</div>"
|
||||
`;
|
||||
|
||||
@@ -1,18 +1,11 @@
|
||||
import 'expect-more-jest';
|
||||
import { validateAuthenticateRoutePermission } from './index';
|
||||
|
||||
jest.mock('./dashboard/dashboard.routes', () => ({
|
||||
routes: [],
|
||||
}));
|
||||
window.roleWiseRoutes = {};
|
||||
|
||||
describe('#validateAuthenticateRoutePermission', () => {
|
||||
describe(`when route is protected`, () => {
|
||||
describe(`when user not logged in`, () => {
|
||||
it(`should redirect to login`, () => {
|
||||
// Arrange
|
||||
const to = { name: 'some-protected-route', params: { accountId: 1 } };
|
||||
const next = jest.fn();
|
||||
const next = vi.fn();
|
||||
const getters = {
|
||||
isLoggedIn: false,
|
||||
getCurrentUser: {
|
||||
@@ -30,14 +23,18 @@ describe('#validateAuthenticateRoutePermission', () => {
|
||||
describe(`when user is logged in`, () => {
|
||||
describe(`when route is not accessible to current user`, () => {
|
||||
it(`should redirect to dashboard`, () => {
|
||||
window.roleWiseRoutes.agent = ['dashboard'];
|
||||
const to = { name: 'admin', params: { accountId: 1 } };
|
||||
const next = jest.fn();
|
||||
const to = {
|
||||
name: 'general_settings_index',
|
||||
params: { accountId: 1 },
|
||||
meta: { permissions: ['administrator'] },
|
||||
};
|
||||
const next = vi.fn();
|
||||
const getters = {
|
||||
isLoggedIn: true,
|
||||
getCurrentUser: {
|
||||
account_id: 1,
|
||||
id: 1,
|
||||
permissions: ['agent'],
|
||||
accounts: [{ id: 1, role: 'agent', status: 'active' }],
|
||||
},
|
||||
};
|
||||
@@ -47,15 +44,19 @@ describe('#validateAuthenticateRoutePermission', () => {
|
||||
});
|
||||
describe(`when route is accessible to current user`, () => {
|
||||
it(`should go there`, () => {
|
||||
window.roleWiseRoutes.agent = ['dashboard', 'admin'];
|
||||
const to = { name: 'admin', params: { accountId: 1 } };
|
||||
const next = jest.fn();
|
||||
const to = {
|
||||
name: 'general_settings_index',
|
||||
params: { accountId: 1 },
|
||||
meta: { permissions: ['administrator'] },
|
||||
};
|
||||
const next = vi.fn();
|
||||
const getters = {
|
||||
isLoggedIn: true,
|
||||
getCurrentUser: {
|
||||
account_id: 1,
|
||||
id: 1,
|
||||
accounts: [{ id: 1, role: 'agent', status: 'active' }],
|
||||
permissions: ['administrator'],
|
||||
accounts: [{ id: 1, role: 'administrator', status: 'active' }],
|
||||
},
|
||||
};
|
||||
validateAuthenticateRoutePermission(to, next, { getters });
|
||||
|
||||
Reference in New Issue
Block a user