yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-09-26 17:00:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix cypress tests

Browse Source
This commit is contained in:
soupette 2019-04-09 18:07:47 +02:00
parent 2e3d004d90
commit f413decdcc
3 changed files with 150 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
packages/strapi-plugin-content-manager/admin/src/components/SelectManyDraggedItem/Content.js
View File

@ -1,5 +1,5 @@
/** /**
* *
* Content * Content
*/ */
@ -14,20 +14,23 @@ function Content({ index, item, onClick, onRemove }) {
return ( return (
<React.Fragment> <React.Fragment>
<div> <div>
<div className={styles.dragHandle}><span /></div> <div className={styles.dragHandle}>
<span />
</div>
<FormattedMessage id="content-manager.containers.Edit.clickToJump"> <FormattedMessage id="content-manager.containers.Edit.clickToJump">
{title => ( {title => (
<span <span onClick={() => onClick(item)} title={title}>
onClick={() => onClick(item)}
title={title}
>
{item.label} {item.label}
</span> </span>
)} )}
</FormattedMessage> </FormattedMessage>
</div> </div>
<div className={styles.selectManyDraggedItemActions}> <div className={styles.selectManyDraggedItemActions}>
<img src={IconRemove} alt="Remove Icon" onClick={() => onRemove(index)} /> <img
src={IconRemove}
alt="Remove Icon"
onClick={() => onRemove(index)}
/>
</div> </div>
</React.Fragment> </React.Fragment>
); );

55
packages/strapi-plugin-content-manager/admin/src/components/SelectOne/index.js
View File

@ -9,11 +9,21 @@ import Select from 'react-select';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import 'react-select/dist/react-select.css'; import 'react-select/dist/react-select.css';
import { cloneDeep, map, includes, isArray, isNull, isUndefined, isFunction, get, findIndex } from 'lodash'; import {
cloneDeep,
map,
includes,
isArray,
isNull,
isUndefined,
isFunction,
get,
findIndex,
} from 'lodash';
import request from 'utils/request'; import request from 'utils/request';
import templateObject from 'utils/templateObject'; import templateObject from 'utils/templateObject';
/* eslint-disable indent */
import styles from './styles.scss'; import styles from './styles.scss';
class SelectOne extends React.Component { class SelectOne extends React.Component {
@ -66,24 +76,30 @@ class SelectOne extends React.Component {
params, params,
}) })
.then(response => { .then(response => {
/* eslint-disable indent */
const options = isArray(response) const options = isArray(response)
? map(response, item => ({ ? map(response, item => ({
value: item, value: item,
label: templateObject({ mainField: this.props.relation.displayedAttribute }, item).mainField, label: templateObject(
{ mainField: this.props.relation.displayedAttribute },
item,
).mainField,
})) }))
: [ : [
{ {
value: response, value: response,
label: templateObject({ mainField: this.props.relation.displayedAttribute }, response) label: templateObject(
.mainField, { mainField: this.props.relation.displayedAttribute },
response,
).mainField,
}, },
]; ];
/* eslint-disable indent */
const newOptions = cloneDeep(this.state.options); const newOptions = cloneDeep(this.state.options);
options.map(option => { options.map(option => {
// Don't add the values when searching // Don't add the values when searching
if (findIndex(newOptions, o => o.value.id === option.value.id) === -1) { if (
findIndex(newOptions, o => o.value.id === option.value.id) === -1
) {
return newOptions.push(option); return newOptions.push(option);
} }
}); });
@ -94,7 +110,9 @@ class SelectOne extends React.Component {
}); });
}) })
.catch(() => { .catch(() => {
strapi.notification.error('content-manager.notification.error.relationship.fetch'); strapi.notification.error(
'content-manager.notification.error.relationship.fetch',
);
}); });
}; };
@ -111,7 +129,7 @@ class SelectOne extends React.Component {
handleBottomScroll = () => { handleBottomScroll = () => {
this.setState(prevState => { this.setState(prevState => {
return { return {
toSkip: prevState.toSkip + 20, toSkip: prevState.toSkip + 1,
}; };
}); });
}; };
@ -127,7 +145,9 @@ class SelectOne extends React.Component {
handleInputChange = value => { handleInputChange = value => {
const clonedOptions = this.state.options; const clonedOptions = this.state.options;
const filteredValues = clonedOptions.filter(data => includes(data.label, value)); const filteredValues = clonedOptions.filter(data =>
includes(data.label, value),
);
if (filteredValues.length === 0) { if (filteredValues.length === 0) {
return this.getOptions(value); return this.getOptions(value);
@ -135,7 +155,11 @@ class SelectOne extends React.Component {
}; };
render() { render() {
const description = this.props.relation.description ? <p>{this.props.relation.description}</p> : ''; const description = this.props.relation.description ? (
<p>{this.props.relation.description}</p>
) : (
''
);
const value = get(this.props.record, this.props.relation.alias); const value = get(this.props.record, this.props.relation.alias);
const excludeModel = ['role', 'permission', 'file'].includes( const excludeModel = ['role', 'permission', 'file'].includes(
@ -159,7 +183,7 @@ class SelectOne extends React.Component {
<div className={`form-group ${styles.selectOne}`}> <div className={`form-group ${styles.selectOne}`}>
<nav className={styles.headline}> <nav className={styles.headline}>
<label htmlFor={this.props.relation.alias}> <label htmlFor={this.props.relation.alias}>
{get(this.props.relation, 'label', this.props.relation.alias)} <span>({value.length})</span> {this.props.relation.alias}
</label> </label>
{entryLink} {entryLink}
</nav> </nav>
@ -182,7 +206,10 @@ class SelectOne extends React.Component {
templateObject( templateObject(
{ mainField: this.props.relation.displayedAttribute }, { mainField: this.props.relation.displayedAttribute },
isFunction(value.toJS) ? value.toJS() : value, isFunction(value.toJS) ? value.toJS() : value,
).mainField || (isFunction(value.toJS) ? get(value.toJS(), 'id') : get(value, 'id')), ).mainField ||
(isFunction(value.toJS)
? get(value.toJS(), 'id')
: get(value, 'id')),
} }
} }
/> />

180
packages/strapi-plugin-content-manager/test/front/integration/createPage_specs.js
View File

@ -18,46 +18,48 @@ describe('Testing Content Manager createPages', function() {
.then(data => { .then(data => {
jwt = data.jwt; jwt = data.jwt;
return cy return cy.createCTMApis(data.jwt).then(() => jwt);
.createCTMApis(data.jwt)
.then(() => jwt);
}) })
.wait(1000); .wait(1000);
Cypress.Commands.add('ctmTagLink', () => { Cypress.Commands.add('ctmTagLink', () => {
return cy.get('a[href="/admin/plugins/content-manager/tag?source=content-manager"]'); return cy.get(
'a[href="/admin/plugins/content-manager/tag?source=content-manager"]',
);
}); });
Cypress.Commands.add('ctmProductLink', () => { Cypress.Commands.add('ctmProductLink', () => {
return cy.get('a[href="/admin/plugins/content-manager/product?source=content-manager"]'); return cy.get(
'a[href="/admin/plugins/content-manager/product?source=content-manager"]',
);
}); });
Cypress.Commands.add('ctmCategoryLink', () => { Cypress.Commands.add('ctmCategoryLink', () => {
return cy.get('a[href="/admin/plugins/content-manager/category?source=content-manager"]'); return cy.get(
'a[href="/admin/plugins/content-manager/category?source=content-manager"]',
);
}); });
Cypress.Commands.add('ctmAddButton', () => { Cypress.Commands.add('ctmAddButton', () => {
return cy.get('button#addEntry'); return cy.get('button#addEntry');
}); });
Cypress.Commands.add('inputError', (name) => { Cypress.Commands.add('inputError', name => {
return cy.get(`#errorOf${name} > span`); return cy.get(`#errorOf${name} > span`);
}); });
Cypress.Commands.add('getListTagsOrderedByName', () => { Cypress.Commands.add('getListTagsOrderedByName', () => {
return cy.ctmTagLink() return cy
.ctmTagLink()
.click() .click()
.get('tr > th:nth-child(3) > span') .get('tr > th:nth-child(3) > span')
.click(); .click();
}); });
Cypress.Commands.add('fillProductForm', (product) => { Cypress.Commands.add('fillProductForm', product => {
Object.keys(product) Object.keys(product).forEach(key => {
.forEach(key => { if (key === 'description') {
if (key === 'description') { cy.get(`textarea[name="${key}"]`).type(product[key]);
cy.get(`textarea[name="${key}"]`) } else {
.type(product[key]); cy.get(`input[name="${key}"]`).type(product[key]);
} else { }
cy.get(`input[name="${key}"]`) });
.type(product[key]);
}
})
}); });
Cypress.Commands.add('getProduct', (index) => { Cypress.Commands.add('getProduct', index => {
return cy return cy
.ctmProductLink() .ctmProductLink()
.click() .click()
@ -74,7 +76,7 @@ describe('Testing Content Manager createPages', function() {
after(() => { after(() => {
cy.deleteApi('tag', jwt) cy.deleteApi('tag', jwt)
.deleteApi('category', jwt) .deleteApi('category', jwt)
.deleteApi('product', jwt) .deleteApi('product', jwt);
}); });
context('Creating data with no relation', () => { context('Creating data with no relation', () => {
@ -104,18 +106,24 @@ describe('Testing Content Manager createPages', function() {
.click() .click()
.ctmAddButton() .ctmAddButton()
.click(); .click();
const tagsToCreate = ['tag1', 'tag2', 'tag3', 'superTag', 'badTag', 'I\'m running out of idea tag']; const tagsToCreate = [
'tag1',
'tag2',
'tag3',
'superTag',
'badTag',
"I'm running out of idea tag",
];
// Check redirect url // Check redirect url
cy.url() cy.url().should('equal', getCreateRedirectUrl('tag'));
.should('equal', getCreateRedirectUrl('tag'));
// Try to save empty data // Try to save empty data
cy.submitForm() cy.submitForm()
.get('input#name') .get('input#name')
.invoke('attr', 'class') .invoke('attr', 'class')
.should('include', 'form-control is-invalid'); .should('include', 'form-control is-invalid');
tagsToCreate.forEach((tagName, index) => { tagsToCreate.forEach((tagName, index) => {
cy.get('input#name') cy.get('input#name')
.type(tagName) .type(tagName)
.submitForm() .submitForm()
@ -123,10 +131,9 @@ describe('Testing Content Manager createPages', function() {
.get('tbody') .get('tbody')
.children() .children()
.should('have.length', index + 1); .should('have.length', index + 1);
if (index < tagsToCreate.length -1) { if (index < tagsToCreate.length - 1) {
cy.ctmAddButton() cy.ctmAddButton().click();
.click();
} }
}); });
}); });
@ -140,11 +147,18 @@ describe('Testing Content Manager createPages', function() {
.click() .click()
.ctmAddButton() .ctmAddButton()
.click(); .click();
const catsToCreate = ['drinks', 'food', 'junk food', 'french food', 'good french food', 'greasy', 'you don\'t want to eat that']; const catsToCreate = [
'drinks',
'food',
'junk food',
'french food',
'good french food',
'greasy',
"you don't want to eat that",
];
// Check redirect url // Check redirect url
cy.url() cy.url().should('equal', getCreateRedirectUrl('category', 'name'));
.should('equal', getCreateRedirectUrl('category', 'name'));
catsToCreate.forEach((catName, index) => { catsToCreate.forEach((catName, index) => {
cy.get('input#name') cy.get('input#name')
.type(catName) .type(catName)
@ -153,10 +167,9 @@ describe('Testing Content Manager createPages', function() {
.get('tbody') .get('tbody')
.children() .children()
.should('have.length', index + 1); .should('have.length', index + 1);
if (index < catsToCreate.length -1) { if (index < catsToCreate.length - 1) {
cy.ctmAddButton() cy.ctmAddButton().click();
.click();
} }
}); });
}); });
@ -219,9 +232,7 @@ describe('Testing Content Manager createPages', function() {
return data.jwt; return data.jwt;
}) })
.then(jwt => { .then(jwt => {
return cy.seedData('tag', jwt) return cy.seedData('tag', jwt).then(() => jwt);
.then(() => jwt);
}) })
.then(jwt => { .then(jwt => {
return cy.seedData('category', jwt); return cy.seedData('category', jwt);
@ -241,16 +252,18 @@ describe('Testing Content Manager createPages', function() {
.visit('/admin') .visit('/admin')
.wait(frontLoadingDelay) .wait(frontLoadingDelay)
.wait('@initContentManager'); .wait('@initContentManager');
}) });
it('Should create a product and link several tags and 1 category', () => { it('Should create a product and link several tags and 1 category', () => {
cy.server(); cy.server();
cy.route(`${backendUrl}/content-manager/explorer/tag?_limit=10&_start=0&_sort=name:ASC&source=content-manager`).as('getTags'); cy.route(
`${backendUrl}/content-manager/explorer/tag?_limit=10&_start=0&_sort=name:ASC&source=content-manager`,
).as('getTags');
cy.ctmProductLink() cy.ctmProductLink()
.click() .click()
.ctmAddButton() .ctmAddButton()
.click(); .click();
// Test default value // Test default value
cy.get('button#__OFF__bool') cy.get('button#__OFF__bool')
.invoke('attr', 'class') .invoke('attr', 'class')
@ -260,23 +273,20 @@ describe('Testing Content Manager createPages', function() {
.should('includes', 'gradientOn'); .should('includes', 'gradientOn');
// Create a product // Create a product
const product = { const product = {
name: 'product1', name: 'product1',
description: 'This is a super description', description: 'This is a super description',
price: 1337, price: 1337,
email: 'hi@strapi.io', email: 'hi@strapi.io',
}; };
Object.keys(product) Object.keys(product).forEach(key => {
.forEach(key => { if (key === 'description') {
if (key === 'description') { cy.get(`textarea[name="${key}"]`).type(product[key]);
cy.get(`textarea[name="${key}"]`) } else {
.type(product[key]); cy.get(`input[name="${key}"]`).type(product[key]);
} else { }
cy.get(`input[name="${key}"]`) });
.type(product[key]);
}
});
cy.get('button#__ON__bool') cy.get('button#__ON__bool')
.click() .click()
@ -290,7 +300,7 @@ describe('Testing Content Manager createPages', function() {
.type('{enter}', { force: true }) .type('{enter}', { force: true })
.get('ul#sortableListOftags') .get('ul#sortableListOftags')
.children('li') .children('li')
.should((children) => { .should(children => {
expect(children[0].innerText.trim()).to.equal('special tag'); expect(children[0].innerText.trim()).to.equal('special tag');
expect(children[1].innerText.trim()).to.equal('tag1'); expect(children[1].innerText.trim()).to.equal('tag1');
}) })
@ -308,11 +318,11 @@ describe('Testing Content Manager createPages', function() {
.click() .click()
.get('ul#sortableListOfproducts') .get('ul#sortableListOfproducts')
.children() .children()
.should((children) => { .should(children => {
expect(children).to.have.length(1); expect(children).to.have.length(1);
expect(children[0].innerText.trim()).to.equal('product1'); expect(children[0].innerText.trim()).to.equal('product1');
}); });
cy.getListTagsOrderedByName() cy.getListTagsOrderedByName()
.wait('@getTags') .wait('@getTags')
.wait(2000) .wait(2000)
@ -320,11 +330,11 @@ describe('Testing Content Manager createPages', function() {
.click() .click()
.get('ul#sortableListOfproducts') .get('ul#sortableListOfproducts')
.children() .children()
.should((children) => { .should(children => {
expect(children).to.have.length(1); expect(children).to.have.length(1);
expect(children[0].innerText.trim()).to.equal('product1'); expect(children[0].innerText.trim()).to.equal('product1');
}); });
}); });
it('Should delete a product in tag1', () => { it('Should delete a product in tag1', () => {
cy.getListTagsOrderedByName() cy.getListTagsOrderedByName()
@ -332,7 +342,9 @@ describe('Testing Content Manager createPages', function() {
.get('tbody > tr:nth-child(2)') .get('tbody > tr:nth-child(2)')
.click() .click()
.wait(1000) .wait(1000)
.get('ul#sortableListOfproducts > li:nth-child(1) > div:nth-child(2)') .get(
'ul#sortableListOfproducts > li:nth-child(1) > div:nth-child(2) > img',
)
.click() .click()
.submitForm() .submitForm()
.ctmProductLink() .ctmProductLink()
@ -343,7 +355,7 @@ describe('Testing Content Manager createPages', function() {
.wait(frontLoadingDelay) .wait(frontLoadingDelay)
.get('ul#sortableListOftags') .get('ul#sortableListOftags')
.children() .children()
.should((children) => { .should(children => {
expect(children).to.have.length(1); expect(children).to.have.length(1);
expect(children[0].innerText.trim()).to.equal('special tag'); expect(children[0].innerText.trim()).to.equal('special tag');
}); });
@ -351,8 +363,12 @@ describe('Testing Content Manager createPages', function() {
it('Should add several products to category french food', () => { it('Should add several products to category french food', () => {
cy.server(); cy.server();
cy.route(`${backendUrl}/content-manager/explorer/category?_limit=10&_start=0&_sort=_id:ASC&source=content-manager`).as('getCategories'); cy.route(
cy.route(`${backendUrl}/content-manager/explorer/product?_limit=10&_start=0&_sort=_id:ASC&source=content-manager`).as('getProducts'); `${backendUrl}/content-manager/explorer/category?_limit=10&_start=0&_sort=_id:ASC&source=content-manager`,
).as('getCategories');
cy.route(
`${backendUrl}/content-manager/explorer/product?_limit=10&_start=0&_sort=_id:ASC&source=content-manager`,
).as('getProducts');
const product = { const product = {
name: 'MacBook', name: 'MacBook',
description: 'A laptop', description: 'A laptop',
@ -384,13 +400,16 @@ describe('Testing Content Manager createPages', function() {
.wait(1000) .wait(1000)
.get('tbody > tr:nth-child(5)') .get('tbody > tr:nth-child(5)')
.click() .click()
.get('ul#sortableListOfproducts').as('relations') .get('ul#sortableListOfproducts')
.as('relations')
.children() .children()
.should(children => { .should(children => {
expect(children).to.have.length(1); expect(children).to.have.length(1);
expect(children[0].innerText.trim()).to.equal('product1'); expect(children[0].innerText.trim()).to.equal('product1');
}) })
.get('ul#sortableListOfproducts > li:nth-child(1) > div:nth-child(2)') .get(
'ul#sortableListOfproducts > li:nth-child(1) > div:nth-child(2) > img',
)
.click() .click()
.get('input#products') .get('input#products')
.type('mac', { force: true }) .type('mac', { force: true })
@ -406,30 +425,29 @@ describe('Testing Content Manager createPages', function() {
}) })
.submitForm(); .submitForm();
cy.getProduct(1) cy.getProduct(1).then(pluginStore => {
.then(pluginStore => { const category = pluginStore
const category = pluginStore .getState()
.getState() .getIn(['content-manager_editPage', 'record', 'category']);
.getIn(['content-manager_editPage', 'record', 'category'])
expect(category).to.equal(null);
expect(category).to.equal(null); });
});
cy.getProduct(2) cy.getProduct(2)
.then(pluginStore => { .then(pluginStore => {
const category = pluginStore const category = pluginStore
.getState() .getState()
.getIn(['content-manager_editPage', 'record', 'category', 'name']) .getIn(['content-manager_editPage', 'record', 'category', 'name']);
expect(category).to.equal('french food'); expect(category).to.equal('french food');
}) })
.getProduct(3) .getProduct(3)
.then(pluginStore => { .then(pluginStore => {
const category = pluginStore const category = pluginStore
.getState() .getState()
.getIn(['content-manager_editPage', 'record', 'category', 'name']) .getIn(['content-manager_editPage', 'record', 'category', 'name']);
expect(category).to.equal('french food'); expect(category).to.equal('french food');
}); });
}); });