Repository: mui/material-ui
File: packages/mui-material/src/Modal/Modal.test.js (JavaScript)

Code before:

    it('should call onClose when Esc is pressed and stop event propagation', () => {
      const handleKeyDown = spy();
      const onCloseSpy = spy();

      render(
        <div onKeyDown={handleKeyDown}>
          <Modal open onClose={onCloseSpy}>
            <div data-testid="modal" tabIndex={-1} />
          </Modal>
        </div>,
      );

      act(() => {
        screen.getByTestId('modal').focus();
      });

      fireEvent.keyDown(screen.getByTestId('modal'), {
        key: 'Escape',
      });

      expect(onCloseSpy).to.have.property('callCount', 1);
      expect(handleKeyDown).to.have.property('callCount', 0);
    });

    it('should let the user disable backdrop click triggering onClose', () => {
      function ModalWithDisabledEscapeKeyDown(props) {
        const { onClose, ...other } = props;
        function handleClose(event, reason) {
          if (reason !== 'escapeKeyDown') {
            onClose(event, reason);
          }
        }

        return <Modal onClose={handleClose} {...other} />;
      }
      const onClose = spy();

      render(
        <ModalWithDisabledEscapeKeyDown onClose={onClose} open>
          <div data-testid="modal" />
        </ModalWithDisabledEscapeKeyDown>,
      );

      fireEvent.focus(screen.getByTestId('modal'));
      fireEvent.keyDown(screen.getByTestId('modal'), {
        key: 'Escape',
      });

      expect(onClose).to.have.property('callCount', 0);
    });

Review comment (security):
The test name says "should let the user disable backdrop click triggering onClose" but it's actually testing disabling escape key down behavior. The test name should be updated to reflect that it's testing escape key down, not backdrop click. For example: "should let the user disable escape key down triggering onClose".
```suggestion
    it('should let the user disable escape key down triggering onClose', () => {
```

Code after:

    it('should call onClose when Esc is pressed and stop event propagation', () => {
      const handleKeyDown = spy();
      const onCloseSpy = spy();

      render(
        <div onKeyDown={handleKeyDown}>
          <Modal open onClose={onCloseSpy}>
            <div data-testid="modal" tabIndex={-1} />
          </Modal>
        </div>,
      );

      act(() => {
        screen.getByTestId('modal').focus();
      });

      fireEvent.keyDown(screen.getByTestId('modal'), {
        key: 'Escape',
      });

      expect(onCloseSpy).to.have.property('callCount', 1);
      expect(handleKeyDown).to.have.property('callCount', 0);
    });

    it('should let the user disable escape key down triggering onClose', () => {
      function ModalWithDisabledEscapeKeyDown(props) {
        const { onClose, ...other } = props;
        function handleClose(event, reason) {
          if (reason !== 'escapeKeyDown') {
            onClose(event, reason);
          }
        }

        return <Modal onClose={handleClose} {...other} />;
      }
      const onClose = spy();

      render(
        <ModalWithDisabledEscapeKeyDown onClose={onClose} open>
          <div data-testid="modal" />
        </ModalWithDisabledEscapeKeyDown>,
      );

      fireEvent.focus(screen.getByTestId('modal'));
      fireEvent.keyDown(screen.getByTestId('modal'), {
        key: 'Escape',
      });

      expect(onClose).to.have.property('callCount', 0);
    });