Files
habitica/website/client/tests/unit/components/achievements/levelUp.spec.js
Bart Enkelaar 1b301e9c68 issue(11266) - Restyle level-up modal with sparkles (#12486)
* issue(11266) - Restyle level-up modal with sparkles

* issue(11266) - Add reward display to level up modal

At levels 15, 30, 40 and 60 the earned quests are now shown in the level-up modal.

* issue(11266) - Simplify css and don't use custom footer

* issue(11266) - Don't show pink bars and use colour variables
2020-08-29 16:33:06 +02:00

79 lines
2.1 KiB
JavaScript

import LevelUp from '@/components/achievements/levelUp.vue';
/*
// I couldn't get rendering to work for the modal, this is what I tried.
// Now the testing is done by overriding `this` for the exported computed
// functions directly. I intend to come back to this later to test it
// properly in a rendered component.
import { mount, createLocalVue } from '@vue/test-utils';
import BootstrapVue from 'bootstrap-vue';
import Store from '@/libs/store';
const localVue = createLocalVue();
localVue.use(Store);
localVue.use(BootstrapVue);
function createContainer () {
const container = document.createElement('div');
document.body.appendChild(container);
return container;
}
*/
describe('LevelUp', () => {
function testFunction (name, level = 10) {
return LevelUp.computed[name].bind({
user: { stats: { lvl: level } },
$t: (...args) => args.map(JSON.stringify).join(' '),
});
}
/*
// More potential rendering code
let wrapper;
beforeEach(async () => {
wrapper = mount(LevelUp, {
store: new Store({
state: { user: { data: createUser() } },
getters: {},
actions: {},
}),
propsData: {
static: true,
visible: true,
},
localVue,
mocks: { $t: string => string },
attachTo: createContainer(),
});
});
*/
it('displays the right level in the title', () => {
const title = testFunction('title', 12);
expect(title()).to.equal('"reachedLevel" {"level":12}');
});
it('does not display rewards for level 10', () => {
const displayRewardQuest = testFunction('displayRewardQuest', 10);
expect(displayRewardQuest()).to.be.false;
});
[15, 30, 40, 60].forEach(level => {
it(`does display rewards for level ${level}`, () => {
const displayRewardQuest = testFunction('displayRewardQuest', level);
expect(displayRewardQuest()).to.be.true;
});
});
it('generates the right test class for level 15', () => {
const questClass = testFunction('questClass', 15);
expect(questClass()).to.equal('scroll inventory_quest_scroll_atom1');
});
});