gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: provide usable UMD builds for all packages ()

Browse Source
This commit is contained in:
Tony Alves
2019-03-16 15:44:29 -07:00
committed by Shawn Erquhart
parent 1d935c704d
commit 82cc7941cc
89 changed files with 1025 additions and 712 deletions
babel.config.jscustom-preprocessor.jspackage.json
packages
netlify-cms-backend-bitbucket
package.json
src
implementation.jsindex.js
netlify-cms-backend-git-gateway
package.json
src
implementation.jsindex.js
netlify-cms-backend-github
package.json
src
index.js
netlify-cms-backend-gitlab
package.json
src
index.js
netlify-cms-backend-test
package.json
src
implementation.jsindex.js
netlify-cms-core
babel.config.jspackage.json
src
actions
auth.jsdeploys.jseditorialWorkflow.jsentries.jsmediaLibrary.jssearch.js
bootstrap.js
components/App
App.js
index.js
valueObjects
AssetProxy.js
webpack.config.js
netlify-cms-default-exports
package.json
src
index.js
webpack.config.js
netlify-cms-editor-component-image
package.json
src
index.js
netlify-cms-lib-auth
package.json
src
index.js
netlify-cms-lib-util
package.json
src
index.js
netlify-cms-media-library-cloudinary
package.json
src
index.js
netlify-cms-media-library-uploadcare
package.json
src
index.js
netlify-cms-ui-default
package.json
src
index.js
netlify-cms-widget-boolean
package.json
src
index.js
netlify-cms-widget-date
package.json
src
index.js
webpack.config.js
netlify-cms-widget-datetime
package.json
src
index.js
netlify-cms-widget-file
package.json
src
index.js
netlify-cms-widget-image
package.json
src
index.js
netlify-cms-widget-list
package.json
src
ListControl.jsindex.js
netlify-cms-widget-map
package.json
src
index.js
webpack.config.js
netlify-cms-widget-markdown
package.json
src
index.js
netlify-cms-widget-number
package.json
src
__tests__
number.spec.js
index.js
netlify-cms-widget-object
package.json
src
index.js
netlify-cms-widget-relation
package.json
src
__tests__
relation.spec.js
index.js
netlify-cms-widget-select
package.json
src
__tests__
select.spec.js
index.js
netlify-cms-widget-string
package.json
src
index.js
netlify-cms-widget-text
package.json
src
index.js
netlify-cms
package.json
src
backends.jseditor-components.jsindex.jsmedia-libraries.jswidgets.js
webpack.config.js
scripts
externals.jswebpack.js
website
package.json
yarn.lock

13
packages/netlify-cms-widget-relation/package.json

@ -23,19 +23,14 @@
"dependencies": {
"react-select": "^2.4.2"
},
"devDependencies": {
"cross-env": "^5.2.0",
"webpack": "^4.29.6",
"webpack-cli": "^3.2.3"
},
"peerDependencies": {
"@emotion/core": "^10.0.9",
"@emotion/styled": "^10.0.9",
"immutable": "^3.7.6",
"lodash": "^4.17.10",
"netlify-cms-ui-default": "^2.0.0",
"prop-types": "^15.5.10",
"react": "^16.4.1",
"lodash": "^4.17.11",
"netlify-cms-ui-default": "^2.4.1-beta.0",
"prop-types": "^15.7.2",
"react": "^16.8.4",
"uuid": "^3.1.0"
}
}

412
packages/netlify-cms-widget-relation/src/__tests__/relation.spec.js

@ -1,206 +1,206 @@
import React from 'react';
import { fromJS, Map } from 'immutable';
import { last } from 'lodash';
import { render, fireEvent, wait } from 'react-testing-library';
import 'react-testing-library/cleanup-after-each';
import 'jest-dom/extend-expect';
import { RelationControl } from '../';
const fieldConfig = {
name: 'post',
collection: 'posts',
displayFields: ['title', 'slug'],
searchFields: ['title', 'body'],
valueField: 'title',
};
const generateHits = length => {
const hits = Array.from({ length }, (val, idx) => {
const title = `Post # ${idx + 1}`;
const slug = `post-number-${idx + 1}`;
return { collection: 'posts', data: { title, slug } };
});
return [
...hits,
{
collection: 'posts',
data: { title: 'YAML post', slug: 'post-yaml', body: 'Body yaml' },
},
];
};
class RelationController extends React.Component {
state = {
value: this.props.value,
queryHits: Map(),
};
handleOnChange = jest.fn(value => {
this.setState({ ...this.state, value });
});
setQueryHits = jest.fn(hits => {
const queryHits = Map().set('relation-field', hits);
this.setState({ ...this.state, queryHits });
});
query = jest.fn((...args) => {
const queryHits = generateHits(25);
if (last(args) === 'YAML') {
return Promise.resolve({ payload: { response: { hits: [last(queryHits)] } } });
}
return Promise.resolve({ payload: { response: { hits: queryHits } } });
});
render() {
return this.props.children({
value: this.state.value,
handleOnChange: this.handleOnChange,
query: this.query,
queryHits: this.state.queryHits,
setQueryHits: this.setQueryHits,
});
}
}
function setup({ field, value }) {
let renderArgs;
const setActiveSpy = jest.fn();
const setInactiveSpy = jest.fn();
const helpers = render(
<RelationController value={value}>
{({ handleOnChange, value, query, queryHits, setQueryHits }) => {
renderArgs = { value, onChangeSpy: handleOnChange, setQueryHitsSpy: setQueryHits };
return (
<RelationControl
field={field}
value={value}
query={query}
queryHits={queryHits}
onChange={handleOnChange}
forID="relation-field"
classNameWrapper=""
setActiveStyle={setActiveSpy}
setInactiveStyle={setInactiveSpy}
/>
);
}}
</RelationController>,
);
const input = helpers.container.querySelector('input');
return {
...helpers,
...renderArgs,
setActiveSpy,
setInactiveSpy,
input,
};
}
describe('Relation widget', () => {
it('should list the first 20 option hits on initial load', async () => {
const field = fromJS(fieldConfig);
const { getAllByText, input } = setup({ field });
fireEvent.keyDown(input, { key: 'ArrowDown' });
await wait(() => {
expect(getAllByText(/^Post # (\d{1,2}) post-number-\1$/)).toHaveLength(20);
});
});
it('should update option list based on search term', async () => {
const field = fromJS(fieldConfig);
const { getAllByText, input } = setup({ field });
fireEvent.change(input, { target: { value: 'YAML' } });
await wait(() => {
expect(getAllByText('YAML post post-yaml')).toHaveLength(1);
});
});
it('should call onChange with correct selectedItem value and metadata', async () => {
const field = fromJS(fieldConfig);
const { getByText, input, onChangeSpy } = setup({ field });
const value = 'Post # 1';
const label = 'Post # 1 post-number-1';
const metadata = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
await wait(() => {
fireEvent.keyDown(input, { key: 'ArrowDown' });
fireEvent.click(getByText(label));
expect(onChangeSpy).toHaveBeenCalledTimes(1);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata);
});
});
it('should update metadata for initial preview', async () => {
const field = fromJS(fieldConfig);
const value = 'Post # 1';
const { getByText, onChangeSpy, setQueryHitsSpy } = setup({ field, value });
const label = 'Post # 1 post-number-1';
const metadata = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
setQueryHitsSpy(generateHits(1));
await wait(() => {
expect(getByText(label)).toBeInTheDocument();
expect(onChangeSpy).toHaveBeenCalledTimes(1);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata);
});
});
describe('with multiple', () => {
it('should call onChange with correct selectedItem value and metadata', async () => {
const field = fromJS({ ...fieldConfig, multiple: true });
const { getByText, input, onChangeSpy } = setup({ field });
const metadata1 = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
const metadata2 = {
post: { posts: { 'Post # 2': { title: 'Post # 2', slug: 'post-number-2' } } },
};
await wait(() => {
fireEvent.keyDown(input, { key: 'ArrowDown' });
fireEvent.click(getByText('Post # 1 post-number-1'));
fireEvent.keyDown(input, { key: 'ArrowDown' });
fireEvent.click(getByText('Post # 2 post-number-2'));
expect(onChangeSpy).toHaveBeenCalledTimes(2);
expect(onChangeSpy).toHaveBeenCalledWith(fromJS(['Post # 1']), metadata1);
expect(onChangeSpy).toHaveBeenCalledWith(fromJS(['Post # 1', 'Post # 2']), metadata2);
});
});
it('should update metadata for initial preview', async () => {
const field = fromJS({ ...fieldConfig, multiple: true });
const value = fromJS(['Post # 1', 'Post # 2']);
const { getByText, onChangeSpy, setQueryHitsSpy } = setup({ field, value });
const metadata1 = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
const metadata2 = {
post: { posts: { 'Post # 2': { title: 'Post # 2', slug: 'post-number-2' } } },
};
setQueryHitsSpy(generateHits(2));
await wait(() => {
expect(getByText('Post # 1 post-number-1')).toBeInTheDocument();
expect(getByText('Post # 2 post-number-2')).toBeInTheDocument();
expect(onChangeSpy).toHaveBeenCalledTimes(2);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata1);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata2);
});
});
});
});
import React from 'react';
import { fromJS, Map } from 'immutable';
import { last } from 'lodash';
import { render, fireEvent, wait } from 'react-testing-library';
import 'react-testing-library/cleanup-after-each';
import 'jest-dom/extend-expect';
import { controlComponent as RelationControl } from '../';
const fieldConfig = {
name: 'post',
collection: 'posts',
displayFields: ['title', 'slug'],
searchFields: ['title', 'body'],
valueField: 'title',
};
const generateHits = length => {
const hits = Array.from({ length }, (val, idx) => {
const title = `Post # ${idx + 1}`;
const slug = `post-number-${idx + 1}`;
return { collection: 'posts', data: { title, slug } };
});
return [
...hits,
{
collection: 'posts',
data: { title: 'YAML post', slug: 'post-yaml', body: 'Body yaml' },
},
];
};
class RelationController extends React.Component {
state = {
value: this.props.value,
queryHits: Map(),
};
handleOnChange = jest.fn(value => {
this.setState({ ...this.state, value });
});
setQueryHits = jest.fn(hits => {
const queryHits = Map().set('relation-field', hits);
this.setState({ ...this.state, queryHits });
});
query = jest.fn((...args) => {
const queryHits = generateHits(25);
if (last(args) === 'YAML') {
return Promise.resolve({ payload: { response: { hits: [last(queryHits)] } } });
}
return Promise.resolve({ payload: { response: { hits: queryHits } } });
});
render() {
return this.props.children({
value: this.state.value,
handleOnChange: this.handleOnChange,
query: this.query,
queryHits: this.state.queryHits,
setQueryHits: this.setQueryHits,
});
}
}
function setup({ field, value }) {
let renderArgs;
const setActiveSpy = jest.fn();
const setInactiveSpy = jest.fn();
const helpers = render(
<RelationController value={value}>
{({ handleOnChange, value, query, queryHits, setQueryHits }) => {
renderArgs = { value, onChangeSpy: handleOnChange, setQueryHitsSpy: setQueryHits };
return (
<RelationControl
field={field}
value={value}
query={query}
queryHits={queryHits}
onChange={handleOnChange}
forID="relation-field"
classNameWrapper=""
setActiveStyle={setActiveSpy}
setInactiveStyle={setInactiveSpy}
/>
);
}}
</RelationController>,
);
const input = helpers.container.querySelector('input');
return {
...helpers,
...renderArgs,
setActiveSpy,
setInactiveSpy,
input,
};
}
describe('Relation widget', () => {
it('should list the first 20 option hits on initial load', async () => {
const field = fromJS(fieldConfig);
const { getAllByText, input } = setup({ field });
fireEvent.keyDown(input, { key: 'ArrowDown' });
await wait(() => {
expect(getAllByText(/^Post # (\d{1,2}) post-number-\1$/)).toHaveLength(20);
});
});
it('should update option list based on search term', async () => {
const field = fromJS(fieldConfig);
const { getAllByText, input } = setup({ field });
fireEvent.change(input, { target: { value: 'YAML' } });
await wait(() => {
expect(getAllByText('YAML post post-yaml')).toHaveLength(1);
});
});
it('should call onChange with correct selectedItem value and metadata', async () => {
const field = fromJS(fieldConfig);
const { getByText, input, onChangeSpy } = setup({ field });
const value = 'Post # 1';
const label = 'Post # 1 post-number-1';
const metadata = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
await wait(() => {
fireEvent.keyDown(input, { key: 'ArrowDown' });
fireEvent.click(getByText(label));
expect(onChangeSpy).toHaveBeenCalledTimes(1);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata);
});
});
it('should update metadata for initial preview', async () => {
const field = fromJS(fieldConfig);
const value = 'Post # 1';
const { getByText, onChangeSpy, setQueryHitsSpy } = setup({ field, value });
const label = 'Post # 1 post-number-1';
const metadata = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
setQueryHitsSpy(generateHits(1));
await wait(() => {
expect(getByText(label)).toBeInTheDocument();
expect(onChangeSpy).toHaveBeenCalledTimes(1);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata);
});
});
describe('with multiple', () => {
it('should call onChange with correct selectedItem value and metadata', async () => {
const field = fromJS({ ...fieldConfig, multiple: true });
const { getByText, input, onChangeSpy } = setup({ field });
const metadata1 = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
const metadata2 = {
post: { posts: { 'Post # 2': { title: 'Post # 2', slug: 'post-number-2' } } },
};
await wait(() => {
fireEvent.keyDown(input, { key: 'ArrowDown' });
fireEvent.click(getByText('Post # 1 post-number-1'));
fireEvent.keyDown(input, { key: 'ArrowDown' });
fireEvent.click(getByText('Post # 2 post-number-2'));
expect(onChangeSpy).toHaveBeenCalledTimes(2);
expect(onChangeSpy).toHaveBeenCalledWith(fromJS(['Post # 1']), metadata1);
expect(onChangeSpy).toHaveBeenCalledWith(fromJS(['Post # 1', 'Post # 2']), metadata2);
});
});
it('should update metadata for initial preview', async () => {
const field = fromJS({ ...fieldConfig, multiple: true });
const value = fromJS(['Post # 1', 'Post # 2']);
const { getByText, onChangeSpy, setQueryHitsSpy } = setup({ field, value });
const metadata1 = {
post: { posts: { 'Post # 1': { title: 'Post # 1', slug: 'post-number-1' } } },
};
const metadata2 = {
post: { posts: { 'Post # 2': { title: 'Post # 2', slug: 'post-number-2' } } },
};
setQueryHitsSpy(generateHits(2));
await wait(() => {
expect(getByText('Post # 1 post-number-1')).toBeInTheDocument();
expect(getByText('Post # 2 post-number-2')).toBeInTheDocument();
expect(onChangeSpy).toHaveBeenCalledTimes(2);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata1);
expect(onChangeSpy).toHaveBeenCalledWith(value, metadata2);
});
});
});
});

6
packages/netlify-cms-widget-relation/src/index.js

@ -1,2 +1,4 @@
export RelationControl from './RelationControl';
export RelationPreview from './RelationPreview';
import controlComponent from './RelationControl';
import previewComponent from './RelationPreview';
export const NetlifyCmsWidgetRelation = { controlComponent, previewComponent };
export { controlComponent, previewComponent };