Move initialization out of constructor
This commit is contained in:
Bartek Fabiszewski
parent
baf39cf818
commit
c77ee300c7
@ -32,7 +32,14 @@ export default class ConfigViewModel extends ViewModel {
|
||||
super(config);
|
||||
this.state = state;
|
||||
this.model.onSetInterval = () => this.setAutoReloadInterval();
|
||||
}
|
||||
|
||||
init() {
|
||||
this.setObservers();
|
||||
this.bindAll();
|
||||
}
|
||||
|
||||
setObservers() {
|
||||
this.onChanged('mapApi', (api) => {
|
||||
uUtils.setCookie('api', api);
|
||||
});
|
||||
|
||||
@ -64,20 +64,11 @@ export default class TrackViewModel extends ViewModel {
|
||||
this.select = new uSelect(listEl);
|
||||
this.state = state;
|
||||
this.timerId = 0;
|
||||
this.setObservers();
|
||||
this.init();
|
||||
}
|
||||
|
||||
setClickHandlers() {
|
||||
this.model.onReload = () => this.onReload();
|
||||
const exportCb = (type) => () => {
|
||||
if (this.state.currentTrack) {
|
||||
this.state.currentTrack.export(type);
|
||||
}
|
||||
};
|
||||
this.model.onExportGpx = exportCb('gpx');
|
||||
this.model.onExportKml = exportCb('kml');
|
||||
this.model.onImportGpx = () => this.importEl.click();
|
||||
init() {
|
||||
this.setObservers();
|
||||
this.bindAll();
|
||||
}
|
||||
|
||||
setObservers() {
|
||||
@ -124,6 +115,18 @@ export default class TrackViewModel extends ViewModel {
|
||||
});
|
||||
}
|
||||
|
||||
setClickHandlers() {
|
||||
this.model.onReload = () => this.onReload();
|
||||
const exportCb = (type) => () => {
|
||||
if (this.state.currentTrack) {
|
||||
this.state.currentTrack.export(type);
|
||||
}
|
||||
};
|
||||
this.model.onExportGpx = exportCb('gpx');
|
||||
this.model.onExportKml = exportCb('kml');
|
||||
this.model.onImportGpx = () => this.importEl.click();
|
||||
}
|
||||
|
||||
/**
|
||||
* Reload or update track view
|
||||
* @param {boolean} clear Reload if true, update current track otherwise
|
||||
@ -253,10 +256,6 @@ export default class TrackViewModel extends ViewModel {
|
||||
.catch((e) => { uUtils.error(e, `${lang.strings['actionfailure']}\n${e.message}`); });
|
||||
}
|
||||
|
||||
init() {
|
||||
this.bindAll();
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {boolean} start
|
||||
*/
|
||||
|
||||
@ -42,22 +42,10 @@ export default class UserViewModel extends ViewModel {
|
||||
const listEl = document.querySelector('#user');
|
||||
this.select = new uSelect(listEl, lang.strings['suser'], `- ${lang.strings['allusers']} -`);
|
||||
this.state = state;
|
||||
this.onChanged('userList', (list) => { this.select.setOptions(list); });
|
||||
this.onChanged('currentUserId', (listValue) => {
|
||||
this.state.showAllUsers = listValue === uSelect.allValue;
|
||||
this.state.currentUser = this.model.userList.find((_user) => _user.listValue === listValue) || null;
|
||||
});
|
||||
state.onChanged('showLatest', (showLatest) => {
|
||||
if (showLatest) {
|
||||
this.select.showAllOption();
|
||||
} else {
|
||||
this.select.hideAllOption();
|
||||
}
|
||||
});
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
this.setObservers(this.state);
|
||||
this.bindAll();
|
||||
uUser.fetchList()
|
||||
.then((_users) => {
|
||||
@ -76,4 +64,24 @@ export default class UserViewModel extends ViewModel {
|
||||
.catch((e) => { uUtils.error(e, `${lang.strings['actionfailure']}\n${e.message}`); });
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {uState} state
|
||||
*/
|
||||
setObservers(state) {
|
||||
this.onChanged('userList', (list) => {
|
||||
this.select.setOptions(list);
|
||||
});
|
||||
this.onChanged('currentUserId', (listValue) => {
|
||||
this.state.showAllUsers = listValue === uSelect.allValue;
|
||||
this.state.currentUser = this.model.userList.find((_user) => _user.listValue === listValue) || null;
|
||||
});
|
||||
state.onChanged('showLatest', (showLatest) => {
|
||||
if (showLatest) {
|
||||
this.select.showAllOption();
|
||||
} else {
|
||||
this.select.hideAllOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -20,7 +20,6 @@
|
||||
import ConfigViewModel from '../src/configviewmodel.js';
|
||||
import ViewModel from '../src/viewmodel.js';
|
||||
import { config } from '../src/initializer.js';
|
||||
import uObserve from '../src/observe.js';
|
||||
import uState from '../src/state.js';
|
||||
import uUtils from '../src/utils.js';
|
||||
|
||||
@ -45,10 +44,10 @@ describe('ConfigViewModel tests', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
config.reinitialize();
|
||||
uObserve.setSilently(config, 'interval', 10);
|
||||
uObserve.setSilently(config, 'lang', 'en');
|
||||
uObserve.setSilently(config, 'units', 'metric');
|
||||
uObserve.setSilently(config, 'mapApi', 'gmaps');
|
||||
config.interval = 10;
|
||||
config.lang = 'en';
|
||||
config.units = 'metric';
|
||||
config.mapApi = 'gmaps';
|
||||
|
||||
const fixture = `<div id="fixture">
|
||||
<div class="section">
|
||||
@ -85,6 +84,7 @@ describe('ConfigViewModel tests', () => {
|
||||
setIntervalEl = document.querySelector('#set-interval');
|
||||
state = new uState();
|
||||
vm = new ConfigViewModel(state);
|
||||
vm.init();
|
||||
spyOn(uUtils, 'setCookie').and.returnValue(newInterval);
|
||||
spyOn(ConfigViewModel, 'reload');
|
||||
});
|
||||
|
||||
@ -109,19 +109,17 @@ describe('TrackViewModel tests', () => {
|
||||
});
|
||||
|
||||
it('should create instance with state as parameter', () => {
|
||||
// when
|
||||
const trackViewModel = new TrackViewModel(state);
|
||||
// then
|
||||
expect(trackViewModel).toBeInstanceOf(ViewModel);
|
||||
expect(trackViewModel.importEl).toBeInstanceOf(HTMLInputElement);
|
||||
expect(trackViewModel.select.element).toBeInstanceOf(HTMLSelectElement);
|
||||
expect(trackViewModel.state).toBe(state);
|
||||
expect(vm).toBeInstanceOf(ViewModel);
|
||||
expect(vm.importEl).toBeInstanceOf(HTMLInputElement);
|
||||
expect(vm.select.element).toBeInstanceOf(HTMLSelectElement);
|
||||
expect(vm.state).toBe(state);
|
||||
});
|
||||
|
||||
it('should load track list and fetch first track on current user change', (done) => {
|
||||
// given
|
||||
spyOn(uTrack, 'fetchList').and.returnValue(Promise.resolve(tracks));
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(positions));
|
||||
vm.init();
|
||||
// when
|
||||
state.currentUser = user;
|
||||
// then
|
||||
@ -144,6 +142,7 @@ describe('TrackViewModel tests', () => {
|
||||
// given
|
||||
spyOn(uTrack, 'fetchList').and.returnValue(Promise.resolve([]));
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(positions));
|
||||
vm.init();
|
||||
// when
|
||||
state.currentUser = user;
|
||||
// then
|
||||
@ -164,8 +163,9 @@ describe('TrackViewModel tests', () => {
|
||||
positions[0].trackname = track2.name;
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(positions));
|
||||
spyOn(uTrack, 'fetchList').and.returnValue(Promise.resolve(tracks));
|
||||
uObserve.setSilently(vm.model, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
vm.model.showLatest = true;
|
||||
state.showLatest = true;
|
||||
vm.init();
|
||||
// when
|
||||
state.currentUser = user;
|
||||
// then
|
||||
@ -188,10 +188,11 @@ describe('TrackViewModel tests', () => {
|
||||
// given
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
vm.init();
|
||||
// when
|
||||
state.currentUser = null;
|
||||
// then
|
||||
@ -209,10 +210,11 @@ describe('TrackViewModel tests', () => {
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(positions));
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
vm.init();
|
||||
// when
|
||||
trackEl.value = track2.listValue;
|
||||
trackEl.dispatchEvent(new Event('change'));
|
||||
@ -239,10 +241,11 @@ describe('TrackViewModel tests', () => {
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
vm.init();
|
||||
// when
|
||||
latestEl.checked = true;
|
||||
latestEl.dispatchEvent(new Event('change'));
|
||||
@ -273,10 +276,11 @@ describe('TrackViewModel tests', () => {
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
vm.init();
|
||||
// when
|
||||
latestEl.checked = true;
|
||||
latestEl.dispatchEvent(new Event('change'));
|
||||
@ -306,11 +310,12 @@ describe('TrackViewModel tests', () => {
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(vm.model, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
vm.model.showLatest = true;
|
||||
state.currentUser = user;
|
||||
state.showLatest = true;
|
||||
vm.init();
|
||||
state.currentTrack = track1;
|
||||
latestEl.checked = true;
|
||||
// when
|
||||
@ -339,12 +344,13 @@ describe('TrackViewModel tests', () => {
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(positions));
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
state.showLatest = true;
|
||||
latestEl.checked = true;
|
||||
vm.init();
|
||||
// when
|
||||
state.showAllUsers = true;
|
||||
// then
|
||||
@ -366,14 +372,15 @@ describe('TrackViewModel tests', () => {
|
||||
it('should clear current track if "show latest" is unchecked when "all users" is set', (done) => {
|
||||
// given
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(positions));
|
||||
uObserve.setSilently(vm.model, 'trackList', []);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', '');
|
||||
uObserve.setSilently(vm.model, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'currentUser', null);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'showAllUsers', true);
|
||||
vm.model.trackList = [];
|
||||
vm.model.currentTrackId = '';
|
||||
vm.model.showLatest = true;
|
||||
state.currentUser = null;
|
||||
state.showLatest = true;
|
||||
state.showAllUsers = true;
|
||||
state.currentTrack = TrackFactory.getPositionSet(1);
|
||||
latestEl.checked = true;
|
||||
vm.init();
|
||||
// when
|
||||
latestEl.checked = false;
|
||||
latestEl.dispatchEvent(new Event('change'));
|
||||
@ -394,13 +401,14 @@ describe('TrackViewModel tests', () => {
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(positions));
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(vm.model, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
vm.model.showLatest = true;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
state.showLatest = true;
|
||||
latestEl.checked = true;
|
||||
vm.init();
|
||||
// when
|
||||
trackEl.value = track2.listValue;
|
||||
trackEl.dispatchEvent(new Event('change'));
|
||||
@ -416,7 +424,8 @@ describe('TrackViewModel tests', () => {
|
||||
it('should export track to KML on link click', (done) => {
|
||||
// given
|
||||
spyOn(track1, 'export');
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
state.currentTrack = track1;
|
||||
vm.init();
|
||||
// when
|
||||
exportKmlEl.click();
|
||||
// then
|
||||
@ -429,7 +438,8 @@ describe('TrackViewModel tests', () => {
|
||||
it('should export track to GPX on link click', (done) => {
|
||||
// given
|
||||
spyOn(track1, 'export');
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
state.currentTrack = track1;
|
||||
vm.init();
|
||||
// when
|
||||
exportGpxEl.click();
|
||||
// then
|
||||
@ -455,16 +465,17 @@ describe('TrackViewModel tests', () => {
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
inputFileEl.onclick = () => {
|
||||
const dt = new DataTransfer();
|
||||
dt.items.add(file);
|
||||
inputFileEl.files = dt.files;
|
||||
inputFileEl.dispatchEvent(new Event('change'));
|
||||
};
|
||||
vm.init();
|
||||
// when
|
||||
importGpxEl.click();
|
||||
// then
|
||||
@ -496,16 +507,17 @@ describe('TrackViewModel tests', () => {
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', tracks);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = tracks;
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
inputFileEl.onclick = () => {
|
||||
const dt = new DataTransfer();
|
||||
dt.items.add(new File([ '12345678901' ], 'filepath.gpx'));
|
||||
inputFileEl.files = dt.files;
|
||||
inputFileEl.dispatchEvent(new Event('change'));
|
||||
};
|
||||
vm.init();
|
||||
// when
|
||||
importGpxEl.click();
|
||||
// then
|
||||
@ -527,6 +539,7 @@ describe('TrackViewModel tests', () => {
|
||||
spyOn(vm, 'stopAutoReload');
|
||||
spyOn(vm, 'startAutoReload');
|
||||
vm.timerId = 1;
|
||||
vm.init();
|
||||
// when
|
||||
config.interval = newInterval;
|
||||
// then
|
||||
@ -546,8 +559,9 @@ describe('TrackViewModel tests', () => {
|
||||
autoReloadEl.dispatchEvent(new Event('change'));
|
||||
});
|
||||
autoReloadEl.checked = false;
|
||||
uObserve.setSilently(config, 'interval', 0.001);
|
||||
config.interval = 0.001;
|
||||
vm.timerId = 0;
|
||||
vm.init();
|
||||
// when
|
||||
autoReloadEl.checked = true;
|
||||
autoReloadEl.dispatchEvent(new Event('change'));
|
||||
@ -570,10 +584,11 @@ describe('TrackViewModel tests', () => {
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
const posLength = track1.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', [ track1, track2 ]);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = [ track1, track2 ];
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
vm.init();
|
||||
// when
|
||||
forceReloadEl.click();
|
||||
// then
|
||||
@ -595,13 +610,14 @@ describe('TrackViewModel tests', () => {
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', [ track1, track2 ]);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(vm.model, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
vm.model.trackList = [ track1, track2 ];
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
vm.model.showLatest = true;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
state.showLatest = true;
|
||||
latestEl.checked = true;
|
||||
vm.init();
|
||||
// when
|
||||
forceReloadEl.click();
|
||||
// then
|
||||
@ -625,13 +641,14 @@ describe('TrackViewModel tests', () => {
|
||||
const options = '<option selected value="1">track1</option><option value="2">track2</option>';
|
||||
trackEl.insertAdjacentHTML('afterbegin', options);
|
||||
const optLength = trackEl.options.length;
|
||||
uObserve.setSilently(vm.model, 'trackList', [ track1, track2 ]);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', track1.listValue);
|
||||
uObserve.setSilently(vm.model, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'currentTrack', track1);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
vm.model.trackList = [ track1, track2 ];
|
||||
vm.model.currentTrackId = track1.listValue;
|
||||
vm.model.showLatest = true;
|
||||
state.currentTrack = track1;
|
||||
state.currentUser = user;
|
||||
state.showLatest = true;
|
||||
latestEl.checked = true;
|
||||
vm.init();
|
||||
// when
|
||||
forceReloadEl.click();
|
||||
// then
|
||||
@ -654,14 +671,15 @@ describe('TrackViewModel tests', () => {
|
||||
set.positions[1].trackid = track2.id;
|
||||
set.positions[1].trackname = track2.name;
|
||||
spyOn(uPositionSet, 'fetch').and.returnValue(Promise.resolve(set.positions));
|
||||
uObserve.setSilently(vm.model, 'trackList', []);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', '');
|
||||
uObserve.setSilently(vm.model, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'currentTrack', null);
|
||||
uObserve.setSilently(state, 'currentUser', null);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
uObserve.setSilently(state, 'showAllUsers', true);
|
||||
vm.model.trackList = [];
|
||||
vm.model.currentTrackId = '';
|
||||
vm.model.showLatest = true;
|
||||
state.currentTrack = null;
|
||||
state.currentUser = null;
|
||||
state.showLatest = true;
|
||||
state.showAllUsers = true;
|
||||
latestEl.checked = true;
|
||||
vm.init();
|
||||
// when
|
||||
forceReloadEl.click();
|
||||
// then
|
||||
@ -679,10 +697,11 @@ describe('TrackViewModel tests', () => {
|
||||
it('should fetch track list if user is selected and no track is selected', (done) => {
|
||||
// given
|
||||
spyOn(uTrack, 'fetchList').and.returnValue(Promise.resolve([]));
|
||||
uObserve.setSilently(vm.model, 'trackList', []);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', '');
|
||||
uObserve.setSilently(state, 'currentTrack', null);
|
||||
uObserve.setSilently(state, 'currentUser', user);
|
||||
vm.model.trackList = [];
|
||||
vm.model.currentTrackId = '';
|
||||
state.currentTrack = null;
|
||||
state.currentUser = user;
|
||||
vm.init();
|
||||
// when
|
||||
forceReloadEl.click();
|
||||
// then
|
||||
@ -699,10 +718,11 @@ describe('TrackViewModel tests', () => {
|
||||
// given
|
||||
spyOn(uTrack, 'fetchList');
|
||||
spyOn(uPositionSet, 'fetch');
|
||||
uObserve.setSilently(vm.model, 'trackList', []);
|
||||
uObserve.setSilently(vm.model, 'currentTrackId', '');
|
||||
uObserve.setSilently(state, 'currentTrack', null);
|
||||
uObserve.setSilently(state, 'currentUser', null);
|
||||
vm.model.trackList = [];
|
||||
vm.model.currentTrackId = '';
|
||||
state.currentTrack = null;
|
||||
state.currentUser = null;
|
||||
vm.init();
|
||||
// when
|
||||
forceReloadEl.click();
|
||||
// then
|
||||
|
||||
@ -20,7 +20,6 @@
|
||||
import { auth, config, lang } from '../src/initializer.js';
|
||||
import UserViewModel from '../src/userviewmodel.js';
|
||||
import ViewModel from '../src/viewmodel.js';
|
||||
import uObserve from '../src/observe.js';
|
||||
import uSelect from '../src/select.js';
|
||||
import uState from '../src/state.js';
|
||||
import uUser from '../src/user.js';
|
||||
@ -33,6 +32,7 @@ describe('UserViewModel tests', () => {
|
||||
let users;
|
||||
/** @type {HTMLSelectElement} */
|
||||
let userEl;
|
||||
let vm;
|
||||
|
||||
beforeEach(() => {
|
||||
const fixture = `<div id="fixture">
|
||||
@ -51,6 +51,7 @@ describe('UserViewModel tests', () => {
|
||||
user1 = new uUser(1, 'user1');
|
||||
user2 = new uUser(2, 'user2');
|
||||
users = [ user1, user2 ];
|
||||
vm = new UserViewModel(state);
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
@ -58,16 +59,27 @@ describe('UserViewModel tests', () => {
|
||||
auth.user = null;
|
||||
});
|
||||
|
||||
it('should create instance with state as parameter and load user list and select first user on list', (done) => {
|
||||
it('should create instance with state as parameter', () => {
|
||||
// given
|
||||
spyOn(uUser, 'fetchList').and.returnValue(Promise.resolve(users));
|
||||
// when
|
||||
const vm = new UserViewModel(state);
|
||||
// then
|
||||
expect(vm).toBeInstanceOf(ViewModel);
|
||||
expect(vm.select.element).toBeInstanceOf(HTMLSelectElement);
|
||||
expect(vm.state).toBe(state);
|
||||
expect(userEl.value).toBe('0');
|
||||
expect(userEl.options.length).toBe(1);
|
||||
expect(userEl.options[0].selected).toBe(true);
|
||||
expect(userEl.options[0].value).toBe('0');
|
||||
});
|
||||
|
||||
it('should load user list and select first user on list', (done) => {
|
||||
// given
|
||||
spyOn(uUser, 'fetchList').and.returnValue(Promise.resolve(users));
|
||||
// when
|
||||
vm.init();
|
||||
// then
|
||||
setTimeout(() => {
|
||||
expect(vm).toBeInstanceOf(ViewModel);
|
||||
expect(vm.select.element).toBeInstanceOf(HTMLSelectElement);
|
||||
expect(vm.state).toBe(state);
|
||||
expect(vm.model.userList.length).toBe(users.length);
|
||||
expect(userEl.value).toBe(user1.listValue);
|
||||
expect(userEl.options.length).toBe(users.length + 1);
|
||||
@ -77,17 +89,14 @@ describe('UserViewModel tests', () => {
|
||||
}, 100);
|
||||
});
|
||||
|
||||
it('should create instance with state as parameter and load user list and select authorized user on list', (done) => {
|
||||
it('should load user list and select authorized user on list', (done) => {
|
||||
// given
|
||||
spyOn(uUser, 'fetchList').and.returnValue(Promise.resolve(users));
|
||||
// when
|
||||
auth.user = user2;
|
||||
const vm = new UserViewModel(state);
|
||||
vm.init();
|
||||
// then
|
||||
setTimeout(() => {
|
||||
expect(vm).toBeInstanceOf(ViewModel);
|
||||
expect(vm.select.element).toBeInstanceOf(HTMLSelectElement);
|
||||
expect(vm.state).toBe(state);
|
||||
expect(vm.model.userList.length).toBe(users.length);
|
||||
expect(userEl.value).toBe(user2.listValue);
|
||||
expect(userEl.options.length).toBe(users.length + 1);
|
||||
@ -99,14 +108,13 @@ describe('UserViewModel tests', () => {
|
||||
|
||||
it('should change current user on user list option selected', (done) => {
|
||||
// given
|
||||
spyOn(UserViewModel.prototype, 'init');
|
||||
const vm = new UserViewModel(state);
|
||||
uObserve.setSilently(state, 'currentUser', user1);
|
||||
uObserve.setSilently(vm.model, 'userList', users);
|
||||
uObserve.setSilently(vm.model, 'currentUserId', user1.listValue);
|
||||
state.currentUser = user1;
|
||||
vm.model.userList = users;
|
||||
vm.model.currentUserId = user1.listValue;
|
||||
const options = '<option selected value="1">user1</option><option value="2">user2</option>';
|
||||
userEl.insertAdjacentHTML('beforeend', options);
|
||||
const optLength = userEl.options.length;
|
||||
vm.setObservers(state);
|
||||
vm.bindAll();
|
||||
// when
|
||||
userEl.value = user2.listValue;
|
||||
@ -124,15 +132,14 @@ describe('UserViewModel tests', () => {
|
||||
|
||||
it('should set showAllUsers state on "all users" option selected', (done) => {
|
||||
// given
|
||||
spyOn(UserViewModel.prototype, 'init');
|
||||
const vm = new UserViewModel(state);
|
||||
uObserve.setSilently(state, 'currentUser', user1);
|
||||
uObserve.setSilently(state, 'showAllUsers', false);
|
||||
uObserve.setSilently(vm.model, 'userList', users);
|
||||
uObserve.setSilently(vm.model, 'currentUserId', user1.listValue);
|
||||
state.currentUser = user1;
|
||||
state.showAllUsers = false;
|
||||
vm.model.userList = users;
|
||||
vm.model.currentUserId = user1.listValue;
|
||||
const options = `<option value="${uSelect.allValue}">all users</option><option selected value="1">user1</option><option value="2">user2</option>`;
|
||||
userEl.insertAdjacentHTML('beforeend', options);
|
||||
const optLength = userEl.options.length;
|
||||
vm.setObservers(state);
|
||||
vm.bindAll();
|
||||
// when
|
||||
userEl.value = uSelect.allValue;
|
||||
@ -151,16 +158,15 @@ describe('UserViewModel tests', () => {
|
||||
|
||||
it('should add "all users" option when "showLatest" state is set', (done) => {
|
||||
// given
|
||||
spyOn(UserViewModel.prototype, 'init');
|
||||
const vm = new UserViewModel(state);
|
||||
uObserve.setSilently(state, 'currentUser', user1);
|
||||
uObserve.setSilently(state, 'showAllUsers', false);
|
||||
uObserve.setSilently(vm.model, 'userList', users);
|
||||
uObserve.setSilently(vm.model, 'currentUserId', user1.listValue);
|
||||
state.currentUser = user1;
|
||||
state.showAllUsers = false;
|
||||
vm.model.userList = users;
|
||||
vm.model.currentUserId = user1.listValue;
|
||||
const options = '<option selected value="1">user1</option><option value="2">user2</option>';
|
||||
userEl.insertAdjacentHTML('beforeend', options);
|
||||
const optLength = userEl.options.length;
|
||||
const listLength = vm.model.userList.length;
|
||||
vm.setObservers(state);
|
||||
vm.bindAll();
|
||||
// when
|
||||
state.showLatest = true;
|
||||
@ -182,17 +188,16 @@ describe('UserViewModel tests', () => {
|
||||
|
||||
it('should remove "all users" option when "showLatest" state is unset', (done) => {
|
||||
// given
|
||||
spyOn(UserViewModel.prototype, 'init');
|
||||
const vm = new UserViewModel(state);
|
||||
uObserve.setSilently(state, 'currentUser', user1);
|
||||
uObserve.setSilently(state, 'showAllUsers', false);
|
||||
uObserve.setSilently(state, 'showLatest', true);
|
||||
uObserve.setSilently(vm.model, 'userList', users);
|
||||
uObserve.setSilently(vm.model, 'currentUserId', user1.listValue);
|
||||
state.currentUser = user1;
|
||||
state.showAllUsers = false;
|
||||
state.showLatest = true;
|
||||
vm.model.userList = users;
|
||||
vm.model.currentUserId = user1.listValue;
|
||||
const options = `<option value="${uSelect.allValue}">all users</option><option selected value="1">user1</option><option value="2">user2</option>`;
|
||||
userEl.insertAdjacentHTML('beforeend', options);
|
||||
const optLength = userEl.options.length;
|
||||
const listLength = vm.model.userList.length;
|
||||
vm.setObservers(state);
|
||||
vm.bindAll();
|
||||
// when
|
||||
state.showLatest = false;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user