diff --git a/eslint.config.js b/eslint.config.js index 25f3c6db9e..edf3392947 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -707,7 +707,7 @@ export default [ 'testing-library/prefer-presence-queries': 1, 'testing-library/prefer-query-by-disappearance': 1, 'testing-library/prefer-query-matchers': 0, - 'testing-library/prefer-screen-queries': 1, + 'testing-library/prefer-screen-queries': 0, 'testing-library/prefer-user-event': 1, 'testing-library/render-result-naming-convention': 0 } diff --git a/package.json b/package.json index 961778cae0..a26313bb88 100644 --- a/package.json +++ b/package.json @@ -87,7 +87,7 @@ "@wyw-in-js/vite": "^0.5.0", "babel-plugin-optimize-clsx": "^2.6.2", "browserslist": "^4.24.0", - "eslint": "^9.14.0", + "eslint": "9.14.0", "eslint-plugin-jest-dom": "^5.0.1", "eslint-plugin-react": "^7.37.2", "eslint-plugin-react-compiler": "^19.0.0-beta-a7bf2bd-20241110", @@ -108,7 +108,8 @@ "rollup-plugin-postcss": "^4.0.2", "typescript": "~5.6.2", "vite": "^5.4.5", - "vitest": "^2.1.1" + "vitest": "^2.1.1", + "vitest-browser-react": "^0.0.3" }, "peerDependencies": { "react": "^18.0 || ^19.0", diff --git a/test/browser/TextEditor.test.tsx b/test/browser/TextEditor.test.tsx index ca0fb09e82..a29386f95c 100644 --- a/test/browser/TextEditor.test.tsx +++ b/test/browser/TextEditor.test.tsx @@ -1,16 +1,24 @@ import { useState } from 'react'; -import { fireEvent, render, screen } from '@testing-library/react'; -import userEvent from '@testing-library/user-event'; +import { page, userEvent } from '@vitest/browser/context'; import DataGrid, { textEditor } from '../../src'; import type { Column } from '../../src'; -import { getCells } from './utils'; +import { getCellsNew } from './utils'; interface Row { readonly name: string; } -const columns: readonly Column[] = [{ key: 'name', name: 'Name', renderEditCell: textEditor }]; +const columns: readonly Column[] = [ + { + key: 'name', + name: 'Name', + renderEditCell: textEditor, + editorOptions: { + commitOnOutsideClick: false + } + } +]; const initialRows: readonly Row[] = [{ name: 'Tacitus Kilgore' }]; function Test() { @@ -20,10 +28,10 @@ function Test() { } test('TextEditor', async () => { - render(); + page.render(); - await userEvent.dblClick(getCells()[0]); - let input: HTMLInputElement | null = screen.getByRole('textbox'); + await userEvent.dblClick(getCellsNew()[0]); + let input = page.getByRole('textbox').element() as HTMLInputElement; expect(input).toHaveClass('rdg-text-editor'); // input value is row[column.key] expect(input).toHaveValue(initialRows[0].name); @@ -36,13 +44,13 @@ test('TextEditor', async () => { // pressing escape closes the editor without committing await userEvent.keyboard('Test{escape}'); expect(input).not.toBeInTheDocument(); - expect(getCells()[0]).toHaveTextContent(/^Tacitus Kilgore$/); + await expect.element(getCellsNew()[0]).toHaveTextContent(/^Tacitus Kilgore$/); // blurring the input closes and commits the editor - await userEvent.dblClick(getCells()[0]); - input = screen.getByRole('textbox'); - await userEvent.keyboard('Jim Milton'); - fireEvent.blur(input); + await userEvent.dblClick(getCellsNew()[0]); + input = page.getByRole('textbox').element() as HTMLInputElement; + await userEvent.fill(input, 'Jim Milton'); + await userEvent.tab(); expect(input).not.toBeInTheDocument(); - expect(getCells()[0]).toHaveTextContent(/^Jim Milton$/); + await expect.element(getCellsNew()[0]).toHaveTextContent(/^Jim Milton$/); }); diff --git a/test/browser/column/renderEditCell.test.tsx b/test/browser/column/renderEditCell.test.tsx index 56f0aa3b58..5383389b34 100644 --- a/test/browser/column/renderEditCell.test.tsx +++ b/test/browser/column/renderEditCell.test.tsx @@ -1,7 +1,6 @@ import { useMemo, useState } from 'react'; import { createPortal } from 'react-dom'; -import { act, render, screen, waitFor } from '@testing-library/react'; -import userEvent from '@testing-library/user-event'; +import { page, userEvent } from '@vitest/browser/context'; import DataGrid from '../../../src'; import type { Column, DataGridProps } from '../../../src'; @@ -14,79 +13,75 @@ interface Row { describe('Editor', () => { it('should open editor on double click', async () => { - render(); + page.render(); + const editor = page.getByRole('spinbutton', { name: 'col1-editor' }); await userEvent.click(getCellsAtRowIndex(0)[0]); - expect(screen.queryByRole('spinbutton', { name: 'col1-editor' })).not.toBeInTheDocument(); + await expect.element(editor).not.toBeInTheDocument(); await userEvent.dblClick(getCellsAtRowIndex(0)[0]); - expect(screen.getByRole('spinbutton', { name: 'col1-editor' })).toHaveValue(1); + await expect.element(editor).toHaveValue(1); await userEvent.keyboard('2'); await userEvent.tab(); - expect(screen.queryByRole('spinbutton', { name: 'col1-editor' })).not.toBeInTheDocument(); - expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^21$/); + await expect.element(editor).not.toBeInTheDocument(); + expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^12$/); }); it('should open and commit changes on enter', async () => { - render(); + page.render(); + const editor = page.getByRole('spinbutton', { name: 'col1-editor' }); await userEvent.click(getCellsAtRowIndex(0)[0]); - expect(screen.queryByRole('spinbutton', { name: 'col1-editor' })).not.toBeInTheDocument(); + await expect.element(editor).not.toBeInTheDocument(); await userEvent.keyboard('{enter}'); - expect(screen.getByRole('spinbutton', { name: 'col1-editor' })).toHaveValue(1); + await expect.element(editor).toHaveValue(1); await userEvent.keyboard('3{enter}'); - expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^31$/); + expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^13$/); expect(getCellsAtRowIndex(0)[0]).toHaveFocus(); - expect(screen.queryByRole('spinbutton', { name: 'col1-editor' })).not.toBeInTheDocument(); + await expect.element(editor).not.toBeInTheDocument(); }); it('should open editor when user types', async () => { - render(); + page.render(); await userEvent.click(getCellsAtRowIndex(0)[0]); await userEvent.keyboard('123{enter}'); - expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^1231$/); + expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^1123$/); }); it('should close editor and discard changes on escape', async () => { - render(); + page.render(); await userEvent.dblClick(getCellsAtRowIndex(0)[0]); - expect(screen.getByRole('spinbutton', { name: 'col1-editor' })).toHaveValue(1); + const editor = page.getByRole('spinbutton', { name: 'col1-editor' }); + await expect.element(editor).toHaveValue(1); await userEvent.keyboard('2222{escape}'); - expect(screen.queryByRole('spinbutton', { name: 'col1-editor' })).not.toBeInTheDocument(); + await expect.element(editor).not.toBeInTheDocument(); expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^1$/); expect(getCellsAtRowIndex(0)[0]).toHaveFocus(); }); it('should commit changes and close editor when clicked outside', async () => { - render(); + page.render(); await userEvent.dblClick(getCellsAtRowIndex(0)[0]); - const editor = screen.getByRole('spinbutton', { name: 'col1-editor' }); - expect(editor).toHaveValue(1); + const editor = page.getByRole('spinbutton', { name: 'col1-editor' }); + await expect.element(editor).toHaveValue(1); await userEvent.keyboard('2222'); - await userEvent.click(screen.getByText('outside')); - await waitFor(() => { - expect(editor).not.toBeInTheDocument(); - }); - expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^22221$/); + await userEvent.click(page.getByText('outside')); + await expect.element(editor).not.toBeInTheDocument(); + expect(getCellsAtRowIndex(0)[0]).toHaveTextContent(/^12222$/); }); it('should commit quickly enough on outside clicks so click event handlers access the latest rows state', async () => { const onSave = vi.fn(); - render(); - const user = userEvent.setup(); - await user.dblClick(getCellsAtRowIndex(0)[0]); - await user.keyboard('234'); + page.render(); + await userEvent.dblClick(getCellsAtRowIndex(0)[0]); + await userEvent.keyboard('234'); expect(onSave).not.toHaveBeenCalled(); - const saveButton = screen.getByRole('button', { name: 'save' }); + const saveButton = page.getByRole('button', { name: 'save' }); - // await userEvent.click() triggers both mousedown and click, but without delay, - // which isn't realistic, and isn't enough to trigger outside click detection - await user.pointer([{ keys: '[MouseLeft>]', target: saveButton }]); - await act(async () => { - await new Promise(requestAnimationFrame); - }); - await user.pointer({ keys: '[/MouseLeft]' }); + // without delay, `click()` triggers both `mousedown` and `click` events + // too quickly for outside clicks to be detected + await userEvent.click(saveButton, { delay: 10 }); expect(onSave).toHaveBeenCalledTimes(1); expect(onSave).toHaveBeenCalledWith([ - { col1: 2341, col2: 'a1' }, + { col1: 1234, col2: 'a1' }, { col1: 2, col2: 'a2' } ]); }); @@ -97,80 +92,82 @@ describe('Editor', () => { rows.push({ col1: i, col2: `${i}` }); } - render(); + page.render(); await userEvent.click(getCellsAtRowIndex(0)[0]); expect(getCellsAtRowIndex(0)).toHaveLength(2); await scrollGrid({ scrollTop: 2000 }); expect(getCellsAtRowIndex(0)).toHaveLength(1); - expect(screen.queryByRole('spinbutton', { name: 'col1-editor' })).not.toBeInTheDocument(); + const editor = page.getByRole('spinbutton', { name: 'col1-editor' }); + await expect.element(editor).not.toBeInTheDocument(); expect(getGrid().scrollTop).toBe(2000); await userEvent.keyboard('123'); expect(getCellsAtRowIndex(0)).toHaveLength(2); - expect(screen.getByRole('spinbutton', { name: 'col1-editor' })).toHaveValue(1230); + await expect.element(editor).toHaveValue(123); expect(getGrid().scrollTop).toBe(0); }); describe('editable', () => { it('should be editable if an editor is specified and editable is undefined/null', async () => { - render(); + page.render(); const cell = getCellsAtRowIndex(0)[1]; expect(cell).not.toHaveAttribute('aria-readonly'); await userEvent.dblClick(cell); - expect(screen.getByRole('textbox', { name: 'col2-editor' })).toBeInTheDocument(); + await expect.element(page.getByRole('textbox', { name: 'col2-editor' })).toBeInTheDocument(); }); it('should be editable if an editor is specified and editable is set to true', async () => { - render(); + page.render(); await userEvent.dblClick(getCellsAtRowIndex(0)[1]); - expect(screen.getByRole('textbox', { name: 'col2-editor' })).toBeInTheDocument(); + await expect.element(page.getByRole('textbox', { name: 'col2-editor' })).toBeInTheDocument(); }); it('should not be editable if editable is false', async () => { - render(); + page.render(); const cell = getCellsAtRowIndex(0)[1]; expect(cell).toHaveAttribute('aria-readonly', 'true'); await userEvent.dblClick(cell); - expect(screen.queryByRole('textbox', { name: 'col2-editor' })).not.toBeInTheDocument(); + + await expect + .element(page.getByRole('textbox', { name: 'col2-editor' })) + .not.toBeInTheDocument(); }); it('should not be editable if editable function returns false', async () => { - render( row.col1 === 2} />); + page.render( row.col1 === 2} />); await userEvent.dblClick(getCellsAtRowIndex(0)[1]); - expect(screen.queryByRole('textbox', { name: 'col2-editor' })).not.toBeInTheDocument(); + const editor = page.getByRole('textbox', { name: 'col2-editor' }); + await expect.element(editor).not.toBeInTheDocument(); await userEvent.dblClick(getCellsAtRowIndex(1)[1]); - expect(screen.getByRole('textbox', { name: 'col2-editor' })).toBeInTheDocument(); + await expect.element(editor).toBeInTheDocument(); }); }); describe('editorOptions', () => { it('should detect outside click if editor is rendered in a portal', async () => { - render(); + page.render(); await userEvent.dblClick(getCellsAtRowIndex(0)[1]); - const editor1 = screen.getByRole('textbox', { name: 'col2-editor' }); - expect(editor1).toHaveValue('a1'); + const editor1 = page.getByRole('textbox', { name: 'col2-editor' }); + await expect.element(editor1).toHaveValue('a1'); await userEvent.keyboard('23'); // The cell value should update as the editor value is changed expect(getCellsAtRowIndex(0)[1]).toHaveTextContent(/^a123$/); // clicking in a portal does not count as an outside click await userEvent.click(editor1); - expect(editor1).toBeInTheDocument(); + await expect.element(editor1).toBeInTheDocument(); // true outside clicks are still detected - await userEvent.click(screen.getByText('outside')); - await waitFor(() => { - expect(editor1).not.toBeInTheDocument(); - }); + await userEvent.click(page.getByText('outside')); + await expect.element(editor1).not.toBeInTheDocument(); expect(getCellsAtRowIndex(0)[1]).not.toHaveFocus(); await userEvent.dblClick(getCellsAtRowIndex(0)[1]); - const editor2 = screen.getByRole('textbox', { name: 'col2-editor' }); - await userEvent.click(editor2); + await userEvent.click(page.getByRole('textbox', { name: 'col2-editor' })); await userEvent.keyboard('{enter}'); expect(getCellsAtRowIndex(0)[1]).toHaveFocus(); }); it('should not commit on outside click if commitOnOutsideClick is false', async () => { - render( + page.render( { /> ); await userEvent.dblClick(getCellsAtRowIndex(0)[1]); - const editor = screen.getByRole('textbox', { name: 'col2-editor' }); - expect(editor).toBeInTheDocument(); - await userEvent.click(screen.getByText('outside')); - await act(async () => { - await new Promise(requestAnimationFrame); - }); - expect(editor).toBeInTheDocument(); + const editor = page.getByRole('textbox', { name: 'col2-editor' }); + await expect.element(editor).toBeInTheDocument(); + await userEvent.click(page.getByText('outside')); + await expect.element(editor).toBeInTheDocument(); await userEvent.click(editor); await userEvent.keyboard('{enter}'); - expect(editor).not.toBeInTheDocument(); + await expect.element(editor).not.toBeInTheDocument(); }); it('should not open editor if onCellKeyDown prevents the default event', async () => { - render( + page.render( { if (args.mode === 'SELECT' && event.key === 'x') { @@ -204,11 +198,13 @@ describe('Editor', () => { await userEvent.keyboard('yz{enter}'); expect(getCellsAtRowIndex(0)[1]).toHaveTextContent(/^a1yz$/); await userEvent.keyboard('x'); - expect(screen.queryByRole('textbox', { name: 'col2-editor' })).not.toBeInTheDocument(); + await expect + .element(page.getByRole('textbox', { name: 'col2-editor' })) + .not.toBeInTheDocument(); }); it('should prevent navigation if onCellKeyDown prevents the default event', async () => { - render( + page.render( { if (args.mode === 'EDIT' && event.key === 'ArrowDown') { @@ -231,7 +227,7 @@ describe('Editor', () => { rows.push({ col1: i, col2: `${i}` }); } - render(); + page.render(); await userEvent.dblClick(getCellsAtRowIndex(0)[1]); await userEvent.keyboard('abc'); @@ -275,31 +271,28 @@ describe('Editor', () => { } ]; - render( + page.render( <> ); - const outerInput = screen.getByRole('textbox', { name: 'outer-input' }); + const outerInput = page.getByRole('textbox', { name: 'outer-input' }); await userEvent.dblClick(getCellsAtRowIndex(0)[0]); - const col1Input = screen.getByRole('textbox', { name: 'col1-input' }); - expect(col1Input).toHaveFocus(); + const col1Input = page.getByRole('textbox', { name: 'col1-input' }); + await expect.element(col1Input).toHaveFocus(); await userEvent.click(outerInput); - expect(outerInput).toHaveFocus(); - await waitFor(() => { - expect(col1Input).not.toBeInTheDocument(); - }); - expect(outerInput).toHaveFocus(); + await expect.element(outerInput).toHaveFocus(); + await expect.element(col1Input).not.toBeInTheDocument(); + await expect.element(outerInput).toHaveFocus(); await userEvent.dblClick(getCellsAtRowIndex(0)[1]); - const col2Input = screen.getByRole('textbox', { name: 'col2-input' }); - expect(col2Input).toHaveFocus(); + const col2Input = page.getByRole('textbox', { name: 'col2-input' }); + await expect.element(col2Input).toHaveFocus(); await userEvent.click(outerInput); - expect(outerInput).toHaveFocus(); - expect(col2Input).not.toBeInTheDocument(); - expect(outerInput).toHaveFocus(); + await expect.element(outerInput).toHaveFocus(); + await expect.element(col2Input).not.toBeInTheDocument(); }); }); }); diff --git a/test/browser/utils.tsx b/test/browser/utils.tsx index 299631f5c9..e3d940876c 100644 --- a/test/browser/utils.tsx +++ b/test/browser/utils.tsx @@ -1,5 +1,5 @@ import { act, render, screen } from '@testing-library/react'; -import { userEvent } from '@vitest/browser/context'; +import { page, userEvent } from '@vitest/browser/context'; import { css } from '@linaria/core'; import DataGrid from '../../src'; @@ -43,6 +43,10 @@ export function getCells() { return screen.getAllByRole('gridcell'); } +export function getCellsNew() { + return page.getByRole('gridcell').all(); +} + export function queryCells() { return screen.queryAllByRole('gridcell'); } diff --git a/test/setupBrowser.ts b/test/setupBrowser.ts new file mode 100644 index 0000000000..3d18d2797c --- /dev/null +++ b/test/setupBrowser.ts @@ -0,0 +1,9 @@ +import { configure as vitestReactConfigure } from 'vitest-browser-react/pure'; + +// vitest-browser-react also automatically injects render method on the page +// need to import it so TypeScript can pick up types +import 'vitest-browser-react'; + +vitestReactConfigure({ + reactStrictMode: true +}); diff --git a/vite.config.ts b/vite.config.ts index 7f17b9a47a..3fb650dc3b 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -50,7 +50,6 @@ export default defineConfig(({ command }) => ({ reporter: ['json'] }, testTimeout: isCI ? 10000 : 5000, - setupFiles: ['test/setup.ts'], reporters: ['basic'], restoreMocks: true, sequence: { diff --git a/vitest.workspace.ts b/vitest.workspace.ts index 7c3a30f323..711e2c9ecb 100644 --- a/vitest.workspace.ts +++ b/vitest.workspace.ts @@ -29,7 +29,8 @@ export default defineWorkspace([ viewport: { width: 1920, height: 1080 }, headless: true, screenshotFailures: process.env.CI !== 'true' - } + }, + setupFiles: ['test/setup.ts', 'test/setupBrowser.ts'] } }, { @@ -37,7 +38,8 @@ export default defineWorkspace([ test: { name: 'node', include: ['test/node/**/*.test.*'], - environment: 'node' + environment: 'node', + setupFiles: ['test/setup.ts'] } } ]); diff --git a/website/routeTree.gen.ts b/website/routeTree.gen.ts index 30f143436e..7ba7263c99 100644 --- a/website/routeTree.gen.ts +++ b/website/routeTree.gen.ts @@ -1,12 +1,12 @@ -/* prettier-ignore-start */ - /* eslint-disable */ // @ts-nocheck // noinspection JSUnusedGlobalSymbols -// This file is auto-generated by TanStack Router +// This file was automatically generated by TanStack Router. +// You should NOT make any changes in this file as it will be overwritten. +// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified. import { createFileRoute } from '@tanstack/react-router' @@ -43,6 +43,7 @@ const AnimationLazyImport = createFileRoute('/Animation')() // Create/Update Routes const VariableRowHeightLazyRoute = VariableRowHeightLazyImport.update({ + id: '/VariableRowHeight', path: '/VariableRowHeight', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -50,16 +51,19 @@ const VariableRowHeightLazyRoute = VariableRowHeightLazyImport.update({ ) const TreeViewLazyRoute = TreeViewLazyImport.update({ + id: '/TreeView', path: '/TreeView', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/TreeView.lazy').then((d) => d.Route)) const ScrollToCellLazyRoute = ScrollToCellLazyImport.update({ + id: '/ScrollToCell', path: '/ScrollToCell', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/ScrollToCell.lazy').then((d) => d.Route)) const RowsReorderingLazyRoute = RowsReorderingLazyImport.update({ + id: '/RowsReordering', path: '/RowsReordering', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -67,31 +71,37 @@ const RowsReorderingLazyRoute = RowsReorderingLazyImport.update({ ) const RowGroupingLazyRoute = RowGroupingLazyImport.update({ + id: '/RowGrouping', path: '/RowGrouping', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/RowGrouping.lazy').then((d) => d.Route)) const ResizableGridLazyRoute = ResizableGridLazyImport.update({ + id: '/ResizableGrid', path: '/ResizableGrid', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/ResizableGrid.lazy').then((d) => d.Route)) const NoRowsLazyRoute = NoRowsLazyImport.update({ + id: '/NoRows', path: '/NoRows', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/NoRows.lazy').then((d) => d.Route)) const MillionCellsLazyRoute = MillionCellsLazyImport.update({ + id: '/MillionCells', path: '/MillionCells', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/MillionCells.lazy').then((d) => d.Route)) const MasterDetailLazyRoute = MasterDetailLazyImport.update({ + id: '/MasterDetail', path: '/MasterDetail', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/MasterDetail.lazy').then((d) => d.Route)) const InfiniteScrollingLazyRoute = InfiniteScrollingLazyImport.update({ + id: '/InfiniteScrolling', path: '/InfiniteScrolling', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -99,11 +109,13 @@ const InfiniteScrollingLazyRoute = InfiniteScrollingLazyImport.update({ ) const HeaderFiltersLazyRoute = HeaderFiltersLazyImport.update({ + id: '/HeaderFilters', path: '/HeaderFilters', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/HeaderFilters.lazy').then((d) => d.Route)) const CustomizableRenderersLazyRoute = CustomizableRenderersLazyImport.update({ + id: '/CustomizableRenderers', path: '/CustomizableRenderers', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -111,11 +123,13 @@ const CustomizableRenderersLazyRoute = CustomizableRenderersLazyImport.update({ ) const ContextMenuLazyRoute = ContextMenuLazyImport.update({ + id: '/ContextMenu', path: '/ContextMenu', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/ContextMenu.lazy').then((d) => d.Route)) const CommonFeaturesLazyRoute = CommonFeaturesLazyImport.update({ + id: '/CommonFeatures', path: '/CommonFeatures', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -123,6 +137,7 @@ const CommonFeaturesLazyRoute = CommonFeaturesLazyImport.update({ ) const ColumnsReorderingLazyRoute = ColumnsReorderingLazyImport.update({ + id: '/ColumnsReordering', path: '/ColumnsReordering', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -130,6 +145,7 @@ const ColumnsReorderingLazyRoute = ColumnsReorderingLazyImport.update({ ) const ColumnSpanningLazyRoute = ColumnSpanningLazyImport.update({ + id: '/ColumnSpanning', path: '/ColumnSpanning', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -137,6 +153,7 @@ const ColumnSpanningLazyRoute = ColumnSpanningLazyImport.update({ ) const ColumnGroupingLazyRoute = ColumnGroupingLazyImport.update({ + id: '/ColumnGrouping', path: '/ColumnGrouping', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -144,6 +161,7 @@ const ColumnGroupingLazyRoute = ColumnGroupingLazyImport.update({ ) const CellNavigationLazyRoute = CellNavigationLazyImport.update({ + id: '/CellNavigation', path: '/CellNavigation', getParentRoute: () => rootRoute, } as any).lazy(() => @@ -151,16 +169,19 @@ const CellNavigationLazyRoute = CellNavigationLazyImport.update({ ) const AnimationLazyRoute = AnimationLazyImport.update({ + id: '/Animation', path: '/Animation', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/Animation.lazy').then((d) => d.Route)) const AllFeaturesRoute = AllFeaturesImport.update({ + id: '/AllFeatures', path: '/AllFeatures', getParentRoute: () => rootRoute, } as any).lazy(() => import('./routes/AllFeatures.lazy').then((d) => d.Route)) const IndexRoute = IndexImport.update({ + id: '/', path: '/', getParentRoute: () => rootRoute, } as any) @@ -519,8 +540,6 @@ export const routeTree = rootRoute ._addFileChildren(rootRouteChildren) ._addFileTypes() -/* prettier-ignore-end */ - /* ROUTE_MANIFEST_START { "routes": {