Container fails to load React.StrictMode

[cpandit201]

Getting an error when kept wrapped React.StrictMode around app when using resizer

Steps to reproduce:

• Create react app using create-react-app
• Wrap the component in <React.StrictMode/>
• Error Cannot read property 'getBoundingClientRect' of undefined
• Remove the wrapped React.StrictMode
• The error does not come

TypeError: Cannot read property 'getBoundingClientRect' of undefined
(anonymous function)
node_modules/react-simple-resizer/dist/Container/index.js:162
  159 |         minSize: childProps.minSize,
  160 |         disableResponsive: utils_2.isDisabledResponsive(childProps),
  161 |         isSolid: utils_2.isSolid(childProps),
> 162 |         currentSize: element.getBoundingClientRect()[_this.dimension],
      | ^  163 |     });
  164 | });
  165 | return getResult();
View compiled

Code snippets
My App.js

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import Resizer from './Resizer';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(
  <React.StrictMode>
    <Resizer />,
  </React.StrictMode>,
  document.getElementById('root')
);

My Resizer Component

import React , {Component} from 'react';
import { Container, Section, Bar } from 'react-simple-resizer';

export default class Resizer extends Component {
    render () {
        return (
            <Container style={{ height: '500px' }}>
                <Section style={{ background: '#d3d3d3' }} minSize={100}/>
                <Bar size={10} style={{ background: '#888888', cursor: 'col-resize' }} />
                <Section style={{ background: '#d3d3d3' }} minSize={100} />
            </Container>
        );
    }
};