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

chore(content-manager): prop types and fix existing tests

Browse Source
This commit is contained in:
Jamie Howard 2022-12-23 11:11:05 +00:00
parent 470c1c9645
commit 0d2b5c7dd6
8 changed files with 73 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/core/admin/admin/src/content-manager/components/DynamicZone/components/DynamicComponent.js
View File

@ -230,7 +230,6 @@ DynamicZoneComponent.defaultProps = {
}; };
DynamicZoneComponent.propTypes = { DynamicZoneComponent.propTypes = {
sourceComponentId: PropTypes.number.isRequired,
componentUid: PropTypes.string.isRequired, componentUid: PropTypes.string.isRequired,
formErrors: PropTypes.object, formErrors: PropTypes.object,
index: PropTypes.number, index: PropTypes.number,
@ -241,6 +240,7 @@ DynamicZoneComponent.propTypes = {
onCancel: PropTypes.func, onCancel: PropTypes.func,
onMoveComponent: PropTypes.func.isRequired, onMoveComponent: PropTypes.func.isRequired,
onRemoveComponentClick: PropTypes.func.isRequired, onRemoveComponentClick: PropTypes.func.isRequired,
sourceComponentId: PropTypes.number.isRequired,
}; };
export default DynamicZoneComponent; export default DynamicZoneComponent;

2
packages/core/admin/admin/src/content-manager/components/FieldComponent/index.js
View File

@ -105,9 +105,9 @@ const FieldComponent = ({
{!isRepeatable && isInitialized && ( {!isRepeatable && isInitialized && (
<NonRepeatableComponent <NonRepeatableComponent
componentUid={componentUid} componentUid={componentUid}
source={source}
isNested={isNested} isNested={isNested}
name={name} name={name}
source={source}
/> />
)} )}
{isRepeatable && ( {isRepeatable && (

6
packages/core/admin/admin/src/content-manager/components/NonRepeatableComponent/index.js
View File

@ -89,10 +89,6 @@ const NonRepeatableComponent = ({ componentUid, isNested, name, source }) => {
NonRepeatableComponent.defaultProps = { NonRepeatableComponent.defaultProps = {
isNested: false, isNested: false,
source: {
type: '',
componentId: 0,
},
}; };
NonRepeatableComponent.propTypes = { NonRepeatableComponent.propTypes = {
@ -102,7 +98,7 @@ NonRepeatableComponent.propTypes = {
source: PropTypes.shape({ source: PropTypes.shape({
type: PropTypes.string, type: PropTypes.string,
componentId: PropTypes.number, componentId: PropTypes.number,
}), }).isRequired,
}; };
export default NonRepeatableComponent; export default NonRepeatableComponent;

2
packages/core/admin/admin/src/content-manager/components/RelationInput/RelationInput.js
View File

@ -473,7 +473,7 @@ const ListItem = ({ data, index, style }) => {
ariaDescribedBy={ariaDescribedBy} ariaDescribedBy={ariaDescribedBy}
canDrag={canDrag} canDrag={canDrag}
disabled={disabled} disabled={disabled}
displayValue={mainField ?? id} displayValue={String(mainField ?? id)}
iconButtonAriaLabel={iconButtonAriaLabel} iconButtonAriaLabel={iconButtonAriaLabel}
id={id} id={id}
index={index} index={index}

6
packages/core/admin/admin/src/content-manager/components/RelationInputDataManager/RelationInputDataManager.js
View File

@ -367,10 +367,6 @@ RelationInputDataManager.defaultProps = {
isFieldAllowed: true, isFieldAllowed: true,
placeholder: null, placeholder: null,
required: false, required: false,
source: {
type: '',
componentId: 0,
},
}; };
RelationInputDataManager.propTypes = { RelationInputDataManager.propTypes = {
@ -417,7 +413,7 @@ RelationInputDataManager.propTypes = {
source: PropTypes.shape({ source: PropTypes.shape({
type: PropTypes.string, type: PropTypes.string,
componentId: PropTypes.number, componentId: PropTypes.number,
}), }).isRequired,
}; };
const Memoized = memo(RelationInputDataManager); const Memoized = memo(RelationInputDataManager);

10
packages/core/admin/admin/src/content-manager/components/RelationInputDataManager/tests/RelationInputDataManger.test.js
View File

@ -11,6 +11,7 @@ import { useCMEditViewDataManager } from '@strapi/helper-plugin';
import { useRelation } from '../../../hooks/useRelation'; import { useRelation } from '../../../hooks/useRelation';
import { RelationInputDataManager } from '..'; import { RelationInputDataManager } from '..';
import { ItemTypes } from '../../../utils';
const queryClient = new QueryClient({ const queryClient = new QueryClient({
defaultOptions: { defaultOptions: {
@ -30,7 +31,6 @@ jest.mock('../../../hooks/useRelation', () => ({
isSuccess: true, isSuccess: true,
status: 'success', status: 'success',
}, },
search: { search: {
data: { data: {
pages: [ pages: [
@ -134,6 +134,10 @@ const RelationInputDataManagerComponent = (props) => (
queryInfos={{ queryInfos={{
shouldDisplayRelationLink: true, shouldDisplayRelationLink: true,
}} }}
source={{
type: ItemTypes.DYNAMIC_ZONE,
componentId: 0,
}}
{...props} {...props}
/> />
</IntlProvider> </IntlProvider>
@ -400,7 +404,7 @@ describe('RelationInputDataManager', () => {
fireEvent.dragOver(dropZone); fireEvent.dragOver(dropZone);
fireEvent.drop(dropZone); fireEvent.drop(dropZone);
expect(relationReorder).toBeCalledWith({ name: 'relation', newIndex: 0, oldIndex: 1 }); expect(relationReorder).toBeCalledWith({ name: 'relation', newIndex: 1, oldIndex: 0 });
}); });
describe('Accessibility', () => { describe('Accessibility', () => {
@ -564,7 +568,7 @@ describe('RelationInputDataManager', () => {
expect(queryByText(/\(8\)/)).toBeInTheDocument(); expect(queryByText(/\(8\)/)).toBeInTheDocument();
}); });
it.only('should not crash, if the field is not set in modifiedData (e.g. in components)', () => { it('should not crash, if the field is not set in modifiedData (e.g. in components)', () => {
useCMEditViewDataManager.mockImplementation(() => ({ useCMEditViewDataManager.mockImplementation(() => ({
isCreatingEntry: false, isCreatingEntry: false,
createActionAllowedFields: ['relation'], createActionAllowedFields: ['relation'],

7
packages/core/admin/admin/src/content-manager/components/RepeatableComponent/components/tests/Component.test.js
View File

@ -15,8 +15,8 @@ jest.mock('@strapi/helper-plugin', () => ({
useCMEditViewDataManager: jest.fn().mockImplementation(() => ({ useCMEditViewDataManager: jest.fn().mockImplementation(() => ({
modifiedData: { modifiedData: {
test: { test: {
test: 'repetable-component', test: 'repeatable-component',
drag: 'repetable-component2', drag: 'repeatable-component2',
}, },
}, },
})), })),
@ -30,6 +30,7 @@ describe('RepeatableComponent | Component', () => {
const defaultProps = { const defaultProps = {
componentFieldName: 'test', componentFieldName: 'test',
index: 0, index: 0,
sourceComponentId: 0,
mainField: 'test', mainField: 'test',
moveComponentField: jest.fn(), moveComponentField: jest.fn(),
onClickToggle: jest.fn(), onClickToggle: jest.fn(),
@ -52,7 +53,7 @@ describe('RepeatableComponent | Component', () => {
it('should render my accordion by default', () => { it('should render my accordion by default', () => {
const { getByRole, queryByText } = setup(); const { getByRole, queryByText } = setup();
expect(getByRole('button', { name: 'repetable-component' })).toBeInTheDocument(); expect(getByRole('button', { name: 'repeatable-component' })).toBeInTheDocument();
expect(queryByText("I'm a field component")).not.toBeInTheDocument(); expect(queryByText("I'm a field component")).not.toBeInTheDocument();
expect(queryByText("I'm inputs")).not.toBeInTheDocument(); expect(queryByText("I'm inputs")).not.toBeInTheDocument();
}); });

71
packages/core/admin/admin/src/content-manager/components/RepeatableComponent/tests/index.test.js
View File

@ -102,7 +102,10 @@ describe('RepeatableComponents', () => {
const user = userEvent.setup(); const user = userEvent.setup();
const { getAllByText, getByRole } = setup({ const { getAllByText, getByRole } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -119,7 +122,10 @@ describe('RepeatableComponents', () => {
it('should render a passed error message', () => { it('should render a passed error message', () => {
const { queryByText, getAllByRole, getByText } = setup({ const { queryByText, getAllByRole, getByText } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
name: 'error-field', name: 'error-field',
}); });
@ -131,7 +137,10 @@ describe('RepeatableComponents', () => {
it('should render a specific min error when error message contains the word min', () => { it('should render a specific min error when error message contains the word min', () => {
const { queryByText, getAllByRole, getByText } = setup({ const { queryByText, getAllByRole, getByText } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
min: 4, min: 4,
name: 'error-min', name: 'error-min',
@ -165,7 +174,10 @@ describe('RepeatableComponents', () => {
}); });
const { getByRole } = setup({ const { getByRole } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -185,7 +197,10 @@ describe('RepeatableComponents', () => {
useNotification.mockReturnValueOnce(toggleNotification); useNotification.mockReturnValueOnce(toggleNotification);
const { getByRole } = setup({ const { getByRole } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
max: 2, max: 2,
}); });
@ -217,7 +232,10 @@ describe('RepeatableComponents', () => {
}); });
const { getAllByRole } = setup({ const { getAllByRole } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -257,7 +275,10 @@ describe('RepeatableComponents', () => {
}); });
const { getAllByRole } = setup({ const { getAllByRole } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -298,7 +319,10 @@ describe('RepeatableComponents', () => {
})); }));
const { getByRole, rerender } = setup({ const { getByRole, rerender } = setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -310,7 +334,11 @@ describe('RepeatableComponents', () => {
rerender( rerender(
<TestComponent <TestComponent
componentValueLength={3} componentValueLength={3}
componentValue={[{ __temp_key__: 1 }, { __temp_key__: 2 }, { __temp_key__: 3 }]} componentValue={[
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
{ id: 3, __temp_key__: 3 },
]}
/> />
); );
@ -323,7 +351,10 @@ describe('RepeatableComponents', () => {
describe('Accessibility', () => { describe('Accessibility', () => {
it('should have have description text', () => { it('should have have description text', () => {
setup({ setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -332,7 +363,10 @@ describe('RepeatableComponents', () => {
it('should update the live text when an item has been grabbed', async () => { it('should update the live text when an item has been grabbed', async () => {
setup({ setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -349,7 +383,10 @@ describe('RepeatableComponents', () => {
it('should change the live text when an item has been moved', () => { it('should change the live text when an item has been moved', () => {
setup({ setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -363,7 +400,10 @@ describe('RepeatableComponents', () => {
it('should change the live text when an item has been dropped', () => { it('should change the live text when an item has been dropped', () => {
setup({ setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });
@ -378,7 +418,10 @@ describe('RepeatableComponents', () => {
it('should change the live text after the reordering interaction has been cancelled', () => { it('should change the live text after the reordering interaction has been cancelled', () => {
setup({ setup({
componentValue: [{ __temp_key__: 1 }, { __temp_key__: 2 }], componentValue: [
{ id: 1, __temp_key__: 1 },
{ id: 2, __temp_key__: 2 },
],
componentValueLength: 2, componentValueLength: 2,
}); });