add test case

mui · Feb 12, 2021 · f18cbb9 · f18cbb9
1 parent 7efabaa
commit f18cbb9
Show file tree

Hide file tree

Showing 9 changed files with 54 additions and 21 deletions.
diff --git a/benchmark/browser/scenarios/table-cell/index.js b/benchmark/browser/scenarios/table-cell/index.js
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import Table from '@material-ui/core/Table';
+import TableBody from '@material-ui/core/TableBody';
+import TableCell from '@material-ui/core/TableCell';
+import TableHead from '@material-ui/core/TableHead';
+import TableRow from '@material-ui/core/TableRow';
+
+const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 };
+const rows = Array.from(new Array(100)).map(() => data);
+
+export default function TableCellCase() {
+  return (
+    <Table>
+      <TableHead>
+        <TableRow>
+          <TableCell>Dessert (100g serving)</TableCell>
+          <TableCell>Calories</TableCell>
+          <TableCell>Fat&nbsp;(g)</TableCell>
+          <TableCell>Carbs&nbsp;(g)</TableCell>
+          <TableCell>Protein&nbsp;(g)</TableCell>
+        </TableRow>
+      </TableHead>
+      <TableBody>
+        {rows.map((row, index) => (
+          <TableRow key={index}>
+            <TableCell component="th" scope="row">
+              {row.name}
+            </TableCell>
+            <TableCell>{row.calories}</TableCell>
+            <TableCell>{row.fat}</TableCell>
+            <TableCell>{row.carbs}</TableCell>
+            <TableCell>{row.protein}</TableCell>
+          </TableRow>
+        ))}
+      </TableBody>
+    </Table>
+  );
+}
diff --git a/benchmark/browser/scripts/benchmark.js b/benchmark/browser/scripts/benchmark.js
@@ -154,6 +154,11 @@ async function run() {
         name: 'noop (baseline)',
         path: './noop/index.js',
       },
+      // Test that there no significant offset
+      {
+        name: 'Table',
+        path: './table-cell/index.js',
+      },
       // Test the cost of React primitives
       {
         name: 'React primitives',

diff --git a/docs/pages/performance/table-component.js b/docs/pages/performance/table-component.js
@@ -25,7 +25,7 @@ const TableBody = createComponent('tbody');
 const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 };
 const rows = Array.from(new Array(100)).map(() => data);
 
-function TableComponent() {
+export default function TableComponent() {
   return (
     <NoSsr defer>
       <Table>
@@ -55,5 +55,3 @@ function TableComponent() {
     </NoSsr>
   );
 }
-
-export default TableComponent;
diff --git a/docs/pages/performance/table-emotion.js b/docs/pages/performance/table-emotion.js
@@ -31,7 +31,7 @@ const TableBody = createComponent('tbody');
 const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 };
 const rows = Array.from(new Array(100)).map(() => data);
 
-function TableEmotion() {
+export default function TableEmotion() {
   return (
     <NoSsr defer>
       <Table>
@@ -61,5 +61,3 @@ function TableEmotion() {
     </NoSsr>
   );
 }
-
-export default TableEmotion;
diff --git a/docs/pages/performance/table-hook.js b/docs/pages/performance/table-hook.js
@@ -33,7 +33,7 @@ const TableBody = createComponent('tbody');
 const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 };
 const rows = Array.from(new Array(100)).map(() => data);
 
-function TableHook() {
+export default function TableHook() {
   return (
     <NoSsr defer>
       <Table>
@@ -63,5 +63,3 @@ function TableHook() {
     </NoSsr>
   );
 }
-
-export default TableHook;
diff --git a/docs/pages/performance/table-mui.js b/docs/pages/performance/table-mui.js
@@ -9,7 +9,7 @@ import TableRow from '@material-ui/core/TableRow';
 const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 };
 const rows = Array.from(new Array(100)).map(() => data);
 
-function TableMui() {
+export default function TableMui() {
   return (
     <NoSsr defer>
       <Table>
@@ -39,5 +39,3 @@ function TableMui() {
     </NoSsr>
   );
 }
-
-export default TableMui;
diff --git a/docs/pages/performance/table-raw.js b/docs/pages/performance/table-raw.js
@@ -4,7 +4,7 @@ import NoSsr from '@material-ui/core/NoSsr';
 const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 };
 const rows = Array.from(new Array(100)).map(() => data);
 
-function TableRaw() {
+export default function TableRaw() {
   return (
     <NoSsr defer>
       <table>
@@ -32,5 +32,3 @@ function TableRaw() {
     </NoSsr>
   );
 }
-
-export default TableRaw;
diff --git a/docs/pages/performance/table-styled-components.js b/docs/pages/performance/table-styled-components.js
@@ -28,7 +28,7 @@ const TableBody = createComponent('tbody');
 const data = { name: 'Frozen yoghurt', calories: 159, fat: 6.0, carbs: 24, protein: 4.0 };
 const rows = Array.from(new Array(100)).map(() => data);
 
-function TableStyledComponents() {
+export default function TableStyledComponents() {
   return (
     <NoSsr defer>
       <Table>
@@ -58,5 +58,3 @@ function TableStyledComponents() {
     </NoSsr>
   );
 }
-
-export default TableStyledComponents;
diff --git a/packages/material-ui-styles/src/getThemeProps/getThemeProps.js b/packages/material-ui-styles/src/getThemeProps/getThemeProps.js
@@ -11,16 +11,18 @@ export default function getThemeProps(params) {
     return props;
   }
 
+  const output = { ...props };
+
   // Resolve default props, code borrow from React source.
   // https://github.com/facebook/react/blob/15a8f031838a553e41c0b66eb1bcf1da8448104d/packages/react/src/ReactElement.js#L221
   const defaultProps = theme.components[name].defaultProps;
   let propName;
 
   for (propName in defaultProps) {
-    if (props[propName] === undefined) {
-      props[propName] = defaultProps[propName];
+    if (output[propName] === undefined) {
+      output[propName] = defaultProps[propName];
     }
   }
 
-  return props;
+  return output;
 }