1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-05 23:44:56 +01:00
metamask-extension/ui/pages/first-time-flow/seed-phrase/confirm-seed-phrase-component.test.js

178 lines
4.8 KiB
JavaScript
Raw Normal View History

import React from 'react';
import { shallow } from 'enzyme';
import sinon from 'sinon';
import ConfirmSeedPhrase from './confirm-seed-phrase/confirm-seed-phrase.component';
2020-11-03 00:41:28 +01:00
function shallowRender(props = {}, context = {}) {
return shallow(<ConfirmSeedPhrase {...props} />, {
context: {
t: (str) => `${str}_t`,
...context,
},
});
}
describe('ConfirmSeedPhrase Component', () => {
it('should render correctly', () => {
const component = shallowRender({
seedPhrase: '鼠 牛 虎 兔 龍 蛇 馬 羊 猴 雞 狗 豬',
});
expect(
component.find('.confirm-seed-phrase__seed-word--sorted'),
).toHaveLength(12);
});
it('should add/remove selected on click', () => {
2022-03-29 15:46:24 +02:00
const trackEventSpy = sinon.spy();
const replaceSpy = sinon.spy();
const component = shallowRender(
{
seedPhrase: '鼠 牛 虎 兔 龍 蛇 馬 羊 猴 雞 狗 豬',
history: { replace: replaceSpy },
},
{
2022-03-29 15:46:24 +02:00
trackEvent: trackEventSpy,
},
);
const seeds = component.find('.confirm-seed-phrase__seed-word--sorted');
// Click on 3 seeds to add to selected
seeds.at(0).simulate('click');
seeds.at(1).simulate('click');
seeds.at(2).simulate('click');
expect(component.state().selectedSeedIndices).toStrictEqual([0, 1, 2]);
// Click on a selected seed to remove
component.state();
component.update();
component.state();
component
.find('.confirm-seed-phrase__seed-word--sorted')
.at(1)
.simulate('click');
expect(component.state().selectedSeedIndices).toStrictEqual([0, 2]);
});
it('should render correctly on hover', () => {
2022-03-29 15:46:24 +02:00
const trackEventSpy = sinon.spy();
const replaceSpy = sinon.spy();
const component = shallowRender(
{
seedPhrase: '鼠 牛 虎 兔 龍 蛇 馬 羊 猴 雞 狗 豬',
history: { replace: replaceSpy },
},
{
2022-03-29 15:46:24 +02:00
trackEvent: trackEventSpy,
},
);
const seeds = component.find('.confirm-seed-phrase__seed-word--sorted');
// Click on 3 seeds to add to selected
seeds.at(0).simulate('click');
seeds.at(1).simulate('click');
seeds.at(2).simulate('click');
// Dragging Seed # 2 to 0 placeth
component.instance().setDraggingSeedIndex(2);
component.instance().setHoveringIndex(0);
component.update();
const pendingSeeds = component.find(
2020-11-03 00:41:28 +01:00
'.confirm-seed-phrase__selected-seed-words__pending-seed',
);
expect(pendingSeeds.at(0).props().seedIndex).toStrictEqual(2);
expect(pendingSeeds.at(1).props().seedIndex).toStrictEqual(0);
expect(pendingSeeds.at(2).props().seedIndex).toStrictEqual(1);
});
it('should insert seed in place on drop', () => {
2022-03-29 15:46:24 +02:00
const trackEventSpy = sinon.spy();
const replaceSpy = sinon.spy();
const component = shallowRender(
{
seedPhrase: '鼠 牛 虎 兔 龍 蛇 馬 羊 猴 雞 狗 豬',
history: { replace: replaceSpy },
},
{
2022-03-29 15:46:24 +02:00
trackEvent: trackEventSpy,
},
);
const seeds = component.find('.confirm-seed-phrase__seed-word--sorted');
// Click on 3 seeds to add to selected
seeds.at(0).simulate('click');
seeds.at(1).simulate('click');
seeds.at(2).simulate('click');
// Drop Seed # 2 to 0 placeth
component.instance().setDraggingSeedIndex(2);
component.instance().setHoveringIndex(0);
component.instance().onDrop(0);
component.update();
expect(component.state().selectedSeedIndices).toStrictEqual([2, 0, 1]);
expect(component.state().pendingSeedIndices).toStrictEqual([2, 0, 1]);
});
it('should submit correctly', async () => {
2020-11-03 00:41:28 +01:00
const originalSeed = [
'鼠',
'牛',
'虎',
'兔',
'龍',
'蛇',
'馬',
'羊',
'猴',
'雞',
'狗',
'豬',
];
2022-03-29 15:46:24 +02:00
const trackEventSpy = sinon.spy();
const replaceSpy = sinon.spy();
const component = shallowRender(
{
seedPhrase: '鼠 牛 虎 兔 龍 蛇 馬 羊 猴 雞 狗 豬',
history: { replace: replaceSpy },
setSeedPhraseBackedUp: () => Promise.resolve(),
},
{
2022-03-29 15:46:24 +02:00
trackEvent: trackEventSpy,
},
);
const sorted = component.state().sortedSeedWords;
const seeds = component.find('.confirm-seed-phrase__seed-word--sorted');
2020-02-15 21:34:12 +01:00
originalSeed.forEach((seed) => {
const seedIndex = sorted.findIndex((s) => s === seed);
seeds.at(seedIndex).simulate('click');
});
component.update();
component.find('.first-time-flow__button').simulate('click');
await new Promise((resolve) => setTimeout(resolve, 100));
2022-03-29 15:46:24 +02:00
expect(trackEventSpy.args[0][0]).toStrictEqual({
category: 'Onboarding',
2022-08-18 23:31:07 +02:00
event: 'Wallet Created',
2022-03-29 15:46:24 +02:00
properties: {
2022-08-18 23:31:07 +02:00
account_type: 'metamask',
is_backup_skipped: false,
},
});
expect(replaceSpy.args[0][0]).toStrictEqual('/initialize/end-of-flow');
});
});