Merge pull request #158 from fooki/master

Throw an error when the dataLength prop is missing

Author: ankeetmaini

src/__tests__/index.test.tsx

@@ -3,7 +3,12 @@ import { render, cleanup } from '@testing-library/react';
 import InfiniteScroll from '../index';
 
 describe('React Infinite Scroll Component', () => {
-  afterEach(cleanup);
+  const originalConsoleError = console.error;
+
+  afterEach(() => {
+    cleanup();
+    console.error = originalConsoleError;
+  });
 
   it('renders .infinite-scroll-component', () => {
     const { container } = render(
@@ -78,6 +83,18 @@ describe('React Infinite Scroll Component', () => {
     expect(onScrollMock).toHaveBeenCalled();
   });
 
+  describe('When missing the dataLength prop', () => {
+    it('throws an error', () => {
+      console.error = jest.fn();
+      const props = { loader: 'Loading...', hasMore: false, next: (() => {}) }
+
+      // @ts-ignore
+      expect(() => render(<InfiniteScroll {...props} />)).toThrow(Error)
+      // @ts-ignore
+      expect(console.error.mock.calls[0][0]).toContain('"dataLength" is missing')
+    });
+  })
+
   describe('When user scrolls to the bottom', () => {
     it('does not show loader if hasMore is false', () => {
       const { container, queryByText } = render(

src/index.tsx

@@ -66,6 +66,13 @@ export default class InfiniteScroll extends Component<Props, State> {
   private maxPullDownDistance = 0;
 
   componentDidMount() {
+    if (typeof this.props.dataLength === 'undefined') {
+      throw new Error(
+        `mandatory prop "dataLength" is missing. The prop is needed` +
+        ` when loading more content. Check README.md for usage`
+      )
+    }
+
     this._scrollableNode = this.getScrollableTarget();
     this.el = this.props.height
       ? this._infScroll