More dev only prop checks (#945)

src/view/draggable/check-own-props.js

@@ -8,6 +8,9 @@ export default (props: Props) => {
     Number.isInteger(props.index),
     'Draggable requires an integer index prop',
   );
-
   invariant(props.draggableId, 'Draggable requires a draggableId');
+  invariant(
+    typeof props.isDragDisabled === 'boolean',
+    'isDragDisabled must be a boolean',
+  );
 };

src/view/droppable/check-own-props.js

@@ -0,0 +1,19 @@
+// @flow
+import invariant from 'tiny-invariant';
+import type { Props } from './droppable-types';
+
+export default (props: Props) => {
+  invariant(props.droppableId, 'A Droppable requires a droppableId prop');
+  invariant(
+    typeof props.isDropDisabled === 'boolean',
+    'isDropDisabled must be a boolean',
+  );
+  invariant(
+    typeof props.isCombineEnabled === 'boolean',
+    'isCombineEnabled must be a boolean',
+  );
+  invariant(
+    typeof props.ignoreContainerClipping === 'boolean',
+    'ignoreContainerClipping must be a boolean',
+  );
+};

src/view/droppable/droppable.jsx

@@ -1,6 +1,5 @@
 // @flow
 import React, { Component } from 'react';
-import invariant from 'tiny-invariant';
 import PropTypes from 'prop-types';
 import DroppableDimensionPublisher from '../droppable-dimension-publisher';
 import type { Props, Provided, StateSnapshot } from './droppable-types';
@@ -13,6 +12,7 @@ import {
   styleContextKey,
 } from '../context-keys';
 import { warning } from '../../dev-warning';
+import checkOwnProps from './check-own-props';
 
 type Context = {
   [string]: DroppableId | TypeId,
@@ -34,9 +34,9 @@ export default class Droppable extends Component<Props> {
 
     this.styleContext = context[styleContextKey];
 
-    // a little check to avoid an easy to catch setup
+    // a little run time check to avoid an easy to catch setup issues
     if (process.env.NODE_ENV !== 'production') {
-      invariant(props.droppableId, 'A Droppable requires a droppableId prop');
+      checkOwnProps(props);
     }
   }
 

stories/99-debug-story.js

@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import { storiesOf } from '@storybook/react';
-// import { Draggable, Droppable, DragDropContext } from '../../src';
+// import { Draggable, Droppable, DragDropContext } from '../src';
 
 class App extends React.Component<*> {
   render() {

test/unit/view/draggable/throw-if-invalid-own-props.spec.js

@@ -0,0 +1,63 @@
+// @flow
+import type { OwnProps } from '../../../../src/view/draggable/draggable-types';
+import mount from './util/mount';
+import { defaultOwnProps } from './util/get-props';
+
+beforeAll(() => {
+  jest.spyOn(console, 'error').mockImplementation(() => {});
+});
+
+afterAll(() => {
+  console.error.mockReset();
+});
+
+it('should throw if no draggableId is provided', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+  // $ExpectError
+  ownProps.draggableId = undefined;
+  expect(() => mount({ ownProps })).toThrow();
+
+  // $ExpectError
+  ownProps.draggableId = null;
+  expect(() => mount({ ownProps })).toThrow();
+
+  // $ExpectError
+  ownProps.draggableId = 0;
+  expect(() => mount({ ownProps })).toThrow();
+});
+
+it('should throw if no index is provided', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+  // $ExpectError
+  ownProps.index = undefined;
+  expect(() => mount({ ownProps })).toThrow();
+
+  // $ExpectError
+  ownProps.index = null;
+  expect(() => mount({ ownProps })).toThrow();
+});
+
+it('should throw if the index is not an integer', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+  // $ExpectError - string
+  ownProps.index = 'what';
+  expect(() => mount({ ownProps })).toThrow();
+
+  ownProps.index = 1.1;
+  expect(() => mount({ ownProps })).toThrow();
+});
+
+it('should throw if isDragDisabled is set to null', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+  // $ExpectError - null
+  ownProps.isDragDisabled = null;
+  expect(() => mount({ ownProps })).toThrow();
+});

test/unit/view/droppable/throw-if-invalid-own-props.spec.js

@@ -0,0 +1,57 @@
+// @flow
+import type { OwnProps } from '../../../../src/view/droppable/droppable-types';
+import mount from './util/mount';
+import { ownProps as defaultOwnProps } from './util/get-props';
+
+beforeAll(() => {
+  jest.spyOn(console, 'error').mockImplementation(() => {});
+});
+
+afterAll(() => {
+  console.error.mockReset();
+});
+
+it('should throw if no droppableId is provided', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+
+  // $ExpectError
+  ownProps.droppableId = undefined;
+  expect(() => mount({ ownProps })).toThrow();
+
+  // $ExpectError
+  ownProps.droppableId = null;
+  expect(() => mount({ ownProps })).toThrow();
+
+  // $ExpectError
+  ownProps.droppableId = 0;
+  expect(() => mount({ ownProps })).toThrow();
+});
+
+it('should throw if isDropDisabled is set to null', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+  // $ExpectError - null
+  ownProps.isDropDisabled = null;
+  expect(() => mount({ ownProps })).toThrow();
+});
+
+it('should throw if isCombineEnabled is set to null', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+  // $ExpectError - null
+  ownProps.isCombineEnabled = null;
+  expect(() => mount({ ownProps })).toThrow();
+});
+
+it('should throw if ignoreContainerClipping is set to null', () => {
+  const ownProps: OwnProps = {
+    ...defaultOwnProps,
+  };
+  // $ExpectError - null
+  ownProps.ignoreContainerClipping = null;
+  expect(() => mount({ ownProps })).toThrow();
+});