[DataGrid] Fix Alt+c being ignored on some systems (#3660)

docs/src/pages/components/data-grid/accessibility/accessibility.md

@@ -90,7 +90,10 @@ Use the arrow keys to move the focus.
 ### Key assignment conventions
 
 The above key assignments are for Windows and Linux.
-On macOS, replace <kbd class="key">CTRL</kbd> with <kbd class="key">⌘ Command</kbd>.
+On macOS:
+
+- replace <kbd class="key">CTRL</kbd> with <kbd class="key">⌘ Command</kbd>
+- replace <kbd class="key">ALT</kbd> with <kbd class="key">⌥ Option</kbd>
 
 ## API
 

packages/grid/_modules_/grid/hooks/features/clipboard/useGridClipboard.ts

@@ -55,7 +55,10 @@ export const useGridClipboard = (apiRef: GridApiRef): void => {
   const handleKeydown = React.useCallback(
     (event: KeyboardEvent) => {
       const isModifierKeyPressed = event.ctrlKey || event.metaKey || event.altKey;
-      if (event.key.toLowerCase() !== 'c' || !isModifierKeyPressed) {
+      // event.key === 'c' is not enough as alt+c can lead to ©, ç, or other characters on macOS.
+      // event.code === 'KeyC' is not enough as event.code assume a QWERTY keyboard layout which would
+      // be wrong with a Dvorak keyboard (as if pressing J).
+      if (String.fromCharCode(event.keyCode) !== 'C' || !isModifierKeyPressed) {
         return;
       }
 

packages/grid/x-data-grid-pro/src/tests/clipboard.DataGridPro.test.tsx

@@ -49,13 +49,6 @@ describe('<DataGridPro /> - Clipboard', () => {
   describe('copySelectedRowsToClipboard', () => {
     let writeText;
 
-    before(function beforeHook() {
-      if (!isJSDOM) {
-        // Needs permission to read the clipboard
-        this.skip();
-      }
-    });
-
     beforeEach(function beforeEachHook() {
       writeText = stub().resolves();
 
@@ -92,9 +85,20 @@ describe('<DataGridPro /> - Clipboard', () => {
         const cell = getCell(0, 0);
         fireEvent.mouseUp(cell);
         fireEvent.click(cell);
-        fireEvent.keyDown(cell, { key: 'c', [key]: true });
+        fireEvent.keyDown(cell, { key: 'c', keyCode: 67, [key]: true });
         expect(writeText.firstCall.args[0]).to.equal(['0\tNike', '1\tAdidas'].join('\r\n'));
       });
     });
+
+    it(`should copy the selected rows and headers to the clipboard when Alt + C is pressed`, () => {
+      render(<Test />);
+      apiRef.current.selectRows([0, 1]);
+      const cell = getCell(0, 0);
+      fireEvent.mouseUp(cell);
+      fireEvent.click(cell);
+      fireEvent.keyDown(cell, { key: 'c', keyCode: 67, altKey: true });
+      expect(writeText.callCount).to.equal(1, "writeText wasn't called");
+      expect(writeText.firstCall.args[0]).to.equal(['id\tBrand', '0\tNike'].join('\r\n'));
+    });
   });
 });