test: fix lint formatting and jsx act warnings

Author: petyosi

src/plugins/codemirror/CodeMirrorEditor.tsx

@@ -12,7 +12,13 @@ import { indentWithTab } from '@codemirror/commands'
 import { basicLight } from 'cm6-theme-basic-light'
 import { basicSetup } from 'codemirror'
 import { $setSelection } from 'lexical'
-import { EMPTY_VALUE, codeBlockLanguages$, codeMirrorAutoLoadLanguageSupport$, codeMirrorExtensions$, getCodeBlockLanguageSelectData } from '.'
+import {
+  EMPTY_VALUE,
+  codeBlockLanguages$,
+  codeMirrorAutoLoadLanguageSupport$,
+  codeMirrorExtensions$,
+  getCodeBlockLanguageSelectData
+} from '.'
 import { useCodeMirrorRef } from '../sandpack/useCodeMirrorRef'
 import { Select } from '../toolbar/primitives/select'
 

src/plugins/core/MdastHTMLNode.ts

@@ -43,8 +43,7 @@ export type MdxNodeType = MdastHTMLNode['type']
  */
 export function isMdastHTMLNode(node: Mdast.Nodes): node is MdastHTMLNode {
   return (
-    MDX_NODE_TYPES.includes(node.type as unknown as MdxNodeType) &&
-    (htmlTags as readonly string[]).includes((node as MdastHTMLNode).name)
+    MDX_NODE_TYPES.includes(node.type as unknown as MdxNodeType) && (htmlTags as readonly string[]).includes((node as MdastHTMLNode).name)
   )
 }
 

src/test/codemirror.test.ts

@@ -1,5 +1,10 @@
 import { describe, expect, it } from 'vitest'
-import { getCodeBlockLanguageSelectData, normalizeCodeBlockLanguages, EMPTY_VALUE, type CodeBlockLanguageSupport } from '../plugins/codemirror'
+import {
+  getCodeBlockLanguageSelectData,
+  normalizeCodeBlockLanguages,
+  EMPTY_VALUE,
+  type CodeBlockLanguageSupport
+} from '../plugins/codemirror'
 
 describe('normalizeCodeBlockLanguages', () => {
   describe('record format', () => {

src/test/jsx.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { afterEach, describe, expect, it, vi } from 'vitest'
 import { GenericJsxEditor, JsxComponentDescriptor, MDXEditor, MDXEditorMethods, jsxPlugin } from '../'
-import { render, act } from '@testing-library/react'
+import { render, act, waitFor } from '@testing-library/react'
 
 // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
 ;(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true
@@ -23,6 +23,12 @@ afterEach(() => {
   vi.restoreAllMocks()
 })
 
+const flushEditorUpdates = async () => {
+  await act(async () => {
+    await new Promise((resolve) => setTimeout(resolve, 0))
+  })
+}
+
 describe('jsx markdown import export', () => {
   // produces a warning about act
   it.todo('skips jsx import if not specified', async () => {
@@ -39,7 +45,7 @@ describe('jsx markdown import export', () => {
     expect(processedMarkdown).toEqual(markdown.trim())
   })
 
-  it('routes capitalized jsx components sharing an html tag name to the jsx visitor', () => {
+  it('routes capitalized jsx components sharing an html tag name to the jsx visitor', async () => {
     const descriptors: JsxComponentDescriptor[] = [
       {
         name: 'Section',
@@ -52,6 +58,7 @@ describe('jsx markdown import export', () => {
     const { container } = render(
       <MDXEditor markdown={`<Section>Section content</Section>`} plugins={[jsxPlugin({ jsxComponentDescriptors: descriptors })]} />
     )
+    await flushEditorUpdates()
     expect(container.querySelector('section')).toBeNull()
   })
 
@@ -84,9 +91,13 @@ describe('jsx markdown import export', () => {
     ]
 
     act(() => {
-      render(<MDXEditor ref={ref} markdown={`<Wrapper><Section /></Wrapper>`} plugins={[jsxPlugin({ jsxComponentDescriptors: descriptors })]} />)
+      render(
+        <MDXEditor ref={ref} markdown={`<Wrapper><Section /></Wrapper>`} plugins={[jsxPlugin({ jsxComponentDescriptors: descriptors })]} />
+      )
+    })
+    await waitFor(() => {
+      expect(ref.current?.getMarkdown() ?? '').toContain(`import { Wrapper, Section } from './components'`)
     })
-    await new Promise((resolve) => setTimeout(resolve, 100))
 
     const processedMarkdown = ref.current?.getMarkdown() ?? ''