@instructure/ui-editable 10.19.2-snapshot-3 → 10.19.2-snapshot-5

package/es/Editable/__new-tests__/Editable.test.js

@@ -1,221 +0,0 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["isVisible", "buttonRef"];
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2018 - 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 { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { vi } from 'vitest';
-import userEvent from '@testing-library/user-event';
-import '@testing-library/jest-dom';
-import { Editable } from '../index';
-import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-const TEXT_VIEW = 'text-view';
-const TEXT_EDIT = 'text-edit';
-const childRender = vi.fn(({
-  mode,
-  getContainerProps,
-  getViewerProps,
-  getEditorProps,
-  getEditButtonProps
-}) => {
-  const _getEditButtonProps = getEditButtonProps(),
-    isVisible = _getEditButtonProps.isVisible,
-    buttonRef = _getEditButtonProps.buttonRef,
-    buttonProps = _objectWithoutProperties(_getEditButtonProps, _excluded);
-  const _getEditorProps = getEditorProps(),
-    onBlur = _getEditorProps.onBlur,
-    editorRef = _getEditorProps.editorRef;
-  return _jsxs("div", {
-    "data-testid": "child-container",
-    ...getContainerProps(),
-    children: [mode === 'view' && _jsx("div", {
-      ...getViewerProps(),
-      children: TEXT_VIEW
-    }), mode === 'edit' && _jsx("input", {
-      ref: editorRef,
-      onBlur: onBlur,
-      defaultValue: "textvalue",
-      "data-testid": "edit-mode-input"
-    }), _jsx("button", {
-      ...buttonProps,
-      className: isVisible ? 'test-visible' : 'test-hidden',
-      children: TEXT_EDIT
-    })]
-  });
-});
-describe('<Editable />', () => {
-  let consoleWarningMock;
-  let consoleErrorMock;
-  beforeEach(() => {
-    // Mocking console to prevent test output pollution and expect for messages
-    consoleWarningMock = vi.spyOn(console, 'warn').mockImplementation(() => {});
-    consoleErrorMock = vi.spyOn(console, 'error').mockImplementation(() => {});
-  });
-  afterEach(() => {
-    consoleWarningMock.mockRestore();
-    consoleErrorMock.mockRestore();
-    childRender.mockClear();
-  });
-  it('should render view mode', async () => {
-    render(_jsx(Editable, {
-      mode: "view",
-      onChangeMode: vi.fn(),
-      render: childRender
-    }));
-    const currentMode = childRender.mock.calls[0][0].mode;
-    const viewModeText = screen.getByText(TEXT_VIEW);
-    const editButton = screen.getByRole('button', {
-      name: TEXT_EDIT
-    });
-    expect(childRender).toHaveBeenCalled();
-    expect(currentMode).toBe('view');
-    expect(viewModeText).toBeInTheDocument();
-    expect(editButton).toBeInTheDocument();
-  });
-  it('should render edit mode', async () => {
-    render(_jsx(Editable, {
-      mode: "edit",
-      onChangeMode: vi.fn(),
-      render: childRender
-    }));
-    const currentMode = childRender.mock.calls[0][0].mode;
-    const inputForEdit = screen.getByTestId('edit-mode-input');
-    const editButton = screen.getByRole('button', {
-      name: TEXT_EDIT
-    });
-    expect(childRender).toHaveBeenCalled();
-    expect(currentMode).toBe('edit');
-    expect(inputForEdit).toBeInTheDocument();
-    expect(editButton).toBeInTheDocument();
-  });
-  it('should change to edit mode on button click', () => {
-    const onChangeModeSpy = vi.fn();
-    render(_jsx(Editable, {
-      mode: "view",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const viewModeText = screen.getByText(TEXT_VIEW);
-    const editButton = screen.getByRole('button');
-    expect(viewModeText).toBeInTheDocument();
-    fireEvent.click(editButton);
-    expect(onChangeModeSpy).toHaveBeenCalledWith('edit');
-  });
-  it('should change to edit mode on component click', async () => {
-    const onChangeModeSpy = vi.fn();
-    render(_jsx(Editable, {
-      mode: "view",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const childContainer = screen.getByTestId('child-container');
-    userEvent.click(childContainer);
-    await waitFor(() => expect(onChangeModeSpy).toHaveBeenCalledWith('edit'));
-  });
-  it('should set the button to visible on mouse over', async () => {
-    const onChangeModeSpy = vi.fn();
-    render(_jsx(Editable, {
-      mode: "view",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const editButton = screen.getByRole('button');
-    expect(editButton).toHaveClass('test-hidden');
-    fireEvent.mouseOver(editButton);
-    await waitFor(() => {
-      expect(editButton).toHaveClass('test-visible');
-    });
-    fireEvent.mouseOut(editButton);
-    await waitFor(() => {
-      expect(editButton).toHaveClass('test-hidden');
-    });
-  });
-  it('should change to view mode on editor blur', () => {
-    const onChangeModeSpy = vi.fn();
-    render(_jsx(Editable, {
-      mode: "edit",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const inputForEdit = screen.getByTestId('edit-mode-input');
-    fireEvent.focus(inputForEdit);
-    fireEvent.blur(inputForEdit);
-    expect(onChangeModeSpy).toHaveBeenCalledWith('view');
-  });
-  it('should change to view mode on escape', () => {
-    const onChangeModeSpy = vi.fn();
-    render(_jsx(Editable, {
-      mode: "edit",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const inputForEdit = screen.getByTestId('edit-mode-input');
-    fireEvent.keyUp(inputForEdit, {
-      key: 'Escape',
-      code: 'Escape'
-    });
-    expect(onChangeModeSpy).toHaveBeenCalledWith('view');
-  });
-  it('should call onChange when the user is finished editing', () => {
-    const onChangeSpy = vi.fn();
-    const _render = render(_jsx(Editable, {
-        mode: "edit",
-        onChangeMode: vi.fn(),
-        render: childRender,
-        value: "initial_value",
-        onChange: onChangeSpy
-      })),
-      rerender = _render.rerender;
-    const inputForEdit = screen.getByTestId('edit-mode-input');
-    fireEvent.change(inputForEdit, {
-      target: {
-        value: 'updated_value'
-      }
-    });
-    expect(onChangeSpy).not.toHaveBeenCalled();
-
-    // Simulate mode prop change
-    rerender(_jsx(Editable, {
-      mode: "view",
-      onChangeMode: vi.fn(),
-      render: childRender,
-      value: "updated_value",
-      onChange: onChangeSpy
-    }));
-    expect(onChangeSpy).toHaveBeenCalledWith('updated_value');
-  });
-  it('should warn if readOnly + mode="edit"', () => {
-    const consoleWarningSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
-    render(_jsx(Editable, {
-      mode: "edit",
-      onChangeMode: vi.fn(),
-      render: childRender,
-      value: "foo",
-      readOnly: true
-    }));
-    const expectedErrorMessage = 'When readOnly is true, mode must be "view"';
-    expect(consoleWarningSpy).toHaveBeenCalledWith(expect.stringContaining(expectedErrorMessage), expect.any(String));
-    consoleWarningSpy.mockRestore();
-  });
-});

package/es/InPlaceEdit/__new-tests__/InPlaceEdit.test.js

@@ -1,224 +0,0 @@
-var _div;
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2018 - 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, screen } from '@testing-library/react';
-import { vi } from 'vitest';
-import '@testing-library/jest-dom';
-import { InPlaceEdit } from '../index';
-import { runAxeCheck } from '@instructure/ui-axe-check';
-import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-const VIEWER_TEXT = 'viewer-text';
-const EDIT_BUTTON_TEXT = 'edit-button-text';
-const renderViewer = () => _div || (_div = _jsx("div", {
-  children: VIEWER_TEXT
-}));
-const renderEditor = ({
-  editorRef,
-  onBlur
-}) => {
-  return _jsx("input", {
-    "data-testid": "input-editor",
-    ref: editorRef,
-    onBlur: onBlur,
-    defaultValue: "textvalue",
-    "aria-label": "Editor"
-  });
-};
-const renderEditButton = props => {
-  const elementRef = props.elementRef;
-  const onClick = props.onClick,
-    onFocus = props.onFocus,
-    onBlur = props.onBlur,
-    isVisible = props.isVisible,
-    readOnly = props.readOnly;
-  return InPlaceEdit.renderDefaultEditButton({
-    isVisible,
-    readOnly,
-    label: EDIT_BUTTON_TEXT,
-    ...{
-      onClick,
-      onFocus,
-      onBlur,
-      elementRef
-    }
-  });
-};
-describe('<InPlaceEdit />', () => {
-  let consoleWarningMock;
-  let consoleErrorMock;
-  beforeEach(() => {
-    // Mocking console to prevent test output pollution and expect for messages
-    consoleWarningMock = vi.spyOn(console, 'warn').mockImplementation(() => {});
-    consoleErrorMock = vi.spyOn(console, 'error').mockImplementation(() => {});
-  });
-  afterEach(() => {
-    consoleWarningMock.mockRestore();
-    consoleErrorMock.mockRestore();
-  });
-  it('should render view mode', () => {
-    render(_jsx(InPlaceEdit, {
-      mode: "view",
-      onChangeMode: vi.fn(),
-      renderViewer: renderViewer,
-      renderEditor: renderEditor,
-      renderEditButton: renderEditButton
-    }));
-    const viewModeText = screen.getByText(VIEWER_TEXT);
-    const editButton = screen.getByRole('button');
-    expect(viewModeText).toBeInTheDocument();
-    expect(editButton).toBeInTheDocument();
-    expect(editButton).toHaveTextContent(EDIT_BUTTON_TEXT);
-  });
-  it('should render view mode with string button label', () => {
-    const _render = render(_jsx(InPlaceEdit, {
-        mode: "view",
-        onChangeMode: vi.fn(),
-        renderViewer: renderViewer,
-        renderEditor: renderEditor,
-        renderEditButton: renderEditButton
-      })),
-      container = _render.container;
-    const viewModeText = screen.getByText(VIEWER_TEXT);
-    const editButton = screen.getByRole('button');
-    const buttonLabel = container.querySelector("[class$='-screenReaderContent']");
-    expect(viewModeText).toBeInTheDocument();
-    expect(editButton).toBeInTheDocument();
-    expect(editButton).toContainElement(buttonLabel);
-    expect(buttonLabel).toHaveTextContent(EDIT_BUTTON_TEXT);
-  });
-  it('should render edit mode', () => {
-    render(_jsx(InPlaceEdit, {
-      mode: "edit",
-      onChangeMode: vi.fn(),
-      renderViewer: renderViewer,
-      renderEditor: renderEditor,
-      renderEditButton: renderEditButton
-    }));
-    const inputForEdit = screen.getByTestId('input-editor');
-    expect(inputForEdit).toBeInTheDocument();
-    expect(document.activeElement).toBe(inputForEdit);
-  });
-  it('should render a custom edit button', () => {
-    var _button;
-    const customButtonText = 'custom-button-text';
-    render(_jsx(InPlaceEdit, {
-      mode: "view",
-      onChangeMode: vi.fn(),
-      renderViewer: renderViewer,
-      renderEditor: renderEditor,
-      renderEditButton: () => {
-        return _button || (_button = _jsx("button", {
-          "data-testid": "custom_button",
-          children: customButtonText
-        }));
-      }
-    }));
-    const viewModeText = screen.getByText(VIEWER_TEXT);
-    const customEditButton = screen.getByTestId('custom_button');
-    expect(viewModeText).toBeInTheDocument();
-    expect(customEditButton).toBeInTheDocument();
-    expect(customEditButton).toHaveTextContent(customButtonText);
-  });
-  it('should switch mode to edit via props, and focus the editor', () => {
-    const _render2 = render(_jsx(InPlaceEdit, {
-        mode: "view",
-        onChangeMode: vi.fn(),
-        renderViewer: renderViewer,
-        renderEditor: renderEditor,
-        renderEditButton: renderEditButton
-      })),
-      rerender = _render2.rerender,
-      container = _render2.container;
-    const viewModeText = screen.getByText(VIEWER_TEXT);
-    expect(viewModeText).toBeInTheDocument();
-
-    // Simulate mode prop change
-    rerender(_jsx(InPlaceEdit, {
-      mode: "edit",
-      onChangeMode: vi.fn(),
-      renderViewer: renderViewer,
-      renderEditor: renderEditor,
-      renderEditButton: renderEditButton
-    }));
-    const inputForEdit = screen.getByTestId('input-editor');
-    expect(container).not.toHaveTextContent(VIEWER_TEXT);
-    expect(inputForEdit).toBeInTheDocument();
-    expect(document.activeElement).toBe(inputForEdit);
-  });
-  it('should switch mode to view via props, and focus the edit button', () => {
-    const _render3 = render(_jsx(InPlaceEdit, {
-        mode: "edit",
-        onChangeMode: vi.fn(),
-        renderViewer: renderViewer,
-        renderEditor: renderEditor,
-        renderEditButton: renderEditButton
-      })),
-      rerender = _render3.rerender,
-      container = _render3.container;
-    const inputForEdit = screen.getByTestId('input-editor');
-    expect(container).not.toHaveTextContent(VIEWER_TEXT);
-    expect(inputForEdit).toBeInTheDocument();
-
-    // Simulate mode prop change
-    rerender(_jsx(InPlaceEdit, {
-      mode: "view",
-      onChangeMode: vi.fn(),
-      renderViewer: renderViewer,
-      renderEditor: renderEditor,
-      renderEditButton: renderEditButton
-    }));
-    const inputForEditAfterModeChange = container.querySelector("[id='input-editor']");
-    const editButton = screen.getByRole('button');
-    expect(container).toHaveTextContent(VIEWER_TEXT);
-    expect(inputForEditAfterModeChange).not.toBeInTheDocument();
-    expect(editButton).toBeInTheDocument();
-    expect(editButton).toHaveTextContent(EDIT_BUTTON_TEXT);
-    expect(document.activeElement).toBe(editButton);
-  });
-  it('should meet a11y standards in view mode', async () => {
-    const _render4 = render(_jsx(InPlaceEdit, {
-        mode: "view",
-        onChangeMode: vi.fn(),
-        renderViewer: renderViewer,
-        renderEditor: renderEditor,
-        renderEditButton: renderEditButton
-      })),
-      container = _render4.container;
-    const axeCheck = await runAxeCheck(container);
-    expect(axeCheck).toBe(true);
-  });
-  it('should meet a11y standards in edit mode', async () => {
-    const _render5 = render(_jsx(InPlaceEdit, {
-        mode: "edit",
-        onChangeMode: vi.fn(),
-        renderViewer: renderViewer,
-        renderEditor: renderEditor,
-        renderEditButton: renderEditButton
-      })),
-      container = _render5.container;
-    const axeCheck = await runAxeCheck(container);
-    expect(axeCheck).toBe(true);
-  });
-});

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

@@ -1,223 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = 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 _jsxRuntime = require("@emotion/react/jsx-runtime");
-const _excluded = ["isVisible", "buttonRef"];
-/*
- * The MIT License (MIT)
- *
- * Copyright (c) 2018 - 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 TEXT_VIEW = 'text-view';
-const TEXT_EDIT = 'text-edit';
-const childRender = _vitest.vi.fn(({
-  mode,
-  getContainerProps,
-  getViewerProps,
-  getEditorProps,
-  getEditButtonProps
-}) => {
-  const _getEditButtonProps = getEditButtonProps(),
-    isVisible = _getEditButtonProps.isVisible,
-    buttonRef = _getEditButtonProps.buttonRef,
-    buttonProps = (0, _objectWithoutProperties2.default)(_getEditButtonProps, _excluded);
-  const _getEditorProps = getEditorProps(),
-    onBlur = _getEditorProps.onBlur,
-    editorRef = _getEditorProps.editorRef;
-  return (0, _jsxRuntime.jsxs)("div", {
-    "data-testid": "child-container",
-    ...getContainerProps(),
-    children: [mode === 'view' && (0, _jsxRuntime.jsx)("div", {
-      ...getViewerProps(),
-      children: TEXT_VIEW
-    }), mode === 'edit' && (0, _jsxRuntime.jsx)("input", {
-      ref: editorRef,
-      onBlur: onBlur,
-      defaultValue: "textvalue",
-      "data-testid": "edit-mode-input"
-    }), (0, _jsxRuntime.jsx)("button", {
-      ...buttonProps,
-      className: isVisible ? 'test-visible' : 'test-hidden',
-      children: TEXT_EDIT
-    })]
-  });
-});
-describe('<Editable />', () => {
-  let consoleWarningMock;
-  let consoleErrorMock;
-  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();
-    childRender.mockClear();
-  });
-  it('should render view mode', async () => {
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "view",
-      onChangeMode: _vitest.vi.fn(),
-      render: childRender
-    }));
-    const currentMode = childRender.mock.calls[0][0].mode;
-    const viewModeText = _react.screen.getByText(TEXT_VIEW);
-    const editButton = _react.screen.getByRole('button', {
-      name: TEXT_EDIT
-    });
-    expect(childRender).toHaveBeenCalled();
-    expect(currentMode).toBe('view');
-    expect(viewModeText).toBeInTheDocument();
-    expect(editButton).toBeInTheDocument();
-  });
-  it('should render edit mode', async () => {
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "edit",
-      onChangeMode: _vitest.vi.fn(),
-      render: childRender
-    }));
-    const currentMode = childRender.mock.calls[0][0].mode;
-    const inputForEdit = _react.screen.getByTestId('edit-mode-input');
-    const editButton = _react.screen.getByRole('button', {
-      name: TEXT_EDIT
-    });
-    expect(childRender).toHaveBeenCalled();
-    expect(currentMode).toBe('edit');
-    expect(inputForEdit).toBeInTheDocument();
-    expect(editButton).toBeInTheDocument();
-  });
-  it('should change to edit mode on button click', () => {
-    const onChangeModeSpy = _vitest.vi.fn();
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "view",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const viewModeText = _react.screen.getByText(TEXT_VIEW);
-    const editButton = _react.screen.getByRole('button');
-    expect(viewModeText).toBeInTheDocument();
-    _react.fireEvent.click(editButton);
-    expect(onChangeModeSpy).toHaveBeenCalledWith('edit');
-  });
-  it('should change to edit mode on component click', async () => {
-    const onChangeModeSpy = _vitest.vi.fn();
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "view",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const childContainer = _react.screen.getByTestId('child-container');
-    _userEvent.default.click(childContainer);
-    await (0, _react.waitFor)(() => expect(onChangeModeSpy).toHaveBeenCalledWith('edit'));
-  });
-  it('should set the button to visible on mouse over', async () => {
-    const onChangeModeSpy = _vitest.vi.fn();
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "view",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const editButton = _react.screen.getByRole('button');
-    expect(editButton).toHaveClass('test-hidden');
-    _react.fireEvent.mouseOver(editButton);
-    await (0, _react.waitFor)(() => {
-      expect(editButton).toHaveClass('test-visible');
-    });
-    _react.fireEvent.mouseOut(editButton);
-    await (0, _react.waitFor)(() => {
-      expect(editButton).toHaveClass('test-hidden');
-    });
-  });
-  it('should change to view mode on editor blur', () => {
-    const onChangeModeSpy = _vitest.vi.fn();
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "edit",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const inputForEdit = _react.screen.getByTestId('edit-mode-input');
-    _react.fireEvent.focus(inputForEdit);
-    _react.fireEvent.blur(inputForEdit);
-    expect(onChangeModeSpy).toHaveBeenCalledWith('view');
-  });
-  it('should change to view mode on escape', () => {
-    const onChangeModeSpy = _vitest.vi.fn();
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "edit",
-      onChangeMode: onChangeModeSpy,
-      render: childRender
-    }));
-    const inputForEdit = _react.screen.getByTestId('edit-mode-input');
-    _react.fireEvent.keyUp(inputForEdit, {
-      key: 'Escape',
-      code: 'Escape'
-    });
-    expect(onChangeModeSpy).toHaveBeenCalledWith('view');
-  });
-  it('should call onChange when the user is finished editing', () => {
-    const onChangeSpy = _vitest.vi.fn();
-    const _render = (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-        mode: "edit",
-        onChangeMode: _vitest.vi.fn(),
-        render: childRender,
-        value: "initial_value",
-        onChange: onChangeSpy
-      })),
-      rerender = _render.rerender;
-    const inputForEdit = _react.screen.getByTestId('edit-mode-input');
-    _react.fireEvent.change(inputForEdit, {
-      target: {
-        value: 'updated_value'
-      }
-    });
-    expect(onChangeSpy).not.toHaveBeenCalled();
-
-    // Simulate mode prop change
-    rerender((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "view",
-      onChangeMode: _vitest.vi.fn(),
-      render: childRender,
-      value: "updated_value",
-      onChange: onChangeSpy
-    }));
-    expect(onChangeSpy).toHaveBeenCalledWith('updated_value');
-  });
-  it('should warn if readOnly + mode="edit"', () => {
-    const consoleWarningSpy = _vitest.vi.spyOn(console, 'warn').mockImplementation(() => {});
-    (0, _react.render)((0, _jsxRuntime.jsx)(_index.Editable, {
-      mode: "edit",
-      onChangeMode: _vitest.vi.fn(),
-      render: childRender,
-      value: "foo",
-      readOnly: true
-    }));
-    const expectedErrorMessage = 'When readOnly is true, mode must be "view"';
-    expect(consoleWarningSpy).toHaveBeenCalledWith(expect.stringContaining(expectedErrorMessage), expect.any(String));
-    consoleWarningSpy.mockRestore();
-  });
-});