[WIP] Add tests for object table and reporting components by Copilot · Pull Request #309 · objectstack-ai/objectui

Copilot · 2026-01-31T18:34:33Z

Extend MSW Testing Infrastructure

Building on PR #308, extend test coverage to additional components and server-driven definitions:

Test Results Summary

Overall: 23/38 tests passing (60.5%) 📊

Passing:

✅ MSW Server Integration: 2/2 tests
✅ Server-Driven Definitions: 9/11 tests (App layout, Page defs, Component composition)
✅ Dashboard Integration: 4/6 tests (Layout rendering, widgets, server data)
✅ Static Data tests: 8/8 tests

Remaining Issues:

⏱️ ObjectGrid tests: 8/8 timeout (need dataSource integration fix)
⚠️ Dashboard tests: 2 tests fail on duplicate text matching
⚠️ ObjectForm tests: 5 pre-existing failures (not part of this PR's scope)

Original prompt

拉取请求: #308

相同的架构我还要测试对象表格，报表等组件，还需要测试从服务端传回的app布局定义，page定义，dashboard定义等。

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

vercel · 2026-01-31T18:34:38Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
objectui	Ready	Preview, Comment	Jan 31, 2026 6:58pm
objectui-components	Ready	Preview, Comment	Jan 31, 2026 6:58pm
objectui-crm-app	Error		Jan 31, 2026 6:58pm

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

Copilot

Pull request overview

This PR extends the MSW (Mock Service Worker) testing infrastructure established in PR #308 to cover additional ObjectUI components and server-driven definitions. It adds comprehensive test suites for ObjectGrid, Dashboard, and various server-driven layout schemas (app, page, and component composition).

Changes:

Adds three new test files covering ObjectGrid CRUD operations, Dashboard widgets, and server-driven schema definitions
Updates package dependencies to include @object-ui/components, @object-ui/plugin-dashboard, and @object-ui/plugin-grid
Configures component registration in vitest.setup.ts to ensure all necessary components (div, text, grid, dashboard) are available during tests
Updates build configuration to include plugin-dashboard in the pretest build step

Reviewed changes

Copilot reviewed 6 out of 7 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
pnpm-lock.yaml	Adds workspace dependencies for components, plugin-dashboard, and plugin-grid packages to the msw-object-form example
package.json	Adds packageManager field and includes plugin-dashboard in pretest build script
vitest.setup.ts	Imports component packages to register div, text, grid, and dashboard components for testing
ServerDefinitions.test.tsx	Tests server-driven app layouts, page definitions, and nested component composition using SchemaRenderer
ObjectGrid.test.tsx	Tests ObjectGrid rendering, column configuration, CRUD operations, and data loading (contains critical initialization bug)
Dashboard.test.tsx	Tests Dashboard layout rendering, widget components, and data-driven metrics

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

Copilot · 2026-01-31T18:53:30Z

+
+import { describe, it, expect, beforeAll, afterAll, vi } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';


The userEvent import is unused. This import should be removed unless you plan to add user interaction tests (e.g., clicking buttons, selecting rows) in the near future.

Suggested change

import userEvent from '@testing-library/user-event';

Copilot · 2026-01-31T18:53:30Z

+import { render, screen, waitFor } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { SchemaRenderer } from '@object-ui/react';
+import type { AppSchema, PageSchema } from '@object-ui/types';


The PageSchema import is unused. It should be removed to keep imports clean.

Suggested change

import type { AppSchema, PageSchema } from '@object-ui/types';

import type { AppSchema } from '@object-ui/types';

Copilot · 2026-01-31T18:53:31Z

+
+      // Get actual data from server
+      const contacts = await driver!.find('contact', {});


Using the non-null assertion operator (!) on getDriver() is unsafe. If the driver is null for any reason (e.g., server initialization fails), this will cause a runtime error.

Consider adding a null check:

const driver = getDriver(); if (!driver) { throw new Error('Driver not initialized'); } const contacts = await driver.find('contact', {});

This makes the test more robust and provides clearer error messages if something goes wrong during setup.

Suggested change

// Get actual data from server

const contacts = await driver!.find('contact', {});

if (!driver) {

throw new Error('Driver not initialized');

}

// Get actual data from server

const contacts = await driver.find('contact', {});

Copilot · 2026-01-31T18:53:31Z

+
+describe('ObjectGrid MSW Integration', () => {
+  let dataSource: ObjectStackDataSource;
+
+  beforeAll(async () => {
+    await startMockServer();
+    dataSource = new ObjectStackDataSource();


The ObjectStackDataSource constructor requires a client parameter but is being instantiated without arguments. This will cause a runtime error when the dataSource tries to access the client.

Looking at the working ObjectForm tests in the same directory, you need to:

Declare a client: ObjectStackClient variable

Initialize it in beforeAll with new ObjectStackClient({ baseUrl: 'http://localhost:3000' }) and call await client.connect()

Pass it to the dataSource: dataSource = new ObjectStackDataSource(client)

Reference: examples/msw-object-form/src/tests/ObjectForm.test.tsx:25-28

Suggested change

describe('ObjectGrid MSW Integration', () => {

let dataSource: ObjectStackDataSource;

beforeAll(async () => {

await startMockServer();

dataSource = new ObjectStackDataSource();

import { ObjectStackClient } from '@objectstack/client';

describe('ObjectGrid MSW Integration', () => {

let dataSource: ObjectStackDataSource;

let client: ObjectStackClient;

beforeAll(async () => {

await startMockServer();

client = new ObjectStackClient({ baseUrl: 'http://localhost:3000' });

await client.connect();

dataSource = new ObjectStackDataSource(client);

Copilot · 2026-01-31T18:53:31Z

+    it('should trigger onDelete callback', async () => {
+      const onDelete = vi.fn();
+
+      render(
+        <ObjectGrid
+          schema={{
+            type: 'object-grid',
+            objectName: 'contact',
+            columns: ['name', 'email'],
+            actions: true,
+          }}
+          dataSource={dataSource}
+          onDelete={onDelete}
+        />
+      );
+
+      await waitFor(() => {
+        expect(screen.getByText('John Doe')).toBeInTheDocument();
+      }, { timeout: 5000 });
+
+      // Look for delete buttons (implementation-specific)
+      // This is a placeholder for when delete actions are implemented
+    });


This test is incomplete - it renders the grid with delete callback but doesn't actually test that clicking a delete button triggers the callback. The comment "This is a placeholder for when delete actions are implemented" indicates this is work in progress.

To complete this test, you should:

Find and click a delete button in the rendered grid

Verify that onDelete was called with the expected record data

Alternatively, if delete actions are not yet implemented in ObjectGrid, consider skipping this test with it.skip() or it.todo() to clearly indicate it's not yet functional.

Copilot · 2026-01-31T18:53:31Z

+    it('should show loading state initially', async () => {
+      const { container } = render(
+        <ObjectGrid
+          schema={{
+            type: 'object-grid',
+            objectName: 'contact',
+            columns: ['name', 'email'],
+          }}
+          dataSource={dataSource}
+        />
+      );
+
+      // Check for loading indicator (implementation-specific)
+      // The grid should eventually show data
+      await waitFor(() => {
+        expect(screen.getByText('John Doe')).toBeInTheDocument();
+      }, { timeout: 5000 });
+    });


This test claims to check for a loading state but doesn't actually verify that a loading indicator appears. It only waits for the data to eventually load. The comment "Check for loading indicator (implementation-specific)" suggests this is incomplete.

To properly test loading states, you should:

Check for a loading indicator immediately after render (before data loads)

Then verify the loading indicator disappears and data appears

If the ObjectGrid component doesn't currently show a loading state, consider marking this test with it.skip() or it.todo(), or rename it to better reflect what it actually tests (e.g., "should eventually load and display data").

Copilot · 2026-01-31T18:53:31Z

+
+describe('ObjectGrid MSW Integration', () => {
+  let dataSource: ObjectStackDataSource;
+
+  beforeAll(async () => {
+    await startMockServer();
+    dataSource = new ObjectStackDataSource();


Missing import for ObjectStackClient. The ObjectStackDataSource requires an ObjectStackClient instance to be passed to its constructor.

Add this import:

import { ObjectStackClient } from '@objectstack/client';

Reference: examples/msw-object-form/src/tests/ObjectForm.test.tsx:11

Suggested change

describe('ObjectGrid MSW Integration', () => {

let dataSource: ObjectStackDataSource;

beforeAll(async () => {

await startMockServer();

dataSource = new ObjectStackDataSource();

import { ObjectStackClient } from '@objectstack/client';

describe('ObjectGrid MSW Integration', () => {

let dataSource: ObjectStackDataSource;

beforeAll(async () => {

await startMockServer();

const client = new ObjectStackClient();

dataSource = new ObjectStackDataSource(client);

Copilot · 2026-01-31T18:53:32Z

+    it('should support row selection', async () => {
+      const onRowSelect = vi.fn();
+
+      render(
+        <ObjectGrid
+          schema={{
+            type: 'object-grid',
+            objectName: 'contact',
+            columns: ['name', 'email'],
+            enableSelection: true,
+          }}
+          dataSource={dataSource}
+          onRowSelect={onRowSelect}
+        />
+      );
+
+      await waitFor(() => {
+        expect(screen.getByText('John Doe')).toBeInTheDocument();
+      }, { timeout: 5000 });
+
+      // Note: Row selection UI depends on the actual grid implementation
+      // This is a placeholder for when selection is implemented
+    });


This test is incomplete - it renders the grid with row selection enabled and waits for data to load, but doesn't actually verify that row selection works. The comment "This is a placeholder for when selection is implemented" indicates this is work in progress.

To complete this test, you should:

Find and click on a row selection checkbox/control

Verify that onRowSelect was called with the expected data

Verify visual feedback for the selected row

Alternatively, if row selection is not yet implemented in ObjectGrid, consider skipping this test with it.skip() or it.todo() to clearly indicate it's not yet functional.

Copilot · 2026-01-31T18:53:32Z

+    it('should trigger onEdit callback', async () => {
+      const onEdit = vi.fn();
+
+      render(
+        <ObjectGrid
+          schema={{
+            type: 'object-grid',
+            objectName: 'contact',
+            columns: ['name', 'email'],
+            actions: true,
+          }}
+          dataSource={dataSource}
+          onEdit={onEdit}
+        />
+      );
+
+      await waitFor(() => {
+        expect(screen.getByText('John Doe')).toBeInTheDocument();
+      }, { timeout: 5000 });
+
+      // Look for edit buttons (implementation-specific)
+      // This is a placeholder for when edit actions are implemented
+    });


This test is incomplete - it renders the grid with edit callback but doesn't actually test that clicking an edit button triggers the callback. The comment "This is a placeholder for when edit actions are implemented" indicates this is work in progress.

To complete this test, you should:

Find and click an edit button in the rendered grid

Verify that onEdit was called with the expected record data

Alternatively, if edit actions are not yet implemented in ObjectGrid, consider skipping this test with it.skip() or it.todo() to clearly indicate it's not yet functional.

Initial plan

0227e56

Copilot AI assigned Copilot and hotlong Jan 31, 2026

vercel Bot deployed to Preview – objectui-components January 31, 2026 18:37 View deployment

Copilot started work on behalf of hotlong January 31, 2026 18:39 View session

vercel Bot deployed to Preview – objectui January 31, 2026 18:40 View deployment

vercel Bot had a problem deploying to Preview – objectui-crm-app January 31, 2026 18:40 Failure

Add MSW test suites for Grid, Dashboard, and Server-Driven layouts

8214fe6

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

vercel Bot deployed to Preview – objectui-components January 31, 2026 18:47 View deployment

vercel Bot had a problem deploying to Preview – objectui-crm-app January 31, 2026 18:47 Failure

hotlong marked this pull request as ready for review January 31, 2026 18:48

Copilot AI review requested due to automatic review settings January 31, 2026 18:48

Fix component registration in test environment

2309467

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

hotlong merged commit 1d4f33a into main Jan 31, 2026
4 of 7 checks passed

Copilot started reviewing on behalf of hotlong January 31, 2026 18:48 View session

Copilot AI requested a review from hotlong January 31, 2026 18:48

Copilot stopped work on behalf of hotlong due to an error January 31, 2026 18:48
The session was cancelled by the user.

Copilot AI reviewed Jan 31, 2026

View reviewed changes

vercel Bot had a problem deploying to Preview – objectui-crm-app January 31, 2026 18:54 Failure

vercel Bot deployed to Preview – objectui January 31, 2026 18:57 View deployment

vercel Bot deployed to Preview – objectui-components January 31, 2026 18:58 View deployment

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[WIP] Add tests for object table and reporting components#309

[WIP] Add tests for object table and reporting components#309
hotlong merged 3 commits intomainfrom
copilot/test-object-table-and-components

Copilot AI commented Jan 31, 2026 •

edited

Loading

Uh oh!

vercel Bot commented Jan 31, 2026 •

edited

Loading

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Copilot AI Jan 31, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

	import type { AppSchema, PageSchema } from '@object-ui/types';
	import type { AppSchema } from '@object-ui/types';


		// Get actual data from server
		const contacts = await driver!.find('contact', {});

Conversation

Copilot AI commented Jan 31, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Extend MSW Testing Infrastructure

Test Results Summary

Passing:

Remaining Issues:

Uh oh!

vercel Bot commented Jan 31, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 31, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Copilot AI commented Jan 31, 2026 •

edited

Loading

vercel Bot commented Jan 31, 2026 •

edited

Loading