storj/web/satellite/tests/unit/onboardingTour/ProgressBar.spec.ts
Bill Thorp b265b7f555 satellite/console: make paywall optional
Add a config so that some percent of users require credit cards /
account balances
in order to create a project or have a promotional coupon applied

UI was updated to match needed paywall status

At this point we decided not to use a field to store if a user is in an
A/B
test, and instead just use math to see if they're in a test.  We decided
to use MD5 (because its in Postgres too) and User UUID for that math.

Change-Id: I0fcd80707dc29afc668632d078e1b5a7a24f3bb3
2020-07-28 10:57:49 +00:00

77 lines
2.3 KiB
TypeScript

// Copyright (C) 2020 Storj Labs, Inc.
// See LICENSE for copying information.
import ProgressBar from '@/components/onboardingTour/ProgressBar.vue';
import { mount } from '@vue/test-utils';
describe('ProgressBar.vue', () => {
it('renders correctly if paywall is enabled', (): void => {
const wrapper = mount(ProgressBar, {
propsData: {
isPaywallEnabled: true,
},
});
expect(wrapper).toMatchSnapshot();
});
it('renders correctly if paywall is disabled', (): void => {
const wrapper = mount(ProgressBar, {
propsData: {
isPaywallEnabled: false,
},
});
expect(wrapper).toMatchSnapshot();
});
it('renders correctly if add payment step is completed', (): void => {
const wrapper = mount(ProgressBar, {
propsData: {
isAddPaymentStep: true,
isPaywallEnabled: true,
},
});
expect(wrapper.findAll('.completed-step').length).toBe(1);
expect(wrapper.findAll('.completed-font-color').length).toBe(1);
});
it('renders correctly if create project step is completed', (): void => {
const wrapper = mount(ProgressBar, {
propsData: {
isCreateProjectStep: true,
isPaywallEnabled: true,
},
});
expect(wrapper.findAll('.completed-step').length).toBe(3);
expect(wrapper.findAll('.completed-font-color').length).toBe(2);
});
it('renders correctly if create api key step is completed', (): void => {
const wrapper = mount(ProgressBar, {
propsData: {
isCreateApiKeyStep: true,
isPaywallEnabled: true,
},
});
expect(wrapper.findAll('.completed-step').length).toBe(5);
expect(wrapper.findAll('.completed-font-color').length).toBe(3);
});
it('renders correctly if upload data step is completed', (): void => {
const wrapper = mount(ProgressBar, {
propsData: {
isUploadDataStep: true,
isPaywallEnabled: true,
},
});
expect(wrapper.findAll('.completed-step').length).toBe(7);
expect(wrapper.findAll('.completed-font-color').length).toBe(4);
});
});