fix: console errors in tests (#603)

* fix: console errors in tests + TypeScript error fixes * Remove check for null in content list fieldsToDisplay is a required field. It makes no sense to show null if it is undefined.
SenseNet · Mar 20, 2020 · c36646f · c36646f
1 parent e75c945
commit c36646f
Show file tree

Hide file tree

Showing 12 changed files with 75 additions and 150 deletions.
diff --git a/packages/sn-client-core/test/repository.test.ts b/packages/sn-client-core/test/repository.test.ts
@@ -98,13 +98,12 @@ describe('Repository', () => {
 
     describe('count', () => {
       it('should construct the url to contain /$count', async () => {
-        let url: string
         const countRepository = new Repository(undefined, input => {
-          url = input.toString()
+          const url = input.toString()
+          expect(url).toMatch(/http:\/\/localhost\/odata.svc\/Root\/Content\/\$count/g)
           return Promise.resolve({ ok: true, json: () => 42 }) as any
         })
         await countRepository.count({ path: '/Root/Content' })
-        expect(url).toMatch(/http:\/\/localhost\/odata.svc\/Root\/Content\/\$count/g)
       })
 
       it('should throw on unsuccessfull request', async () => {

diff --git a/packages/sn-controls-react/src/fieldcontrols/TagsInput.tsx b/packages/sn-controls-react/src/fieldcontrols/TagsInput.tsx
@@ -177,7 +177,7 @@ export class TagsInput extends Component<ReactClientFieldSetting<ReferenceFieldS
     if (this.props.settings.AllowMultiple) {
       return this.state.fieldValue.length ? this.state.fieldValue.map(c => c.Id) : []
     }
-    return this.state.fieldValue.length ? [this.state.fieldValue[0].Id] : []
+    return this.state.fieldValue.length ? [this.state.fieldValue[0].Id] : ''
   }
 
   public render() {
@@ -204,7 +204,7 @@ export class TagsInput extends Component<ReactClientFieldSetting<ReferenceFieldS
                         <Chip
                           avatar={
                             <Avatar
-                              alt={content.DisplayName}
+                              alt={`The avatar of ${content.DisplayName}`}
                               src={
                                 content.Avatar && content.Avatar.Url
                                   ? `${this.props.repository!.configuration.repositoryUrl}${content.Avatar.Url}`

diff --git a/packages/sn-controls-react/test/TagsInput.test.tsx b/packages/sn-controls-react/test/TagsInput.test.tsx
@@ -1,11 +1,10 @@
-import React from 'react'
-import { mount, shallow } from 'enzyme'
+import Chip from '@material-ui/core/Chip'
 import FormControlLabel from '@material-ui/core/FormControlLabel'
-import FormLabel from '@material-ui/core/FormLabel'
 import Select from '@material-ui/core/Select'
-import { sleepAsync } from '@sensenet/client-utils'
-import Chip from '@material-ui/core/Chip'
 import SvgIcon from '@material-ui/core/SvgIcon'
+import { sleepAsync } from '@sensenet/client-utils'
+import { mount, shallow } from 'enzyme'
+import React from 'react'
 import { act } from 'react-dom/test-utils'
 import { TagsInput } from '../src/fieldcontrols/TagsInput'
 
@@ -55,7 +54,6 @@ const repository: any = {
 describe('Tags input field control', () => {
   describe('in browse view', () => {
     it('should show the value of the field when content is passed', async () => {
-      const consoleSpy = jest.spyOn(console, 'error')
       const wrapper = mount(
         <TagsInput
           actionName="browse"
@@ -64,14 +62,13 @@ describe('Tags input field control', () => {
           repository={repository}
         />,
       )
-      expect(consoleSpy).not.toBeCalled()
       await sleepAsync(0)
       const updatedWrapper = wrapper.update()
       expect(updatedWrapper.find(FormControlLabel).children()).toHaveLength(1)
     })
 
     it('should not show anything when field value is not provided', () => {
-      const wrapper = shallow(<TagsInput actionName="browse" settings={defaultSettings} />)
+      const wrapper = shallow(<TagsInput actionName="browse" repository={repository} settings={defaultSettings} />)
       expect(wrapper.get(0)).toBeFalsy()
     })
   })

diff --git a/packages/sn-controls-react/test/__mocks__/schema.ts b/packages/sn-controls-react/test/__mocks__/schema.ts
@@ -9,6 +9,7 @@ export const schema = [
     AllowIndexing: true,
     AllowIncrementalNaming: false,
     AllowedChildTypes: [],
+    HandlerName: 'a',
     FieldSettings: [
       {
         Name: 'DisplayName',

diff --git a/packages/sn-list-controls-react/src/ContentList/CellTemplates/ActionsCell.tsx b/packages/sn-list-controls-react/src/ContentList/CellTemplates/ActionsCell.tsx
@@ -57,7 +57,7 @@ export class ActionsCell<T extends GenericContent> extends React.Component<Actio
   public render() {
     return (
       <TableCell
-        component="div"
+        component={this.props.virtual ? 'div' : 'td'}
         style={
           this.props.virtual
             ? {

diff --git a/packages/sn-list-controls-react/src/ContentList/CellTemplates/DateCell.tsx b/packages/sn-list-controls-react/src/ContentList/CellTemplates/DateCell.tsx
@@ -22,7 +22,7 @@ export const DateCell: React.StatelessComponent<DateCellProps> = props => {
             }
           : {}
       }
-      component="div">
+      component={props.virtual ? 'div' : 'td'}>
       <Moment fromNow={true}>{props.date}</Moment>
     </TableCell>
   )

diff --git a/packages/sn-list-controls-react/src/ContentList/CellTemplates/ReferenceCell.tsx b/packages/sn-list-controls-react/src/ContentList/CellTemplates/ReferenceCell.tsx
@@ -25,7 +25,7 @@ export class ReferenceCell<T extends GenericContent> extends React.Component<Ref
               }
             : {}
         }
-        component="div">
+        component={virtual ? 'div' : 'td'}>
         <span>{content[fieldName]}</span>
       </TableCell>
     )

diff --git a/packages/sn-list-controls-react/src/ContentList/ContentList.tsx b/packages/sn-list-controls-react/src/ContentList/ContentList.tsx
@@ -138,34 +138,29 @@ export const ContentList: React.FC<ContentListProps<GenericContent>> = props =>
                 />
               </TableCell>
             ) : null}
-            {props.fieldsToDisplay
-              ? props.fieldsToDisplay.map(field => {
-                  const fieldSetting = getSchemaForField(field)
-                  const isNumeric =
-                    fieldSetting &&
-                    (fieldSetting.Type === 'IntegerFieldSetting' || fieldSetting.Type === 'NumberFieldSetting')
-                  const description = (fieldSetting && fieldSetting.Description) || field
-                  const displayName = (fieldSetting && fieldSetting.DisplayName) || field
-                  return (
-                    <TableCell
-                      key={field as string}
-                      align={isNumeric ? 'right' : 'inherit'}
-                      className={field as string}>
-                      <Tooltip title={description}>
-                        <TableSortLabel
-                          active={props.orderBy === field}
-                          direction={props.orderDirection}
-                          onClick={() =>
-                            props.onRequestOrderChange &&
-                            props.onRequestOrderChange(field, props.orderDirection === 'asc' ? 'desc' : 'asc')
-                          }>
-                          {displayName}
-                        </TableSortLabel>
-                      </Tooltip>
-                    </TableCell>
-                  )
-                })
-              : null}
+            {props.fieldsToDisplay.map(field => {
+              const fieldSetting = getSchemaForField(field)
+              const isNumeric =
+                fieldSetting &&
+                (fieldSetting.Type === 'IntegerFieldSetting' || fieldSetting.Type === 'NumberFieldSetting')
+              const description = (fieldSetting && fieldSetting.Description) || field
+              const displayName = (fieldSetting && fieldSetting.DisplayName) || field
+              return (
+                <TableCell key={field as string} align={isNumeric ? 'right' : 'inherit'} className={field as string}>
+                  <Tooltip title={description}>
+                    <TableSortLabel
+                      active={props.orderBy === field}
+                      direction={props.orderDirection}
+                      onClick={() =>
+                        props.onRequestOrderChange &&
+                        props.onRequestOrderChange(field, props.orderDirection === 'asc' ? 'desc' : 'asc')
+                      }>
+                      {displayName}
+                    </TableSortLabel>
+                  </Tooltip>
+                </TableCell>
+              )
+            })}
           </TableRow>
         </TableHead>
       )}
@@ -202,21 +197,19 @@ export const ContentList: React.FC<ContentListProps<GenericContent>> = props =>
                   )}
                 </TableCell>
               ) : null}
-              {props.fieldsToDisplay
-                ? props.fieldsToDisplay.map(field => {
-                    const fieldSetting = getSchemaForField(field)
-                    const cellProps: CellProps = {
-                      ...(props as ContentListProps),
-                      field,
-                      content: item,
-                      fieldSetting,
-                      isSelected,
-                    }
+              {props.fieldsToDisplay.map(field => {
+                const fieldSetting = getSchemaForField(field)
+                const cellProps: CellProps = {
+                  ...(props as ContentListProps),
+                  field,
+                  content: item,
+                  fieldSetting,
+                  isSelected,
+                }
 
-                    const FieldComponent = props.fieldComponent || defaultFieldComponents
-                    return <FieldComponent key={cellProps.field} {...cellProps} />
-                  })
-                : null}
+                const FieldComponent = props.fieldComponent || defaultFieldComponents
+                return <FieldComponent key={cellProps.field} {...cellProps} />
+              })}
             </TableRow>
           )
         })}

diff --git a/packages/sn-list-controls-react/test/__snapshots__/content-list.test.tsx.snap b/packages/sn-list-controls-react/test/__snapshots__/content-list.test.tsx.snap
@@ -3177,54 +3177,6 @@ exports[`ContentList component Selection and active item changes Event bindings
 </WithStyles(ForwardRef(Table))>
 `;
 
-exports[`ContentList component Selection and active item changes Event bindings should render without crashing without fieldsToDisplay 1`] = `
-<WithStyles(ForwardRef(Table))>
-  <WithStyles(ForwardRef(TableHead))>
-    <WithStyles(ForwardRef(TableRow))>
-      <WithStyles(ForwardRef(TableCell))
-        key="selectAll"
-        padding="checkbox"
-        style={
-          Object {
-            "paddingRight": 0,
-            "width": "30px",
-          }
-        }
-      >
-        <WithStyles(ForwardRef(Checkbox))
-          checked={false}
-          className="select-all"
-          indeterminate={false}
-          onChange={[Function]}
-        />
-      </WithStyles(ForwardRef(TableCell))>
-    </WithStyles(ForwardRef(TableRow))>
-  </WithStyles(ForwardRef(TableHead))>
-  <WithStyles(ForwardRef(TableBody))>
-    <WithStyles(ForwardRef(TableRow))
-      className="  type-folder"
-      hover={true}
-      key="1"
-      onClick={[Function]}
-      onContextMenu={[Function]}
-      onDoubleClick={[Function]}
-      onTouchEnd={[Function]}
-      selected={false}
-    >
-      <WithStyles(ForwardRef(TableCell))
-        key="select"
-        padding="checkbox"
-      >
-        <WithStyles(ForwardRef(Checkbox))
-          checked={false}
-          onChange={[Function]}
-        />
-      </WithStyles(ForwardRef(TableCell))>
-    </WithStyles(ForwardRef(TableRow))>
-  </WithStyles(ForwardRef(TableBody))>
-</WithStyles(ForwardRef(Table))>
-`;
-
 exports[`ContentList component Selection and active item changes Event bindings should render without crashing without icons 1`] = `
 <WithStyles(ForwardRef(Table))>
   <WithStyles(ForwardRef(TableHead))>

diff --git a/packages/sn-list-controls-react/test/content-list.test.tsx b/packages/sn-list-controls-react/test/content-list.test.tsx
@@ -682,21 +682,6 @@ describe('ContentList component', () => {
         expect(component).toMatchSnapshot()
         component.unmount()
       })
-      it('should render without crashing without fieldsToDisplay', () => {
-        const component = shallow(
-          <ContentList
-            items={[{ Id: 1, Name: '1', Path: '1', DisplayName: 'A', Type: 'Folder' }]}
-            schema={genericSchema}
-            selected={[]}
-            orderBy="DisplayName"
-            orderDirection="asc"
-            icons={{}}
-            displayRowCheckbox={true}
-          />,
-        )
-        expect(component).toMatchSnapshot()
-        component.unmount()
-      })
     })
   })
 })