hiro/Vulcan
1
0
Fork 0
mirror of https://github.com/vale981/Vulcan synced 2025-03-06 01:51:40 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

prettier

Browse source
This commit is contained in:
Apollinaire 2019-02-07 18:02:43 +01:00
parent ef83562ee6
commit 7f8c76c877
1 changed files with 91 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

138
packages/vulcan-forms/test/components.test.js
View file

@ -22,39 +22,39 @@ import SimpleSchema from 'simpl-schema';
const addressGroup = { const addressGroup = {
name: 'addresses', name: 'addresses',
label: 'Addresses', label: 'Addresses',
order: 10 order: 10,
}; };
const permissions = { const permissions = {
canRead: ['guests'], canRead: ['guests'],
canUpdate: ['quests'], canUpdate: ['quests'],
canCreate: ['guests'] canCreate: ['guests'],
}; };
// just 1 input for state testing // just 1 input for state testing
const fooSchema = { const fooSchema = {
foo: { foo: {
type: String, type: String,
...permissions ...permissions,
} },
}; };
// //
const addressSchema = { const addressSchema = {
street: { street: {
type: String, type: String,
optional: true, optional: true,
...permissions ...permissions,
} },
}; };
// [{street, city,...}, {street, city, ...}] // [{street, city,...}, {street, city, ...}]
const arrayOfObjectSchema = { const arrayOfObjectSchema = {
addresses: { addresses: {
type: Array, type: Array,
group: addressGroup, group: addressGroup,
...permissions ...permissions,
}, },
'addresses.$': { 'addresses.$': {
type: new SimpleSchema(addressSchema) type: new SimpleSchema(addressSchema),
} },
}; };
// example with custom inputs for the children // example with custom inputs for the children
// ["http://maps/XYZ", "http://maps/foobar"] // ["http://maps/XYZ", "http://maps/foobar"]
@ -62,12 +62,12 @@ const arrayOfUrlSchema = {
addresses: { addresses: {
type: Array, type: Array,
group: addressGroup, group: addressGroup,
...permissions ...permissions,
}, },
'addresses.$': { 'addresses.$': {
type: String, type: String,
input: 'url' input: 'url',
} },
}; };
// example with array and custom input // example with array and custom input
const CustomObjectInput = () => 'OBJECT INPUT'; const CustomObjectInput = () => 'OBJECT INPUT';
@ -75,12 +75,12 @@ const arrayOfCustomObjectSchema = {
addresses: { addresses: {
type: Array, type: Array,
group: addressGroup, group: addressGroup,
...permissions ...permissions,
}, },
'addresses.$': { 'addresses.$': {
type: new SimpleSchema(addressSchema), type: new SimpleSchema(addressSchema),
input: CustomObjectInput input: CustomObjectInput,
} },
}; };
// example with a fully custom input for both the array and its children // example with a fully custom input for both the array and its children
const ArrayInput = () => 'ARRAY INPUT'; const ArrayInput = () => 'ARRAY INPUT';
@ -89,12 +89,12 @@ const arrayFullCustomSchema = {
type: Array, type: Array,
group: addressGroup, group: addressGroup,
...permissions, ...permissions,
input: ArrayInput input: ArrayInput,
}, },
'addresses.$': { 'addresses.$': {
type: String, type: String,
input: 'url' input: 'url',
} },
}; };
// example with a native type // example with a native type
// ["20 rue du Moulin PARIS", "16 rue de la poste PARIS"] // ["20 rue du Moulin PARIS", "16 rue de la poste PARIS"]
@ -104,26 +104,26 @@ const arrayOfStringSchema = {
addresses: { addresses: {
type: Array, type: Array,
group: addressGroup, group: addressGroup,
...permissions ...permissions,
}, },
'addresses.$': { 'addresses.$': {
type: String type: String,
} },
}; };
// object (not in an array): {street, city} // object (not in an array): {street, city}
const objectSchema = { const objectSchema = {
addresses: { addresses: {
type: new SimpleSchema(addressSchema), type: new SimpleSchema(addressSchema),
...permissions ...permissions,
} },
}; };
// without calling SimpleSchema // without calling SimpleSchema
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
const bareObjectSchema = { const bareObjectSchema = {
addresses: { addresses: {
type: addressSchema, type: addressSchema,
...permissions ...permissions,
} },
}; };
// stub collection // stub collection
@ -134,13 +134,16 @@ const createDummyCollection = (typeName, schema) =>
typeName, typeName,
schema, schema,
resolvers: getDefaultResolvers(typeName + 's'), resolvers: getDefaultResolvers(typeName + 's'),
mutations: getDefaultMutations(typeName + 's') mutations: getDefaultMutations(typeName + 's'),
}); });
const Foos = createDummyCollection('Foo', fooSchema); const Foos = createDummyCollection('Foo', fooSchema);
const ArrayOfObjects = createDummyCollection('ArrayOfObject', arrayOfObjectSchema); const ArrayOfObjects = createDummyCollection('ArrayOfObject', arrayOfObjectSchema);
const Objects = createDummyCollection('Object', objectSchema); const Objects = createDummyCollection('Object', objectSchema);
const ArrayOfUrls = createDummyCollection('ArrayOfUrl', arrayOfUrlSchema); const ArrayOfUrls = createDummyCollection('ArrayOfUrl', arrayOfUrlSchema);
const ArrayOfCustomObjects = createDummyCollection('ArrayOfCustomObject', arrayOfCustomObjectSchema); const ArrayOfCustomObjects = createDummyCollection(
'ArrayOfCustomObject',
arrayOfCustomObjectSchema
);
const ArrayFullCustom = createDummyCollection('ArrayFullCustom', arrayFullCustomSchema); const ArrayFullCustom = createDummyCollection('ArrayFullCustom', arrayFullCustomSchema);
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
const ArrayOfStrings = createDummyCollection('ArrayOfString', arrayOfStringSchema); const ArrayOfStrings = createDummyCollection('ArrayOfString', arrayOfStringSchema);
@ -150,7 +153,7 @@ const Addresses = createCollection({
typeName: 'Address', typeName: 'Address',
schema: addressSchema, schema: addressSchema,
resolvers: getDefaultResolvers('Addresses'), resolvers: getDefaultResolvers('Addresses'),
mutations: getDefaultMutations('Addresses') mutations: getDefaultMutations('Addresses'),
}); });
// helpers // helpers
@ -166,24 +169,24 @@ describe('vulcan-forms/components', function() {
formatNumber: () => '', formatNumber: () => '',
formatPlural: () => '', formatPlural: () => '',
formatHTMLMessage: () => '', formatHTMLMessage: () => '',
now: () => '' now: () => '',
} },
}; };
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
const mountWithContext = C => const mountWithContext = C =>
mount(C, { mount(C, {
context context,
}); });
const shallowWithContext = C => const shallowWithContext = C =>
shallow(C, { shallow(C, {
context context,
}); });
describe('Form collectionName="" (handle fields computation)', function() { describe('Form collectionName="" (handle fields computation)', function() {
// since some props are now handled by HOC we need to provide them manually // since some props are now handled by HOC we need to provide them manually
const defaultProps = { const defaultProps = {
collectionName: '', collectionName: '',
typeName: '' typeName: '',
}; };
describe('Form generation', function() { describe('Form generation', function() {
@ -225,17 +228,23 @@ describe('vulcan-forms/components', function() {
}); });
describe('array of objects', function() { describe('array of objects', function() {
it('shallow render', () => { it('shallow render', () => {
const wrapper = shallowWithContext(<Form collectionName="" collection={ArrayOfObjects} />); const wrapper = shallowWithContext(
<Form collectionName="" collection={ArrayOfObjects} />
);
expect(wrapper).toBeDefined(); expect(wrapper).toBeDefined();
}); });
it('render a FormGroup for addresses', function() { it('render a FormGroup for addresses', function() {
const wrapper = shallowWithContext(<Form collectionName="" collection={ArrayOfObjects} />); const wrapper = shallowWithContext(
<Form collectionName="" collection={ArrayOfObjects} />
);
const formGroup = wrapper.find('FormGroup').find({ name: 'addresses' }); const formGroup = wrapper.find('FormGroup').find({ name: 'addresses' });
expect(formGroup).toBeDefined(); expect(formGroup).toBeDefined();
expect(formGroup).toHaveLength(1); expect(formGroup).toHaveLength(1);
}); });
it('passes down the array child fields', function() { it('passes down the array child fields', function() {
const wrapper = shallowWithContext(<Form collectionName="" collection={ArrayOfObjects} />); const wrapper = shallowWithContext(
<Form collectionName="" collection={ArrayOfObjects} />
);
const formGroup = getArrayFormGroup(wrapper); const formGroup = getArrayFormGroup(wrapper);
const fields = getFields(formGroup); const fields = getFields(formGroup);
const arrayField = fields[0]; const arrayField = fields[0];
@ -258,12 +267,16 @@ describe('vulcan-forms/components', function() {
}); });
describe('array of objects with custom children inputs', function() { describe('array of objects with custom children inputs', function() {
it('shallow render', function() { it('shallow render', function() {
const wrapper = shallowWithContext(<Form collectionName="" collection={ArrayOfCustomObjects} />); const wrapper = shallowWithContext(
<Form collectionName="" collection={ArrayOfCustomObjects} />
);
expect(wrapper).toBeDefined(); expect(wrapper).toBeDefined();
}); });
// TODO: does not work, schema_utils needs an update // TODO: does not work, schema_utils needs an update
it.skip('passes down the custom input', function() { it.skip('passes down the custom input', function() {
const wrapper = shallowWithContext(<Form collectionName="" collection={ArrayOfCustomObjects} />); const wrapper = shallowWithContext(
<Form collectionName="" collection={ArrayOfCustomObjects} />
);
const formGroup = getArrayFormGroup(wrapper); const formGroup = getArrayFormGroup(wrapper);
const fields = getFields(formGroup); const fields = getFields(formGroup);
const arrayField = fields[0]; const arrayField = fields[0];
@ -272,11 +285,15 @@ describe('vulcan-forms/components', function() {
}); });
describe('array with a fully custom input (array itself and children)', function() { describe('array with a fully custom input (array itself and children)', function() {
it('shallow render', function() { it('shallow render', function() {
const wrapper = shallowWithContext(<Form collectionName="" collection={ArrayFullCustom} />); const wrapper = shallowWithContext(
<Form collectionName="" collection={ArrayFullCustom} />
);
expect(wrapper).toBeDefined(); expect(wrapper).toBeDefined();
}); });
it('passes down the custom input', function() { it('passes down the custom input', function() {
const wrapper = shallowWithContext(<Form collectionName="" collection={ArrayFullCustom} />); const wrapper = shallowWithContext(
<Form collectionName="" collection={ArrayFullCustom} />
);
const formGroup = getArrayFormGroup(wrapper); const formGroup = getArrayFormGroup(wrapper);
const fields = getFields(formGroup); const fields = getFields(formGroup);
const arrayField = fields[0]; const arrayField = fields[0];
@ -296,13 +313,20 @@ describe('vulcan-forms/components', function() {
.first() .first()
.simulate('change', { target: { value: 'bar' } }); .simulate('change', { target: { value: 'bar' } });
// eslint-disable-next-line no-console // eslint-disable-next-line no-console
console.log(wrapper.find('input').first().html()); console.log(
wrapper
.find('input')
.first()
.html()
);
// eslint-disable-next-line no-console // eslint-disable-next-line no-console
console.log(wrapper.state()); console.log(wrapper.state());
expect(wrapper.state().currentValues).toEqual({ foo: 'bar' }); expect(wrapper.state().currentValues).toEqual({ foo: 'bar' });
}); });
it('reset state when relevant props change', function() { it('reset state when relevant props change', function() {
const wrapper = shallowWithContext(<Form {...defaultProps} collectionName="Foos" collection={Foos} />); const wrapper = shallowWithContext(
<Form {...defaultProps} collectionName="Foos" collection={Foos} />
);
wrapper.setState({ currentValues: { foo: 'bar' } }); wrapper.setState({ currentValues: { foo: 'bar' } });
expect(wrapper.state('currentValues')).toEqual({ foo: 'bar' }); expect(wrapper.state('currentValues')).toEqual({ foo: 'bar' });
wrapper.setProps({ collectionName: 'Bars' }); wrapper.setProps({ collectionName: 'Bars' });
@ -311,7 +335,9 @@ describe('vulcan-forms/components', function() {
it('does not reset state when external prop change', function() { it('does not reset state when external prop change', function() {
//const prefilledProps = { bar: 'foo' } // TODO //const prefilledProps = { bar: 'foo' } // TODO
const changeCallback = () => 'CHANGE'; const changeCallback = () => 'CHANGE';
const wrapper = shallowWithContext(<Form {...defaultProps} collection={Foos} changeCallback={changeCallback} />); const wrapper = shallowWithContext(
<Form {...defaultProps} collection={Foos} changeCallback={changeCallback} />
);
wrapper.setState({ currentValues: { foo: 'bar' } }); wrapper.setState({ currentValues: { foo: 'bar' } });
expect(wrapper.state('currentValues')).toEqual({ foo: 'bar' }); expect(wrapper.state('currentValues')).toEqual({ foo: 'bar' });
const newChangeCallback = () => 'NEW'; const newChangeCallback = () => 'NEW';
@ -325,8 +351,8 @@ describe('vulcan-forms/components', function() {
const shallowWithContext = C => const shallowWithContext = C =>
shallow(C, { shallow(C, {
context: { context: {
getDocument: () => {} getDocument: () => {},
} },
}); });
const defaultProps = { const defaultProps = {
disabled: false, disabled: false,
@ -343,7 +369,7 @@ describe('vulcan-forms/components', function() {
throwError: () => {}, throwError: () => {},
updateCurrentValues: () => {}, updateCurrentValues: () => {},
errors: [], errors: [],
clearFieldErrors: () => {} clearFieldErrors: () => {},
}; };
it('shallow render', function() { it('shallow render', function() {
const wrapper = shallowWithContext(<FormComponent {...defaultProps} />); const wrapper = shallowWithContext(<FormComponent {...defaultProps} />);
@ -356,11 +382,11 @@ describe('vulcan-forms/components', function() {
nestedSchema: { nestedSchema: {
street: {}, street: {},
country: {}, country: {},
zipCode: {} zipCode: {},
}, },
nestedInput: true, nestedInput: true,
nestedFields: [{}, {}, {}], nestedFields: [{}, {}, {}],
currentValues: {} currentValues: {},
}; };
it('render a FormNestedArray', function() { it('render a FormNestedArray', function() {
const wrapper = shallowWithContext(<FormComponent {...props} />); const wrapper = shallowWithContext(<FormComponent {...props} />);
@ -375,11 +401,11 @@ describe('vulcan-forms/components', function() {
nestedSchema: { nestedSchema: {
street: {}, street: {},
country: {}, country: {},
zipCode: {} zipCode: {},
}, },
nestedInput: true, nestedInput: true,
nestedFields: [{}, {}, {}], nestedFields: [{}, {}, {}],
currentValues: {} currentValues: {},
}; };
it('shallow render', function() { it('shallow render', function() {
const wrapper = shallowWithContext(<FormComponent {...props} />); const wrapper = shallowWithContext(<FormComponent {...props} />);
@ -401,7 +427,7 @@ describe('vulcan-forms/components', function() {
errors: [], errors: [],
deletedValues: [], deletedValues: [],
path: 'foobar', path: 'foobar',
formComponents: Components formComponents: Components,
}; };
it('shallow render', function() { it('shallow render', function() {
const wrapper = shallow(<Components.FormNestedArray {...defaultProps} currentValues={{}} />); const wrapper = shallow(<Components.FormNestedArray {...defaultProps} currentValues={{}} />);
@ -414,12 +440,16 @@ describe('vulcan-forms/components', function() {
expect(addButton).toHaveLength(1); expect(addButton).toHaveLength(1);
}); });
it.skip('shows 3 items', function() { it.skip('shows 3 items', function() {
const wrapper = mount(<Components.FormNestedArray {...defaultProps} currentValues={{}} value={[1, 2, 3]} />); const wrapper = mount(
<Components.FormNestedArray {...defaultProps} currentValues={{}} value={[1, 2, 3]} />
);
const nestedItem = wrapper.find('FormNestedItem'); const nestedItem = wrapper.find('FormNestedItem');
expect(nestedItem).toHaveLength(3); expect(nestedItem).toHaveLength(3);
}); });
it.skip('pass the correct path and itemIndex to each form', function() { it.skip('pass the correct path and itemIndex to each form', function() {
const wrapper = mount(<Components.FormNestedArray {...defaultProps} currentValues={{}} value={[1, 2]} />); const wrapper = mount(
<Components.FormNestedArray {...defaultProps} currentValues={{}} value={[1, 2]} />
);
const nestedItem = wrapper.find('FormNestedItem'); const nestedItem = wrapper.find('FormNestedItem');
const item0 = nestedItem.at(0); const item0 = nestedItem.at(0);
const item1 = nestedItem.at(1); const item1 = nestedItem.at(1);
@ -433,7 +463,7 @@ describe('vulcan-forms/components', function() {
const defaultProps = { const defaultProps = {
errors: [], errors: [],
path: 'foobar', path: 'foobar',
formComponents: Components formComponents: Components,
}; };
it('shallow render', function() { it('shallow render', function() {
const wrapper = shallow(<Components.FormNestedObject {...defaultProps} currentValues={{}} />); const wrapper = shallow(<Components.FormNestedObject {...defaultProps} currentValues={{}} />);