Skip to content

Commit

Permalink
set order of subjects in perspectives
Browse files Browse the repository at this point in the history
  • Loading branch information
annyhe committed Dec 2, 2016
1 parent d049092 commit 8db9d69
Show file tree
Hide file tree
Showing 2 changed files with 184 additions and 27 deletions.
150 changes: 150 additions & 0 deletions tests/view/components/createPerspective.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,150 @@
/**
* Copyright (c) 2016, salesforce.com, inc.
* All rights reserved.
* Licensed under the BSD 3-Clause license.
* For full license text, see LICENSE.txt file in the repo root or
* https://opensource.org/licenses/BSD-3-Clause
*/

/**
* tests/view/components/createPerspective.js
*/

import { expect } from 'chai';
import React from 'react';
import CreatePerspective from '../../../view/perspective/CreatePerspective.js';
import { mount } from 'enzyme';

describe('List view ', () => {
const ONE = '1';
const DUMMY_STRING = 'COOL';
const DUMMY_FUNCTION = () => {};
const ZERO = 0;

/**
* Sets up the component with dummy prop values.
* @param {Object} valuesAddons Optional object specifying
* overrides to the default props
* @param {Object} stateAddons Optional object specifying
* overrides to the default props
* @returns {Object} The rendered component
*/
function setup(valuesAddons, stateAddons) {
const defaultProps = {
cancelCreate: DUMMY_FUNCTION,
sendResource: DUMMY_FUNCTION,
values: {
aspectFilter: [],
aspectTags: [],
lenses: [],
name: DUMMY_STRING,
perspectives: [],
statusFilter: [],
subjectTagFilter: [],
subjects: [],
},
stateObject: {
perspectives: [],
subjects: [],
lenses: [],
statusFilterType: '',
statusFilter: '',
subjectTagFilter: '',
subjectTagFilterType: '',
aspectTagFilter: '',
aspectTagFilterType: '',
aspectFilter: '',
aspectFilterType: '',
}
};
// update props as needed
let props = defaultProps;
if (valuesAddons) {
props.values = Object.assign(defaultProps.values, valuesAddons);
}
if (stateAddons) {
props.stateObject = Object.assign(defaultProps.stateAddons, stateAddons);
}
// use monut to test all lifecycle methods, and children
const enzymeWrapper = mount(<CreatePerspective {...props} />);

return enzymeWrapper;
}

it('given the proper url parameter and resource, ' +
' create modal is shown with proper resource name', () => {
const enzymeWrapper = setup();
expect(enzymeWrapper.find('.slds-modal__container')).to.have.length(ONE);
expect(enzymeWrapper.find('.slds-text-heading--medium').text())
.to.equal('New Perspective');
});

/**
* Returns an array of resources with identical
* isPublished property, with
* fieldName field == index in loop
*
* @param {Integer} INT Make this many resources
* @param {String} fieldName The field of each resource
* @param {Boolean} isPublished All resources have
* this value of isPublished
* @returns {Array} Array with all published resources
*/
function getSubjects(INT, fieldName, isPublished) {
let subjects = [];
for (let i = INT; i > ZERO; i--) {
const obj = {
isPublished,
absolutePath: i,
};
obj[fieldName] = i;
subjects.push(obj);
}
return subjects;
}

it('updateDropdownConfig updates subjects as intended', () => {
const NUM = 100;
const subjects = getSubjects(NUM, 'absolutePath', true);
const enzymeWrapper = setup({
subjects,
});
const instance = enzymeWrapper.instance();
instance.updateDropdownConfig();
const config = instance.state.dropdownConfig;
expect(Object.keys(config)).to.contain('subjects');
expect(config.subjects.options.length).to.equal(NUM);
});

it('getArray returns only published resources', () => {
const getArray = CreatePerspective.getArray;
const NUM = 10;
const unPublished = getArray(
'absolutePath',
getSubjects(NUM, 'absolutePath')
);
expect(unPublished.length).to.be.empty;

const published = getArray(
'absolutePath',
getSubjects(NUM, 'absolutePath', true)
);
expect(published.length).to.equal(NUM);
// input is in decreasing order
// should preserve order
expect(published[ZERO]).to.equal(NUM);
});

it('getArray does not change order of input resources', () => {
const getArray = CreatePerspective.getArray;
const NUM = 10;

const published = getArray(
'absolutePath',
getSubjects(NUM, 'absolutePath', true)
);
// input is in decreasing order
// should preserve order
expect(published[ZERO]).to.equal(NUM);
});
});
61 changes: 34 additions & 27 deletions view/perspective/CreatePerspective.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,24 +20,6 @@ import ErrorRender from '../admin/components/common/ErrorRender';
import RadioGroup from '../admin/components/common/RadioGroup';
const ZERO = 0;
const ONE = 1;
/**
* Given array of objects, returns array of strings or primitives
* of values of the field key
*
* @param {String} field The field of each value to return
* @param {array} arrayOfObjects The array of objects to
* get new array from
* @returns {Array} The array of strings or primitives
*/
function getArray(field, arrayOfObjects) {
let arr = [];
for (let i = arrayOfObjects.length - ONE; i >= ZERO; i--) {
if (arrayOfObjects[i].isPublished) {
arr.push(arrayOfObjects[i][field]);
}
}
return arr;
}

/**
* Returns the state object without any incidental data.
Expand All @@ -50,6 +32,7 @@ function getStateDataOnly(stateObject) {
delete stateCopy.error;
return stateCopy;
}

/**
* Ie. "thisStringIsGood" --> This String Is Good
* @param {String} string The string to split
Expand All @@ -60,7 +43,9 @@ function convertCamelCase(string) {
// insert a space before all caps
.replace(/([A-Z])/g, ' $1')
// uppercase the first character
.replace(/^./, function(string) { return string.toUpperCase(); });
.replace(/^./, function(string) {
return string.toUpperCase();
});
}

/**
Expand All @@ -69,7 +54,7 @@ function convertCamelCase(string) {
* @returns {DOM_element} The ancestor element that is closest to el
*/
function findCommonAncestor(el, selector) {
let retval = null;
let retval = null;
while (el) {
if (el.classList.contains(selector)) {
retval = el;
Expand All @@ -95,6 +80,27 @@ class CreatePerspective extends React.Component {
...props.stateObject,
}; // default values
}

/**
* Given array of objects, returns array of strings or primitives
* of values of the field key
*
* @param {String} field The field of each value to return
* @param {array} arrayOfObjects The array of objects to
* get new array from
* @returns {Array} The array of strings or primitives
*/
static getArray(field, arrayOfObjects) {
let arr = [];
for (let i = ZERO; i < arrayOfObjects.length; i++) {
if (arrayOfObjects[i].isPublished) {
arr.push(arrayOfObjects[i][field]);
}
}

return arr;
}

componentDidMount() {
this.updateDropdownConfig();
}
Expand All @@ -105,6 +111,7 @@ class CreatePerspective extends React.Component {
const { values } = this.props;
let stateObject = getStateDataOnly(this.state);
let config = {};
const { getArray } = this.constructor;

for (let key in stateObject) {
const value = this.state[key];
Expand Down Expand Up @@ -137,7 +144,7 @@ class CreatePerspective extends React.Component {
delete config.placeholderText;
// remove value[i] if not in all appropriate values
let notAllowedTags = [];
for (var i = value.length - 1; i >= 0; i--) {
for (let i = value.length - ONE; i >= 0; i--) {
if (!values[key] || values[key].indexOf(value[i]) < ZERO) {
notAllowedTags.push(value[i]);
}
Expand All @@ -157,6 +164,7 @@ class CreatePerspective extends React.Component {
}
this.setState({ dropdownConfig: dropdownConfig });
}

handleRadioButtonClick(event) {
const buttonGroup = findCommonAncestor(event.target, 'slds-button-group');
const filterType = buttonGroup.title;
Expand Down Expand Up @@ -195,7 +203,7 @@ class CreatePerspective extends React.Component {
// if string, delete key, if array, delete from array
if (Array.isArray(valueInState)) {
const index = valueInState.indexOf(labelContent);
valueInState.splice(index, 1); // remove element from array;
valueInState.splice(index, ONE); // remove element from array;
newState[dropdownTitle] = valueInState;
} else if (typeof valueInState === 'string') {
newState[dropdownTitle] = '';
Expand All @@ -205,7 +213,7 @@ class CreatePerspective extends React.Component {
newState.dropdownConfig[dropdownTitle].options.push(labelContent);

// if there's values in dropdown decrement dorpdown margin top. otherwise set margin top to 0
newState.dropdownConfig[dropdownTitle].dropDownStyle.marginTop = valueInState.length < 1 ? -5 :
newState.dropdownConfig[dropdownTitle].dropDownStyle.marginTop = valueInState.length < ONE ? -5 :
this.state.dropdownConfig[dropdownTitle].dropDownStyle.marginTop -= 25; // TODO: get from DOM eleme
this.setState(newState);
}
Expand All @@ -228,7 +236,7 @@ class CreatePerspective extends React.Component {
newState.dropdownConfig[dropdownTitle].options = arr;

// if there's no pill, use default margin-top
newState.dropdownConfig[dropdownTitle].dropDownStyle.marginTop = valueInState.length < 1 ? -5 :
newState.dropdownConfig[dropdownTitle].dropDownStyle.marginTop = valueInState.length < ONE ? -5 :
this.state.dropdownConfig[dropdownTitle].dropDownStyle.marginTop += 25; // TODO: get from DOM eleme
this.setState(newState);
}
Expand Down Expand Up @@ -283,11 +291,11 @@ class CreatePerspective extends React.Component {
let pillOutput = '';
const value = this.state[key];
if (key.slice(-4) === 'Type') {
radioGroupConfig[key] = {
radioGroupConfig[key] = {
highlightFirst: value === 'INCLUDE',
title: key,
onClick: this.handleRadioButtonClick,
}
};
}
// // if display value is array, use multi pill
// // else single pill
Expand All @@ -297,7 +305,6 @@ class CreatePerspective extends React.Component {
title={ value }
onRemove={this.deletePill}
/>;

} else if (typeof value === 'string') {
pillOutput = <Pill
title={ [value] }
Expand Down

0 comments on commit 8db9d69

Please sign in to comment.