Skip to content

Commit

Permalink
fix react-dom warnings in selection tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@etrepum
etrepum committed May 8, 2024
1 parent 2af440b commit 4714f92
Show file tree
Hide file tree
Showing 2 changed files with 38 additions and 37 deletions.
33 changes: 17 additions & 16 deletions packages/lexical-selection/src/__tests__/unit/LexicalSelection.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ import {
invariant,
TestComposer,
} from 'lexical/src/__tests__/utils';
import {createRoot} from 'react-dom/client';
import {createRoot, Root} from 'react-dom/client';
import * as ReactTestUtils from 'shared/react-test-utils';

import {
Expand Down Expand Up @@ -113,24 +113,27 @@ Range.prototype.getBoundingClientRect = function (): DOMRect {
};

describe('LexicalSelection tests', () => {
let container: HTMLElement | null = null;
let container: HTMLElement;
let reactRoot: Root;
let editor: LexicalEditor | null = null;

beforeEach(async () => {
container = document.createElement('div');
document.body.appendChild(container);

reactRoot = createRoot(container);
await init();
});

afterEach(() => {
if (container) {
document.body.removeChild(container);
}
container = null;
afterEach(async () => {
// Ensure we are clearing out any React state and running effects with
// act
await ReactTestUtils.act(async () => {
reactRoot.unmount();
await Promise.resolve().then();
});
document.body.removeChild(container);
});

let editor: LexicalEditor | null = null;

async function init() {
function TestBase() {
function TestPlugin() {
Expand Down Expand Up @@ -187,10 +190,10 @@ describe('LexicalSelection tests', () => {
);
}

ReactTestUtils.act(() => {
createRoot(container!).render(<TestBase />);
await ReactTestUtils.act(async () => {
reactRoot.render(<TestBase />);
await Promise.resolve().then();
});

editor!.getRootElement()!.focus();

await Promise.resolve().then();
Expand All @@ -208,8 +211,6 @@ describe('LexicalSelection tests', () => {
await ReactTestUtils.act(async () => {
await editor!.update(fn);
});

return Promise.resolve().then();
}

test('Expect initial output to be a block with no text.', () => {
Expand Down Expand Up @@ -1132,7 +1133,7 @@ describe('LexicalSelection tests', () => {
await applySelectionInputs(testUnit.inputs, update, editor!);

// Validate HTML matches
expect(container!.innerHTML).toBe(testUnit.expectedHTML);
expect(container.innerHTML).toBe(testUnit.expectedHTML);

// Validate selection matches
const rootElement = editor!.getRootElement()!;
Expand Down
42 changes: 21 additions & 21 deletions packages/lexical-selection/src/__tests__/unit/LexicalSelectionHelpers.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ Range.prototype.getBoundingClientRect = function (): DOMRect {
};
};

function createParagraphWithNodes(
function $createParagraphWithNodes(
editor: LexicalEditor,
nodes: {text: string; key: string; mergeable?: boolean}[],
) {
Expand Down Expand Up @@ -95,7 +95,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

const element = createParagraphWithNodes(editor, [
const element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -272,7 +272,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -353,7 +353,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -429,7 +429,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -490,7 +490,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -556,7 +556,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -632,7 +632,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -706,7 +706,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

const element = createParagraphWithNodes(editor, []);
const element = $createParagraphWithNodes(editor, []);

root.append(element);

Expand Down Expand Up @@ -843,7 +843,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

const element = createParagraphWithNodes(editor, [
const element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -996,7 +996,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

const element = createParagraphWithNodes(editor, [
const element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -1151,7 +1151,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -1222,7 +1222,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

element = createParagraphWithNodes(editor, [
element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: true,
Expand Down Expand Up @@ -1293,7 +1293,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

const element = createParagraphWithNodes(editor, [
const element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -1470,7 +1470,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

const element = createParagraphWithNodes(editor, [
const element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -1627,7 +1627,7 @@ describe('LexicalSelectionHelpers tests', () => {
editor.update(() => {
const root = $getRoot();

const element = createParagraphWithNodes(editor, [
const element = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -2694,7 +2694,7 @@ describe('$patchStyleText', () => {
await editor.update(() => {
const root = $getRoot();

const paragraph = createParagraphWithNodes(editor, [
const paragraph = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -2750,14 +2750,14 @@ describe('$patchStyleText', () => {
await editor.update(() => {
const root = $getRoot();

const paragraph1 = createParagraphWithNodes(editor, [
const paragraph1 = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
text: 'a',
},
]);
const paragraph2 = createParagraphWithNodes(editor, [
const paragraph2 = $createParagraphWithNodes(editor, [
{
key: 'b',
mergeable: false,
Expand Down Expand Up @@ -2800,7 +2800,7 @@ describe('$patchStyleText', () => {
await editor.update(() => {
const root = $getRoot();

const paragraph = createParagraphWithNodes(editor, [
const paragraph = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down Expand Up @@ -2853,7 +2853,7 @@ describe('$patchStyleText', () => {
await editor.update(() => {
const root = $getRoot();

const paragraph = createParagraphWithNodes(editor, [
const paragraph = $createParagraphWithNodes(editor, [
{
key: 'a',
mergeable: false,
Expand Down

0 comments on commit 4714f92

Please sign in to comment.