@instructure/ui-modal 10.19.2-snapshot-2 → 10.19.2-snapshot-4

package/lib/Modal/ModalHeader/__new-tests__/ModalHeader.test.js

@@ -1,100 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _react = require("@testing-library/react");
-require("@testing-library/jest-dom");
-var _uiThemes = _interopRequireDefault(require("@instructure/ui-themes"));
-var _uiColorUtils = require("@instructure/ui-color-utils");
-var _index = require("../index");
-var _theme = _interopRequireDefault(require("../theme"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-var _ModalHeader, _ModalHeader2, _ModalHeader3, _ModalHeader4, _ModalHeader5;
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-const HEADER_TEXT = 'Modal-footer-text';
-describe('<ModalHeader />', () => {
-  it('should render', async () => {
-    const _render = (0, _react.render)(_ModalHeader || (_ModalHeader = (0, _jsxRuntime.jsx)(_index.ModalHeader, {
-        children: HEADER_TEXT
-      }))),
-      findByText = _render.findByText;
-    const modalHeader = await findByText(HEADER_TEXT);
-    expect(modalHeader).toBeInTheDocument();
-  });
-  it('should set inverse styles', async () => {
-    const themeVariables = (0, _theme.default)(_uiThemes.default);
-    const _render2 = (0, _react.render)(_ModalHeader2 || (_ModalHeader2 = (0, _jsxRuntime.jsx)(_index.ModalHeader, {
-        variant: "inverse",
-        children: HEADER_TEXT
-      }))),
-      findByText = _render2.findByText;
-    const modalHeader = await findByText(HEADER_TEXT);
-    const modalHeaderStyle = window.getComputedStyle(modalHeader);
-    const headerBackground = (0, _uiColorUtils.color2hex)(modalHeaderStyle.getPropertyValue('background-color'));
-    const headerBorderColor = (0, _uiColorUtils.color2hex)(modalHeaderStyle.getPropertyValue('border-bottom-color'));
-    expect(modalHeader).toBeInTheDocument();
-    expect(headerBackground).toBe(themeVariables.inverseBackground);
-    expect(headerBorderColor).toBe(themeVariables.inverseBorderColor);
-  });
-  describe('spacing prop', () => {
-    it('should be correct by default', async () => {
-      const themeVariables = (0, _theme.default)(_uiThemes.default);
-      const _render3 = (0, _react.render)(_ModalHeader3 || (_ModalHeader3 = (0, _jsxRuntime.jsx)(_index.ModalHeader, {
-          children: HEADER_TEXT
-        }))),
-        findByText = _render3.findByText;
-      const modalHeader = await findByText(HEADER_TEXT);
-      const modalHeaderStyle = window.getComputedStyle(modalHeader);
-      const headerPadding = modalHeaderStyle.padding;
-      expect(modalHeader).toBeInTheDocument();
-      expect(headerPadding).toBe(themeVariables.padding);
-    });
-    it('should correctly set default spacing', async () => {
-      const themeVariables = (0, _theme.default)(_uiThemes.default);
-      const _render4 = (0, _react.render)(_ModalHeader4 || (_ModalHeader4 = (0, _jsxRuntime.jsx)(_index.ModalHeader, {
-          spacing: "default",
-          children: HEADER_TEXT
-        }))),
-        findByText = _render4.findByText;
-      const modalHeader = await findByText(HEADER_TEXT);
-      const modalHeaderStyle = window.getComputedStyle(modalHeader);
-      const headerPadding = modalHeaderStyle.padding;
-      expect(modalHeader).toBeInTheDocument();
-      expect(headerPadding).toBe(themeVariables.padding);
-    });
-    it('should correctly set compact spacing', async () => {
-      const themeVariables = (0, _theme.default)(_uiThemes.default);
-      const _render5 = (0, _react.render)(_ModalHeader5 || (_ModalHeader5 = (0, _jsxRuntime.jsx)(_index.ModalHeader, {
-          spacing: "compact",
-          children: HEADER_TEXT
-        }))),
-        findByText = _render5.findByText;
-      const modalHeader = await findByText(HEADER_TEXT);
-      const modalHeaderStyle = window.getComputedStyle(modalHeader);
-      const headerPadding = modalHeaderStyle.padding;
-      expect(modalHeader).toBeInTheDocument();
-      expect(headerPadding).toBe(themeVariables.paddingCompact);
-    });
-  });
-});

package/lib/Modal/__new-tests__/Modal.test.js

@@ -1,476 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = require("react");
-var _react2 = require("@testing-library/react");
-var _vitest = require("vitest");
-var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
-require("@testing-library/jest-dom");
-var _index = require("../index");
-var _View2 = require("@instructure/ui-view/lib/View");
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-const _excluded = ["label"];
-var _Modal, _Modal2, _Modal$Body, _Modal3, _Modal4, _View, _Modal5, _Modal$Body2, _Modal$Body3, _Modal$Body4, _Modal$Body5, _Modal$Body6, _Modal$Body7, _Modal6, _Modal7, _input, _Modal$Header, _Modal$Body8, _Modal$Footer;
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-describe('<Modal />', () => {
-  let consoleWarningMock;
-  let consoleErrorMock;
-  const originalScroll = window.scroll;
-  beforeEach(() => {
-    // Mocking console to prevent test output pollution and expect for messages
-    consoleWarningMock = _vitest.vi.spyOn(console, 'warn').mockImplementation(() => {});
-    consoleErrorMock = _vitest.vi.spyOn(console, 'error').mockImplementation(() => {});
-  });
-  afterEach(() => {
-    consoleWarningMock.mockRestore();
-    consoleErrorMock.mockRestore();
-  });
-  beforeAll(() => {
-    // Mocking window.scroll to prevent test output pollution
-    Object.defineProperty(window, 'scroll', {
-      value: _vitest.vi.fn(),
-      writable: true
-    });
-  });
-  afterAll(() => {
-    window.scroll = originalScroll;
-  });
-  it('should render nothing and have a node with no parent when closed', () => {
-    const _render = (0, _react2.render)(_Modal || (_Modal = (0, _jsxRuntime.jsx)(_index.Modal, {
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Foo Bar Baz"
-        })
-      }))),
-      container = _render.container;
-    expect(container.firstChild).not.toBeInTheDocument();
-  });
-  it('should apply theme overrides when open', async () => {
-    const testFont = 'test-font';
-    const bodyText = 'Modal-body-text';
-    const _render2 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        size: "small",
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        themeOverride: {
-          fontFamily: testFont
-        },
-        children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: bodyText
-        })
-      })),
-      findByText = _render2.findByText,
-      findByRole = _render2.findByRole;
-    const modalBody = await findByText(bodyText);
-    const dialog = await findByRole('dialog');
-    const dialogStyle = window.getComputedStyle(dialog);
-    expect(modalBody).toBeInTheDocument();
-    expect(dialogStyle.fontFamily).toBe(testFont);
-  });
-  it('should render its own positioning context if constrained to parent', async () => {
-    const _render3 = (0, _react2.render)(_Modal2 || (_Modal2 = (0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        constrain: "parent",
-        children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Foo Bar Baz"
-        })
-      }))),
-      findByRole = _render3.findByRole;
-    const dialog = await findByRole('dialog');
-    const constrain = document.querySelector("[class*='constrainContext']");
-    expect(dialog).toBeInTheDocument();
-    expect(constrain).toBeInTheDocument();
-  });
-  it("should not inherit its parent's font color", async () => {
-    const _render4 = (0, _react2.render)((0, _jsxRuntime.jsx)("div", {
-        style: {
-          color: 'rgb(255, 255, 255)'
-        },
-        children: (0, _jsxRuntime.jsx)(_index.Modal, {
-          open: true,
-          label: "Modal Dialog",
-          shouldReturnFocus: false,
-          constrain: "parent",
-          themeOverride: {
-            textColor: 'rgb(0, 0, 0)'
-          },
-          children: _Modal$Body || (_Modal$Body = (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-            children: "Foo Bar Baz"
-          }))
-        })
-      })),
-      findByRole = _render4.findByRole;
-    const dialog = await findByRole('dialog');
-    const dialogStyle = window.getComputedStyle(dialog);
-    expect(dialog).toBeInTheDocument();
-    expect(dialogStyle.color).toBe('rgb(0, 0, 0)');
-  });
-  it('should pass `as` prop to the dialog', async () => {
-    const _render5 = (0, _react2.render)(_Modal3 || (_Modal3 = (0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Foo Bar Baz"
-        })
-      }))),
-      findByRole = _render5.findByRole,
-      rerender = _render5.rerender;
-    const dialog = await findByRole('dialog');
-    expect(dialog).toBeInTheDocument();
-    expect(dialog.tagName).toBe('SPAN');
-    rerender(_Modal4 || (_Modal4 = (0, _jsxRuntime.jsx)(_index.Modal, {
-      as: "form",
-      open: true,
-      label: "Modal Dialog",
-      shouldReturnFocus: false,
-      children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-        children: "Foo Bar Baz"
-      })
-    })));
-    const dialogForm = await findByRole('dialog');
-    expect(dialogForm.tagName).toBe('FORM');
-  });
-  it('should handle null children', async () => {
-    const bodyText = 'Modal-body-text';
-    const _render6 = (0, _react2.render)((0, _jsxRuntime.jsxs)(_index.Modal, {
-        open: true,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: [null, (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: bodyText
-        }), null]
-      })),
-      findByText = _render6.findByText;
-    const modalBody = await findByText(bodyText);
-    expect(modalBody).toBeInTheDocument();
-  });
-  it('should handle custom children', async () => {
-    const bodyText = 'Modal-body-text';
-    const _render7 = (0, _react2.render)((0, _jsxRuntime.jsxs)(_index.Modal, {
-        open: true,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: [_View || (_View = (0, _jsxRuntime.jsx)(_View2.View, {
-          children: "This is a custom child"
-        })), (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: bodyText
-        })]
-      })),
-      findByText = _render7.findByText;
-    const modalBody = await findByText(bodyText);
-    const customChild = await findByText('This is a custom child');
-    expect(modalBody).toBeInTheDocument();
-    expect(customChild).toBeInTheDocument();
-  });
-  it('should apply the aria attributes', async () => {
-    const _render8 = (0, _react2.render)(_Modal5 || (_Modal5 = (0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Foo Bar Baz"
-        })
-      }))),
-      findByRole = _render8.findByRole;
-    const dialog = await findByRole('dialog');
-    expect(dialog).toBeInTheDocument();
-    expect(dialog).toHaveAttribute('aria-label', 'Modal Dialog');
-  });
-  it('should use transition', async () => {
-    const onEnter = _vitest.vi.fn();
-    const onEntering = _vitest.vi.fn();
-    const onEntered = _vitest.vi.fn();
-    const _render9 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        onEnter: onEnter,
-        onEntering: onEntering,
-        onEntered: onEntered,
-        transition: "fade",
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: _Modal$Body2 || (_Modal$Body2 = (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Foo Bar Baz"
-        }))
-      })),
-      findByRole = _render9.findByRole;
-    const dialog = await findByRole('dialog');
-    expect(dialog).toBeInTheDocument();
-    await (0, _react2.waitFor)(() => {
-      expect(onEnter).toHaveBeenCalled();
-      expect(onEntering).toHaveBeenCalled();
-      expect(onEntered).toHaveBeenCalled();
-    });
-  });
-  it('should support onOpen prop', async () => {
-    const onOpen = _vitest.vi.fn();
-    const _render10 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        onOpen: onOpen,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: _Modal$Body3 || (_Modal$Body3 = (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Foo Bar Baz"
-        }))
-      })),
-      findByRole = _render10.findByRole;
-    const dialog = await findByRole('dialog');
-    expect(dialog).toBeInTheDocument();
-    await (0, _react2.waitFor)(() => {
-      expect(onOpen).toHaveBeenCalled();
-    });
-  });
-  it('should support onClose prop', async () => {
-    const onClose = _vitest.vi.fn();
-    const _render11 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        onClose: onClose,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: _Modal$Body4 || (_Modal$Body4 = (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Foo Bar Baz"
-        }))
-      })),
-      findByRole = _render11.findByRole,
-      rerender = _render11.rerender;
-    const dialog = await findByRole('dialog');
-    expect(dialog).toBeInTheDocument();
-    rerender((0, _jsxRuntime.jsx)(_index.Modal, {
-      open: false,
-      onClose: onClose,
-      label: "Modal Dialog",
-      shouldReturnFocus: false,
-      children: _Modal$Body5 || (_Modal$Body5 = (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-        children: "Foo Bar Baz"
-      }))
-    }));
-    await (0, _react2.waitFor)(() => {
-      expect(onClose).toHaveBeenCalled();
-    });
-  });
-  it('should dismiss when overlay clicked by default', async () => {
-    const onDismiss = _vitest.vi.fn();
-    const _render12 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        onDismiss: onDismiss,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: _Modal$Body6 || (_Modal$Body6 = (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: "Modal Text"
-        }))
-      })),
-      findByText = _render12.findByText;
-    const modalBody = await findByText('Modal Text');
-    expect(modalBody).toBeInTheDocument();
-    await (0, _react2.waitFor)(() => {
-      _userEvent.default.click(document.body);
-      expect(onDismiss).toHaveBeenCalled();
-    });
-  });
-  it('should NOT dismiss when overlay clicked with shouldCloseOnDocumentClick=false', async () => {
-    const onDismiss = _vitest.vi.fn();
-    const onClickOuter = _vitest.vi.fn();
-    const _render13 = (0, _react2.render)((0, _jsxRuntime.jsxs)("div", {
-        children: [(0, _jsxRuntime.jsx)("button", {
-          "data-testid": "outer-element",
-          onClick: onClickOuter,
-          children: "for dismiss"
-        }), (0, _jsxRuntime.jsx)(_index.Modal, {
-          open: true,
-          onDismiss: onDismiss,
-          label: "Modal Dialog",
-          shouldReturnFocus: false,
-          shouldCloseOnDocumentClick: false,
-          children: _Modal$Body7 || (_Modal$Body7 = (0, _jsxRuntime.jsxs)(_index.Modal.Body, {
-            children: ["Foo Bar Baz ", (0, _jsxRuntime.jsx)("button", {
-              children: "click me"
-            })]
-          }))
-        })]
-      })),
-      findByRole = _render13.findByRole,
-      getByTestId = _render13.getByTestId;
-    const dialog = await findByRole('dialog');
-    expect(dialog).toBeInTheDocument();
-    _userEvent.default.click(getByTestId('outer-element'));
-    await (0, _react2.waitFor)(() => {
-      expect(onClickOuter).toHaveBeenCalled();
-      expect(onDismiss).not.toHaveBeenCalled();
-      expect(dialog).toBeInTheDocument();
-    });
-  });
-  it('should render children', async () => {
-    const _render14 = (0, _react2.render)(_Modal6 || (_Modal6 = (0, _jsxRuntime.jsx)(_index.Modal, {
-        open: true,
-        label: "Modal Dialog",
-        shouldReturnFocus: false,
-        children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-          children: (0, _jsxRuntime.jsx)("button", {
-            children: "Cancel"
-          })
-        })
-      }))),
-      findByText = _render14.findByText;
-    const cancelButton = await findByText('Cancel');
-    expect(cancelButton).toBeInTheDocument();
-  });
-  describe('children validation', () => {
-    it('should pass validation when children are valid', async () => {
-      const _render15 = (0, _react2.render)(_Modal7 || (_Modal7 = (0, _jsxRuntime.jsxs)(_index.Modal, {
-          open: true,
-          label: "Modal Dialog",
-          shouldReturnFocus: false,
-          children: [(0, _jsxRuntime.jsx)(_index.Modal.Header, {
-            children: "Hello World"
-          }), (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-            children: "Foo Bar Baz"
-          }), (0, _jsxRuntime.jsx)(_index.Modal.Footer, {
-            children: (0, _jsxRuntime.jsx)("button", {
-              children: "Cancel"
-            })
-          })]
-        }))),
-        findByRole = _render15.findByRole;
-      const dialog = await findByRole('dialog');
-      expect(dialog).toBeInTheDocument();
-      expect(consoleErrorMock).not.toHaveBeenCalled();
-    });
-    it('should pass inverse variant to children when set', async () => {
-      let headerRef = null;
-      let bodyRef = null;
-      let footerRef = null;
-      const _render16 = (0, _react2.render)((0, _jsxRuntime.jsxs)(_index.Modal, {
-          open: true,
-          label: "Dark Modal",
-          shouldReturnFocus: false,
-          variant: "inverse",
-          children: [(0, _jsxRuntime.jsx)(_index.Modal.Header, {
-            ref: el => headerRef = el,
-            children: "header"
-          }), (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-            ref: el => bodyRef = el,
-            children: "body"
-          }), (0, _jsxRuntime.jsx)(_index.Modal.Footer, {
-            ref: el => footerRef = el,
-            children: "footer"
-          })]
-        })),
-        findByRole = _render16.findByRole;
-      const dialog = await findByRole('dialog');
-      expect(dialog).toBeInTheDocument();
-      expect(headerRef.props.variant).toBe('inverse');
-      expect(bodyRef.props.variant).toBe('inverse');
-      expect(footerRef.props.variant).toBe('inverse');
-    });
-    it('should pass overflow to Modal.Body', async () => {
-      let bodyRef = null;
-      const _render17 = (0, _react2.render)((0, _jsxRuntime.jsx)(_index.Modal, {
-          open: true,
-          label: "Modal",
-          shouldReturnFocus: false,
-          overflow: "fit",
-          children: (0, _jsxRuntime.jsx)(_index.Modal.Body, {
-            ref: el => bodyRef = el,
-            children: "body"
-          })
-        })),
-        findByRole = _render17.findByRole;
-      const dialog = await findByRole('dialog');
-      expect(dialog).toBeInTheDocument();
-      expect(bodyRef.props.overflow).toBe('fit');
-    });
-  });
-  describe('managed focus', () => {
-    var _ModalExample2;
-    class ModalExample extends _react.Component {
-      render() {
-        const _this$props = this.props,
-          label = _this$props.label,
-          props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
-        return (0, _jsxRuntime.jsxs)("div", {
-          children: [_input || (_input = (0, _jsxRuntime.jsx)("input", {
-            type: "text"
-          })), (0, _jsxRuntime.jsxs)(_index.Modal, {
-            label: label,
-            ...props,
-            children: [_Modal$Header || (_Modal$Header = (0, _jsxRuntime.jsx)(_index.Modal.Header, {
-              children: (0, _jsxRuntime.jsx)("button", {
-                children: "Close"
-              })
-            })), _Modal$Body8 || (_Modal$Body8 = (0, _jsxRuntime.jsxs)(_index.Modal.Body, {
-              children: [(0, _jsxRuntime.jsx)("input", {
-                type: "text",
-                id: "input-one",
-                "data-testid": "input-first"
-              }), (0, _jsxRuntime.jsx)("input", {
-                type: "text",
-                id: "input-two",
-                "data-testid": "input-second"
-              })]
-            })), _Modal$Footer || (_Modal$Footer = (0, _jsxRuntime.jsx)(_index.Modal.Footer, {
-              children: (0, _jsxRuntime.jsx)("button", {
-                children: "Cancel"
-              })
-            }))]
-          })]
-        });
-      }
-    }
-    ModalExample.displayName = "ModalExample";
-    ModalExample.propTypes = {
-      // eslint-disable-next-line react/forbid-foreign-prop-types
-      ..._index.Modal.propTypes
-    };
-    it('should focus closeButton by default', async () => {
-      const _render18 = (0, _react2.render)(_ModalExample2 || (_ModalExample2 = (0, _jsxRuntime.jsx)(ModalExample, {
-          open: true,
-          label: "A Modal"
-        }))),
-        findByText = _render18.findByText;
-      const closeButton = await findByText('Close');
-      expect(closeButton).toBeInTheDocument();
-      await (0, _react2.waitFor)(() => {
-        expect(document.activeElement).toBe(closeButton);
-      });
-    });
-    it('should take a prop for finding default focus', async () => {
-      const _render19 = (0, _react2.render)((0, _jsxRuntime.jsx)(ModalExample, {
-          open: true,
-          label: "A Modal",
-          defaultFocusElement: () => document.getElementById('input-one')
-        })),
-        findByTestId = _render19.findByTestId;
-      const input = await findByTestId('input-first');
-      await (0, _react2.waitFor)(() => {
-        expect(input).toHaveFocus();
-      });
-    });
-  });
-});

package/src/Modal/ModalBody/__new-tests__/ModalBody.test.tsx

@@ -1,116 +0,0 @@
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2015 - present Instructure, Inc.
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to deal
- * in the Software without restriction, including without limitation the rights
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- * copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in all
- * copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- */
-
-import { render } from '@testing-library/react'
-import { vi } from 'vitest'
-import '@testing-library/jest-dom'
-
-import { color2hex } from '@instructure/ui-color-utils'
-import canvas from '@instructure/ui-themes'
-import { View } from '@instructure/ui-view'
-import type { ViewOwnProps } from '@instructure/ui-view'
-
-import { ModalBody } from '../index'
-import generateComponentTheme from '../theme'
-
-const BODY_TEXT = 'Modal-body-text'
-
-describe('<ModalBody />', () => {
-  it('should render', async () => {
-    const { findByText } = render(<ModalBody>{BODY_TEXT}</ModalBody>)
-    const modalBody = await findByText(BODY_TEXT)
-
-    expect(modalBody).toBeInTheDocument()
-  })
-
-  it('should set inverse styles', async () => {
-    const themeVariables = generateComponentTheme(canvas)
-    const { findByText } = render(
-      <ModalBody variant="inverse">{BODY_TEXT}</ModalBody>
-    )
-    const modalBody = await findByText(BODY_TEXT)
-    const modalBodyStyle = window.getComputedStyle(modalBody)
-    const bodyBackground = color2hex(
-      modalBodyStyle.getPropertyValue('background-color')
-    )
-
-    expect(modalBody).toBeInTheDocument()
-    expect(bodyBackground).toBe(themeVariables.inverseBackground)
-  })
-
-  it('should set the same width and height as the parent when overflow is set to fit', async () => {
-    const { findByText } = render(
-      <div style={{ width: '500px', height: '600px' }}>
-        <ModalBody overflow="fit">{BODY_TEXT}</ModalBody>
-      </div>
-    )
-    const modalBody = await findByText(BODY_TEXT)
-    const modalBodyStyle = window.getComputedStyle(modalBody)
-
-    expect(modalBodyStyle.width).toBe('100%')
-    expect(modalBodyStyle.height).toBe('100%')
-  })
-
-  describe('when passing down props to View', () => {
-    const allowedProps: Partial<ViewOwnProps> = {
-      padding: 'small',
-      elementRef: () => {},
-      as: 'section'
-    }
-
-    const allProps = View.allowedProps.filter((prop) => prop !== 'children')
-
-    allProps.forEach((prop) => {
-      if (prop in allowedProps) {
-        it(`should allow the '${prop}' prop`, () => {
-          const consoleErrorSpy = vi
-            .spyOn(console, 'error')
-            .mockImplementation(() => {})
-          const props = { [prop]: allowedProps[prop] }
-          render(<ModalBody {...props} />)
-
-          expect(consoleErrorSpy).not.toHaveBeenCalled()
-
-          consoleErrorSpy.mockRestore()
-        })
-      } else {
-        it(`should NOT allow the '${prop}' prop`, () => {
-          const expectedErrorMessage = `prop '${prop}' is not allowed.`
-          const consoleErrorSpy = vi
-            .spyOn(console, 'error')
-            .mockImplementation(() => {})
-
-          const props = { [prop]: 'NOT_ALLOWED_VALUE' }
-          render(<ModalBody {...props} />)
-
-          expect(consoleErrorSpy).toHaveBeenCalledWith(
-            expect.stringContaining(expectedErrorMessage),
-            expect.any(String)
-          )
-          consoleErrorSpy.mockRestore()
-        })
-      }
-    })
-  })
-})