mirror of
https://github.com/Choices-js/Choices.git
synced 2024-06-29 10:50:03 +02:00
Begun adding reducer tests
This commit is contained in:
parent
4666e33845
commit
a8cbeb91bc
|
@ -2,16 +2,16 @@ import { expect } from 'chai';
|
||||||
import * as actions from './actions';
|
import * as actions from './actions';
|
||||||
|
|
||||||
describe('actions', () => {
|
describe('actions', () => {
|
||||||
describe('addItem', () => {
|
describe('addItem action', () => {
|
||||||
it('returns ADD_ITEM action', () => {
|
it('returns ADD_ITEM action', () => {
|
||||||
const value = 'test';
|
const value = 'test';
|
||||||
const label = 'test';
|
const label = 'test';
|
||||||
const id = 'test';
|
const id = '1234';
|
||||||
const choiceId = 'test';
|
const choiceId = '1234';
|
||||||
const groupId = 'test';
|
const groupId = 'test';
|
||||||
const customProperties = 'test';
|
const customProperties = 'test';
|
||||||
const placeholder = 'test';
|
const placeholder = 'test';
|
||||||
const keyCode = 'test';
|
const keyCode = 10;
|
||||||
|
|
||||||
const expectedAction = {
|
const expectedAction = {
|
||||||
type: 'ADD_ITEM',
|
type: 'ADD_ITEM',
|
||||||
|
@ -38,7 +38,7 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('removeItem', () => {
|
describe('removeItem action', () => {
|
||||||
it('returns REMOVE_ITEM action', () => {
|
it('returns REMOVE_ITEM action', () => {
|
||||||
const id = '1234';
|
const id = '1234';
|
||||||
const choiceId = '1';
|
const choiceId = '1';
|
||||||
|
@ -52,7 +52,7 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('highlightItem', () => {
|
describe('highlightItem action', () => {
|
||||||
it('returns HIGHLIGHT_ITEM action', () => {
|
it('returns HIGHLIGHT_ITEM action', () => {
|
||||||
const id = '1234';
|
const id = '1234';
|
||||||
const highlighted = true;
|
const highlighted = true;
|
||||||
|
@ -67,17 +67,17 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('addChoice', () => {
|
describe('addChoice action', () => {
|
||||||
it('returns ADD_CHOICE action', () => {
|
it('returns ADD_CHOICE action', () => {
|
||||||
const value = 'test';
|
const value = 'test';
|
||||||
const label = 'test';
|
const label = 'test';
|
||||||
const id = 'test';
|
const id = 'test';
|
||||||
const groupId = 'test';
|
const groupId = 'test';
|
||||||
const disabled = 'test';
|
const disabled = false;
|
||||||
const elementId = 'test';
|
const elementId = 'test';
|
||||||
const customProperties = 'test';
|
const customProperties = 'test';
|
||||||
const placeholder = 'test';
|
const placeholder = 'test';
|
||||||
const keyCode = 'test';
|
const keyCode = 10;
|
||||||
|
|
||||||
const expectedAction = {
|
const expectedAction = {
|
||||||
type: 'ADD_CHOICE',
|
type: 'ADD_CHOICE',
|
||||||
|
@ -106,7 +106,7 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('filterChoices', () => {
|
describe('filterChoices action', () => {
|
||||||
it('returns FILTER_CHOICES action', () => {
|
it('returns FILTER_CHOICES action', () => {
|
||||||
const results = Array(10);
|
const results = Array(10);
|
||||||
const expectedAction = {
|
const expectedAction = {
|
||||||
|
@ -118,7 +118,7 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('activateChoices', () => {
|
describe('activateChoices action', () => {
|
||||||
it('returns ACTIVATE_CHOICES action', () => {
|
it('returns ACTIVATE_CHOICES action', () => {
|
||||||
const active = true;
|
const active = true;
|
||||||
const expectedAction = {
|
const expectedAction = {
|
||||||
|
@ -130,7 +130,7 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('clearChoices', () => {
|
describe('clearChoices action', () => {
|
||||||
it('returns CLEAR_CHOICES action', () => {
|
it('returns CLEAR_CHOICES action', () => {
|
||||||
const expectedAction = {
|
const expectedAction = {
|
||||||
type: 'CLEAR_CHOICES',
|
type: 'CLEAR_CHOICES',
|
||||||
|
@ -140,12 +140,12 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('addGroup', () => {
|
describe('addGroup action', () => {
|
||||||
it('returns ADD_GROUP action', () => {
|
it('returns ADD_GROUP action', () => {
|
||||||
const value = 'test';
|
const value = 'test';
|
||||||
const id = 'test';
|
const id = 'test';
|
||||||
const active = 'test';
|
const active = true;
|
||||||
const disabled = 'test';
|
const disabled = false;
|
||||||
const expectedAction = {
|
const expectedAction = {
|
||||||
type: 'ADD_GROUP',
|
type: 'ADD_GROUP',
|
||||||
value,
|
value,
|
||||||
|
@ -163,7 +163,7 @@ describe('actions', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
describe('clearAll', () => {
|
describe('clearAll action', () => {
|
||||||
it('returns CLEAR_ALL action', () => {
|
it('returns CLEAR_ALL action', () => {
|
||||||
const expectedAction = {
|
const expectedAction = {
|
||||||
type: 'CLEAR_ALL',
|
type: 'CLEAR_ALL',
|
||||||
|
|
|
@ -118,7 +118,7 @@ class Choices {
|
||||||
noChoices: 'has-no-choices',
|
noChoices: 'has-no-choices',
|
||||||
},
|
},
|
||||||
fuseOptions: {
|
fuseOptions: {
|
||||||
include: 'score',
|
includeScore: true,
|
||||||
},
|
},
|
||||||
callbackOnInit: null,
|
callbackOnInit: null,
|
||||||
callbackOnCreateTemplates: null,
|
callbackOnCreateTemplates: null,
|
||||||
|
|
|
@ -25,20 +25,19 @@ export default function choices(state = defaultState, action) {
|
||||||
}
|
}
|
||||||
|
|
||||||
case 'ADD_ITEM': {
|
case 'ADD_ITEM': {
|
||||||
let newState = state;
|
|
||||||
|
|
||||||
// If all choices need to be activated
|
// If all choices need to be activated
|
||||||
if (action.activateOptions) {
|
if (action.activateOptions) {
|
||||||
newState = state.map((obj) => {
|
return state.map((obj) => {
|
||||||
const choice = obj;
|
const choice = obj;
|
||||||
choice.active = action.active;
|
choice.active = action.active;
|
||||||
return choice;
|
return choice;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// When an item is added and it has an associated choice,
|
// When an item is added and it has an associated choice,
|
||||||
// we want to disable it so it can't be chosen again
|
// we want to disable it so it can't be chosen again
|
||||||
if (action.choiceId > -1) {
|
if (action.choiceId > -1) {
|
||||||
newState = state.map((obj) => {
|
return state.map((obj) => {
|
||||||
const choice = obj;
|
const choice = obj;
|
||||||
if (choice.id === parseInt(action.choiceId, 10)) {
|
if (choice.id === parseInt(action.choiceId, 10)) {
|
||||||
choice.selected = true;
|
choice.selected = true;
|
||||||
|
@ -47,7 +46,7 @@ export default function choices(state = defaultState, action) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
return newState;
|
return state;
|
||||||
}
|
}
|
||||||
|
|
||||||
case 'REMOVE_ITEM': {
|
case 'REMOVE_ITEM': {
|
||||||
|
@ -67,14 +66,13 @@ export default function choices(state = defaultState, action) {
|
||||||
}
|
}
|
||||||
|
|
||||||
case 'FILTER_CHOICES': {
|
case 'FILTER_CHOICES': {
|
||||||
const filteredResults = action.results;
|
return state.map((obj) => {
|
||||||
const filteredState = state.map((obj) => {
|
|
||||||
const choice = obj;
|
const choice = obj;
|
||||||
// Set active state based on whether choice is
|
// Set active state based on whether choice is
|
||||||
// within filtered results
|
// within filtered results
|
||||||
choice.active = filteredResults.some((result) => {
|
choice.active = action.results.some(({ item, score }) => {
|
||||||
if (result.id === choice.id) {
|
if (item.id === choice.id) {
|
||||||
choice.score = result.score;
|
choice.score = score;
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
|
@ -82,8 +80,6 @@ export default function choices(state = defaultState, action) {
|
||||||
|
|
||||||
return choice;
|
return choice;
|
||||||
});
|
});
|
||||||
|
|
||||||
return filteredState;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
case 'ACTIVATE_CHOICES': {
|
case 'ACTIVATE_CHOICES': {
|
||||||
|
@ -95,7 +91,7 @@ export default function choices(state = defaultState, action) {
|
||||||
}
|
}
|
||||||
|
|
||||||
case 'CLEAR_CHOICES': {
|
case 'CLEAR_CHOICES': {
|
||||||
return [];
|
return defaultState;
|
||||||
}
|
}
|
||||||
|
|
||||||
default: {
|
default: {
|
||||||
|
|
198
src/scripts/src/reducers/choices.test.js
Normal file
198
src/scripts/src/reducers/choices.test.js
Normal file
|
@ -0,0 +1,198 @@
|
||||||
|
import { expect } from 'chai';
|
||||||
|
import choices, { defaultState } from './choices';
|
||||||
|
|
||||||
|
describe('choices reducer', () => {
|
||||||
|
it('should return same state when no action matches', () => {
|
||||||
|
expect(choices(defaultState, {})).to.equal(defaultState);
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('when choices do not exist', () => {
|
||||||
|
describe('ADD_CHOICE', () => {
|
||||||
|
it('adds choice', () => {
|
||||||
|
const value = 'test';
|
||||||
|
const label = 'test';
|
||||||
|
const id = 'test';
|
||||||
|
const groupId = 'test';
|
||||||
|
const disabled = false;
|
||||||
|
const elementId = 'test';
|
||||||
|
const customProperties = 'test';
|
||||||
|
const placeholder = 'test';
|
||||||
|
|
||||||
|
const actualResponse = choices(undefined, {
|
||||||
|
type: 'ADD_CHOICE',
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
groupId,
|
||||||
|
disabled,
|
||||||
|
elementId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
});
|
||||||
|
|
||||||
|
const expectedResponse = [
|
||||||
|
{
|
||||||
|
value,
|
||||||
|
label,
|
||||||
|
id,
|
||||||
|
groupId,
|
||||||
|
disabled,
|
||||||
|
elementId,
|
||||||
|
customProperties,
|
||||||
|
placeholder,
|
||||||
|
selected: false,
|
||||||
|
active: true,
|
||||||
|
score: 9999,
|
||||||
|
keyCode: null,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
expect(actualResponse).to.eql(expectedResponse);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('when choices exist', () => {
|
||||||
|
let state;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
state = [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
elementId: 'choices-test-1',
|
||||||
|
groupId: -1,
|
||||||
|
value: 'Choice 1',
|
||||||
|
label: 'Choice 1',
|
||||||
|
disabled: false,
|
||||||
|
selected: false,
|
||||||
|
active: false,
|
||||||
|
score: 9999,
|
||||||
|
customProperties: null,
|
||||||
|
placeholder: false,
|
||||||
|
keyCode: null,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
elementId: 'choices-test-2',
|
||||||
|
groupId: -1,
|
||||||
|
value: 'Choice 2',
|
||||||
|
label: 'Choice 2',
|
||||||
|
disabled: false,
|
||||||
|
selected: true,
|
||||||
|
active: false,
|
||||||
|
score: 9999,
|
||||||
|
customProperties: null,
|
||||||
|
placeholder: false,
|
||||||
|
keyCode: null,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('FILTER_CHOICES', () => {
|
||||||
|
it('sets active flag based on whether choice is in passed results', () => {
|
||||||
|
const id = 1;
|
||||||
|
const score = 10;
|
||||||
|
const actualResponse = choices([...state], {
|
||||||
|
type: 'FILTER_CHOICES',
|
||||||
|
results: [{
|
||||||
|
item: {
|
||||||
|
id,
|
||||||
|
},
|
||||||
|
score,
|
||||||
|
}],
|
||||||
|
});
|
||||||
|
|
||||||
|
const expectedResponse = state.map((choice) => {
|
||||||
|
const clonedChoice = choice;
|
||||||
|
if (clonedChoice.id === id) {
|
||||||
|
clonedChoice.active = true;
|
||||||
|
clonedChoice.score = 10;
|
||||||
|
}
|
||||||
|
return clonedChoice;
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(actualResponse).to.eql(expectedResponse);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('ACTIVATE_CHOICES', () => {
|
||||||
|
it('sets active flag to passed value', () => {
|
||||||
|
const actualResponse = choices([...state], {
|
||||||
|
type: 'ACTIVATE_CHOICES',
|
||||||
|
active: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
const expectedResponse = state.map((choice) => {
|
||||||
|
const clonedChoice = choice;
|
||||||
|
clonedChoice.active = true;
|
||||||
|
return clonedChoice;
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(actualResponse).to.eql(expectedResponse);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('CLEAR_CHOICES', () => {
|
||||||
|
it('restores to defaultState', () => {
|
||||||
|
const actualResponse = choices([...state], {
|
||||||
|
type: 'CLEAR_CHOICES',
|
||||||
|
});
|
||||||
|
|
||||||
|
const expectedResponse = defaultState;
|
||||||
|
|
||||||
|
expect(actualResponse).to.eql(expectedResponse);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('ADD_ITEM', () => {
|
||||||
|
it('disables choice if action has choice id', () => {
|
||||||
|
const id = 2;
|
||||||
|
const actualResponse = choices(state, {
|
||||||
|
type: 'ADD_ITEM',
|
||||||
|
choiceId: id,
|
||||||
|
});
|
||||||
|
|
||||||
|
const expectedResponse = state.map((choice) => {
|
||||||
|
const clonedChoice = choice;
|
||||||
|
if (clonedChoice.id === id) {
|
||||||
|
clonedChoice.selected = false;
|
||||||
|
}
|
||||||
|
return clonedChoice;
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(actualResponse).to.eql(expectedResponse);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('activates all choices if activateOptions flag passed', () => {
|
||||||
|
const actualResponse = choices(state, {
|
||||||
|
type: 'ADD_ITEM',
|
||||||
|
activateOptions: true,
|
||||||
|
active: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(actualResponse[0].active).to.equal(true);
|
||||||
|
expect(actualResponse[1].active).to.equal(true);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('REMOVE_ITEM', () => {
|
||||||
|
it('selects choice by passed id', () => {
|
||||||
|
const id = 2;
|
||||||
|
const actualResponse = choices([...state], {
|
||||||
|
type: 'REMOVE_ITEM',
|
||||||
|
choiceId: id,
|
||||||
|
});
|
||||||
|
|
||||||
|
const expectedResponse = state.map((choice) => {
|
||||||
|
const clonedChoice = choice;
|
||||||
|
if (clonedChoice.id === id) {
|
||||||
|
clonedChoice.selected = false;
|
||||||
|
}
|
||||||
|
return clonedChoice;
|
||||||
|
});
|
||||||
|
|
||||||
|
expect(actualResponse).to.eql(expectedResponse);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
9
src/scripts/src/reducers/groups.test.js
Normal file
9
src/scripts/src/reducers/groups.test.js
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
import { expect } from 'chai';
|
||||||
|
// import * as actions from '../actions/actions';
|
||||||
|
import groups, { defaultState } from './groups';
|
||||||
|
|
||||||
|
describe('groups reducer', () => {
|
||||||
|
it('should return same state when no action matches', () => {
|
||||||
|
expect(groups(defaultState, {})).to.equal(defaultState);
|
||||||
|
});
|
||||||
|
});
|
18
src/scripts/src/reducers/index.test.js
Normal file
18
src/scripts/src/reducers/index.test.js
Normal file
|
@ -0,0 +1,18 @@
|
||||||
|
import { createStore } from 'redux';
|
||||||
|
import { expect } from 'chai';
|
||||||
|
import rootReducer from './index';
|
||||||
|
import groups from './groups';
|
||||||
|
import choices from './choices';
|
||||||
|
import items from './items';
|
||||||
|
|
||||||
|
describe('rootReducer', () => {
|
||||||
|
const store = createStore(rootReducer);
|
||||||
|
|
||||||
|
it('returns expected reducers', () => {
|
||||||
|
const state = store.getState();
|
||||||
|
|
||||||
|
expect(state.groups).to.equal(groups(undefined, {}));
|
||||||
|
expect(state.choices).to.equal(choices(undefined, {}));
|
||||||
|
expect(state.items).to.equal(items(undefined, {}));
|
||||||
|
});
|
||||||
|
});
|
9
src/scripts/src/reducers/items.test.js
Normal file
9
src/scripts/src/reducers/items.test.js
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
import { expect } from 'chai';
|
||||||
|
// import * as actions from '../actions/actions';
|
||||||
|
import items, { defaultState } from './items';
|
||||||
|
|
||||||
|
describe('items reducer', () => {
|
||||||
|
it('should return same state when no action matches', () => {
|
||||||
|
expect(items(defaultState, {})).to.equal(defaultState);
|
||||||
|
});
|
||||||
|
});
|
Loading…
Reference in a new issue