Uncaught TypeError: Cannot read property '__TableColumnGroup__' of undefined

[vidyanand]

I am trying to render a table and run into this issue. I have created the minimal amount of JSX that can be used to represent this.

I am using
react@17.0.2
fixed-data-table-2@1.1.2

Expected Behavior

I expect a table to be rendered with the columns

Current Behavior

Running int to the below error

convertColumnElementsToData.js:55 Uncaught TypeError: Cannot read property TableColumnGroup of undefined
at convertColumnElementsToData.js:55
at react.development.js:1104
at react.development.js:1067
at mapIntoArray (react.development.js:964)
at mapIntoArray (react.development.js:1004)
at mapChildren (react.development.js:1066)
at Object.forEachChildren [as forEach] (react.development.js:1103)
at convertColumnElementsToData (convertColumnElementsToData.js:50)
at setStateFromProps (reducers.js:294)
at reducers (reducers.js:143)
at Object.dispatch (redux.js:213)
at new FixedDataTableContainer (FixedDataTableContainer.js:78)

Possible Solution

Steps to Reproduce (for bugs)

The following simple JSX seems to create the problem:

<div
  className="result-table-preview-container"
  style={{
    height: 170
  }}
>
  <FixedDataTableContainer
    defaultScrollbars
    headerHeight={50}
    height={600}
    rowHeight={50}
    rowsCount={2}
    scrollbarXHeight={15}
    scrollbarYWidth={15}
    width={1874}
  >
    <FixedDataTableColumn
      allowCellsRecycling={false}
      cell={<FixedDataTableCellDefault>Column 1</FixedDataTableCellDefault>}
      fixed={false}
      fixedRight={false}
      header={<FixedDataTableCellDefault>Col 1</FixedDataTableCellDefault>}
      width={2000}
    />
  </FixedDataTableContainer>
</div>

Your Environment

• Version used: react@17.0.2 , fixed-data-table-2@1.1.2
• Browser Name and version: Chrome Version 91.0.4472.77
• Operating System and version (desktop or mobile): Ubuntu 20.04

[vidyanand]

I realised that there was an empty string ('') being returned inside the code just before the column was being created, which react seems to have treated as a child element and that was causing this. The issue was with the code I was working on and not this library. I will Close the issue.