cc0fca850e
WHAT: charges container view was reworked to be more user-friendly WHY: billing UI/UX enhancements Change-Id: Ice663544a1e69742a5c5fcc7123eeaa38bfbf255
88 lines
3.4 KiB
TypeScript
88 lines
3.4 KiB
TypeScript
// Copyright (C) 2020 Storj Labs, Inc.
|
|
// See LICENSE for copying information.
|
|
|
|
import Vuex from 'vuex';
|
|
|
|
import EstimatedCostsAndCredits from '@/components/account/billing/estimatedCostsAndCredits/EstimatedCostsAndCredits.vue';
|
|
|
|
import { makePaymentsModule, PAYMENTS_MUTATIONS } from '@/store/modules/payments';
|
|
import { makeProjectsModule, PROJECTS_MUTATIONS } from '@/store/modules/projects';
|
|
import { makeUsersModule, USER_MUTATIONS } from '@/store/modules/users';
|
|
import { ProjectUsageAndCharges } from '@/types/payments';
|
|
import { Project } from '@/types/projects';
|
|
import { User } from '@/types/users';
|
|
import { createLocalVue, mount } from '@vue/test-utils';
|
|
|
|
import { PaymentsMock } from '../../../mock/api/payments';
|
|
import { ProjectsApiMock } from '../../../mock/api/projects';
|
|
import { UsersApiMock } from '../../../mock/api/users';
|
|
|
|
const localVue = createLocalVue();
|
|
localVue.filter('centsToDollars', (cents: number): string => {
|
|
return `USD $${(cents / 100).toFixed(2)}`;
|
|
});
|
|
localVue.use(Vuex);
|
|
|
|
const usersApi = new UsersApiMock();
|
|
const usersModule = makeUsersModule(usersApi);
|
|
const projectsApi = new ProjectsApiMock();
|
|
const projectsModule = makeProjectsModule(projectsApi);
|
|
const paymentsApi = new PaymentsMock();
|
|
const paymentsModule = makePaymentsModule(paymentsApi);
|
|
const store = new Vuex.Store({ modules: { usersModule, projectsModule, paymentsModule }});
|
|
|
|
const project = new Project('id', 'projectName', 'projectDescription', 'test', 'testOwnerId', true);
|
|
const project1 = new Project('id1', 'projectName1', 'projectDescription1', 'test', 'testOwnerId1', false);
|
|
const user = new User('testOwnerId');
|
|
const date = new Date(1970, 1, 1);
|
|
const projectCharge = new ProjectUsageAndCharges(date, date, 100, 100, 100, 'id', 100, 100, 100);
|
|
const projectCharge1 = new ProjectUsageAndCharges(date, date, 100, 100, 100, 'id1', 100, 100, 100);
|
|
const {
|
|
SET_PROJECT_USAGE_AND_CHARGES,
|
|
SET_PRICE_SUMMARY,
|
|
} = PAYMENTS_MUTATIONS;
|
|
|
|
describe('EstimatedCostsAndCredits', (): void => {
|
|
beforeEach(() => {
|
|
spyOn(Date.prototype, 'getUTCMonth').and.returnValue(4);
|
|
spyOn(Date.prototype, 'getUTCFullYear').and.returnValue(2020);
|
|
});
|
|
|
|
it('renders correctly with project and no project usage and charges', async (): Promise<void> => {
|
|
await store.commit(USER_MUTATIONS.SET_USER, user);
|
|
await store.commit(PROJECTS_MUTATIONS.ADD, project);
|
|
|
|
const wrapper = mount(EstimatedCostsAndCredits, {
|
|
store,
|
|
localVue,
|
|
});
|
|
|
|
expect(wrapper).toMatchSnapshot();
|
|
});
|
|
|
|
it('renders correctly with project and project usage and charges', async (): Promise<void> => {
|
|
await store.commit(SET_PROJECT_USAGE_AND_CHARGES, [projectCharge]);
|
|
await store.commit(SET_PRICE_SUMMARY, [projectCharge]);
|
|
|
|
const wrapper = mount(EstimatedCostsAndCredits, {
|
|
store,
|
|
localVue,
|
|
});
|
|
|
|
expect(wrapper).toMatchSnapshot();
|
|
});
|
|
|
|
it('renders correctly with 2 projects and project usage and charges', async (): Promise<void> => {
|
|
await store.commit(PROJECTS_MUTATIONS.ADD, project1);
|
|
await store.commit(SET_PROJECT_USAGE_AND_CHARGES, [projectCharge, projectCharge1]);
|
|
await store.commit(SET_PRICE_SUMMARY, [projectCharge, projectCharge1]);
|
|
|
|
const wrapper = mount(EstimatedCostsAndCredits, {
|
|
store,
|
|
localVue,
|
|
});
|
|
|
|
expect(wrapper).toMatchSnapshot();
|
|
});
|
|
});
|