add test cases

package.json

@@ -42,6 +42,7 @@
     "@types/enzyme": "^3.10.5",
     "@types/enzyme-adapter-react-16": "^1.0.6",
     "@types/jest": "^25.1.2",
+    "@types/mocha": "^8.0.3",
     "@types/node": "^12.0.0",
     "@types/react": "^16.9.25",
     "@types/react-dom": "^16.9.5",

packages/grid/data-grid/package.json

@@ -13,6 +13,15 @@
   "publishConfig": {
     "access": "public"
   },
+  "scripts": {
+    "precommit": "npm run lint",
+    "build": "rollup -c ",
+    "start": "rollup -cw",
+    "lint": "eslint 'src/**/*.{ts,tsx}' --quiet --fix -c ../../../.eslintrc.js && npm run lint:css",
+    "lint:css": "stylelint 'src/**/*.{ts,tsx}' ../../../.stylelintrc.js",
+    "test": "../../../node_modules/.bin/jest --config jest.config.js",
+    "typescript": "tsc -p tsconfig.json"
+  },
   "dependencies": {
     "prop-types": "^15.7.2",
     "tslib": "^2.0.0"
@@ -33,14 +42,6 @@
     "react": "^16.8.0",
     "styled-components": "^5.1.0"
   },
-  "scripts": {
-    "precommit": "npm run lint",
-    "build": "rollup -c ",
-    "start": "rollup -cw",
-    "lint": "eslint 'src/**/*.{ts,tsx}' --quiet --fix -c ../../../.eslintrc.js && npm run lint:css",
-    "lint:css": "stylelint 'src/**/*.{ts,tsx}' ../../../.stylelintrc.js",
-    "test": "../../../node_modules/.bin/jest --config jest.config.js"
-  },
   "setupFiles": [
     "<rootDir>/src/setupTests.js"
   ],

packages/grid/data-grid/rollup.config.js

@@ -34,7 +34,7 @@ export default [
         cleaner({
           targets: ['./dist/'],
         }),
-      typescript({ build: true }),
+      typescript({ tsconfig: 'tsconfig.build.json' }),
       !production && sourceMaps(),
       production && terser(),
     ],

packages/grid/data-grid/src/DataGrid.spec.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { DataGrid } from '@material-ui/data-grid';
+
+function EnterpriseTest() {
+  return (
+    <div>
+      <DataGrid rows={[]} columns={[]} />
+      <DataGrid rows={[]} columns={[]} pagination />
+      {/* @ts-expect-error Type 'false' is not assignable to type 'true | undefined' */}
+      <DataGrid pagination={false} />
+    </div>
+  );
+}

packages/grid/data-grid/src/DataGrid.test.tsx

@@ -1,4 +1,7 @@
+/* eslint-disable react/forbid-foreign-prop-types */
 import * as React from 'react';
+import PropTypes from 'prop-types';
+// @ts-ignore
 import { createClientRender } from 'test/utils';
 import { expect } from 'chai';
 import { DataGrid } from '@material-ui/data-grid';
@@ -19,42 +22,64 @@ describe('<DataGrid />', () => {
     ],
   };
 
-  before(function beforeHook() {
-    if (/jsdom/.test(window.navigator.userAgent)) {
-      // Need layouting
-      this.skip();
-    }
-  });
-
-  // Adapation of describeConformance()
-  describe('Material-UI component API', () => {
-    it(`attaches the ref`, () => {
-      const ref = React.createRef();
-      const { container } = render(
-        <div style={{ width: 300, height: 300 }}>
-          <DataGrid {...defaultProps} ref={ref} />
-        </div>,
-      );
-      expect(ref.current).to.be.instanceof(window.HTMLDivElement);
-      expect(ref.current).to.equal(container.firstChild.firstChild.firstChild);
+  describe('layout', () => {
+    before(function beforeHook() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // Need layouting
+        this.skip();
+      }
     });
 
-    function randomStringValue() {
-      return `r${Math.random().toString(36).slice(2)}`;
-    }
+    // Adapation of describeConformance()
+    describe('Material-UI component API', () => {
+      it(`attaches the ref`, () => {
+        const ref = React.createRef<HTMLDivElement>();
+        const { container } = render(
+          <div style={{ width: 300, height: 300 }}>
+            <DataGrid {...defaultProps} ref={ref} />
+          </div>,
+        );
+        expect(ref.current).to.be.instanceof(window.HTMLDivElement);
+        expect(ref.current).to.equal(container.firstChild.firstChild.firstChild);
+      });
+
+      function randomStringValue() {
+        return `r${Math.random().toString(36).slice(2)}`;
+      }
+
+      it('applies the className to the root component', () => {
+        const className = randomStringValue();
 
-    it('applies the className to the root component', () => {
-      const className = randomStringValue();
+        const { container } = render(
+          <div style={{ width: 300, height: 300 }}>
+            <DataGrid {...defaultProps} className={className} />
+          </div>,
+        );
 
-      const { container } = render(
-        <div style={{ width: 300, height: 300 }}>
-          <DataGrid {...defaultProps} className={className} />
-        </div>,
-      );
+        expect(document.querySelector(`.${className}`)).to.equal(
+          container.firstChild.firstChild.firstChild,
+        );
+      });
+    });
+  });
+
+  describe('warnings', () => {
+    before(() => {
+      PropTypes.resetWarningCache();
+    });
 
-      expect(document.querySelector(`.${className}`)).to.equal(
-        container.firstChild.firstChild.firstChild,
-      );
+    it('should raise a warning if trying to use an enterprise feature', () => {
+      expect(() => {
+        PropTypes.checkPropTypes(
+          // @ts-ignore
+          DataGrid.Naked.propTypes,
+          {
+            pagination: false,
+          },
+          'prop',
+          'MockedDataGrid',
+        );
+      }).toErrorDev('Material-UI: `<DataGrid pagination={false} />` is not a valid prop.');
     });
   });
 });

packages/grid/data-grid/src/DataGrid.tsx

@@ -104,3 +104,6 @@ DataGrid2.propTypes = {
 };
 
 export const DataGrid = React.memo(DataGrid2);
+
+// @ts-ignore
+DataGrid.Naked = DataGrid2;

packages/grid/data-grid/tsconfig.build.json

@@ -0,0 +1,22 @@
+{
+  "extends": "../../../tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": "./",
+    "declaration": true,
+    "declarationDir": "./dist",
+    "module": "es6",
+    "noImplicitAny": false,
+    "strict": true,
+    "outDir": "./dist",
+    "target": "es6",
+    "sourceMap": true,
+    "build": true
+  },
+  "include": ["src"],
+  "exclude": ["__tests__", "**/*.test.ts", "node_modules", "lib"],
+  "references": [
+    {
+      "path": "../x-grid-modules"
+    }
+  ]
+}

packages/grid/data-grid/tsconfig.json

@@ -1,22 +1,8 @@
 {
   "extends": "../../../tsconfig.json",
   "compilerOptions": {
-    "baseUrl": "./",
-    "declaration": true,
-    "declarationDir": "./dist",
-    "module": "es6",
-    "noImplicitAny": false,
-    "strict": true,
-    "outDir": "./dist",
-    "target": "es6",
-    "sourceMap": true,
-    "build": true
+    "noEmit": true,
+    "types": ["mocha", "node"]
   },
-  "include": ["src"],
-  "exclude": ["__tests__", "**/*.test.ts", "node_modules", "lib"],
-  "references": [
-    {
-      "path": "../x-grid-modules"
-    }
-  ]
+  "include": ["src"]
 }

packages/grid/x-grid/rollup.config.js

@@ -39,7 +39,7 @@ export default [
         cleaner({
           targets: ['./dist/'],
         }),
-      typescript({ build: true }),
+      typescript(),
       !production && sourceMaps(),
       production && terser(),
     ],

yarn.lock

@@ -4775,6 +4775,11 @@
   resolved "https://registry.yarnpkg.com/@types/minimist/-/minimist-1.2.0.tgz#69a23a3ad29caf0097f06eda59b361ee2f0639f6"
   integrity sha1-aaI6OtKcrwCX8G7aWbNh7i8GOfY=
 
+"@types/mocha@^8.0.3":
+  version "8.0.3"
+  resolved "https://registry.yarnpkg.com/@types/mocha/-/mocha-8.0.3.tgz#51b21b6acb6d1b923bbdc7725c38f9f455166402"
+  integrity sha512-vyxR57nv8NfcU0GZu8EUXZLTbCMupIUwy95LJ6lllN+JRPG25CwMHoB1q5xKh8YKhQnHYRAn4yW2yuHbf/5xgg==
+
 "@types/node-fetch@^2.5.4":
   version "2.5.7"
   resolved "https://registry.yarnpkg.com/@types/node-fetch/-/node-fetch-2.5.7.tgz#20a2afffa882ab04d44ca786449a276f9f6bbf3c"