feat: single AI action button with inline prompt; replace cell source

This commit is contained in:
tao.chen
2026-07-23 12:47:47 +08:00
parent d03f0fa434
commit 85e16914b5
3 changed files with 196 additions and 97 deletions
+59 -42
View File
@@ -1,12 +1,12 @@
/**
* Unit tests for OpenCodeCellActions DOM rendering and button disabled states.
* Unit tests for OpenCodeCellActions (single AI button) and OpenCodeInlinePrompt
* (inline input panel inside the cell).
*
* Mocks @jupyterlab/cells, @jupyterlab/apputils, and @lumino/widgets at the
* test boundary so the real ESM packages are not loaded (Jest + pnpm can't
* transform the hoisted @jupyterlab/* packages out of the box).
* test boundary so the real ESM packages are not loaded.
*/
jest.mock('@jupyterlab/cells', () => ({
CodeCell: class CodeCell {}
CodeCell: class CodeCell { public node = document.createElement('div'); }
}));
jest.mock('@jupyterlab/apputils', () => ({
@@ -32,12 +32,22 @@ jest.mock('@lumino/widgets', () => {
}
public dispose(): void {
this._isDisposed = true;
if (this.node.parentElement) {
this.node.parentElement.removeChild(this.node);
}
}
public onAfterAttach(msg: any): void {
// no-op for tests
}
public static attach(widget: Widget, host: HTMLElement): void {
host.appendChild(widget.node);
}
}
return { Widget };
});
import { OpenCodeCellActions } from '../components/opencode_cell_actions';
import { OpenCodeInlinePrompt } from '../components/opencode_inline_prompt';
import { CodeCell } from '@jupyterlab/cells';
function makeFakeOutputs(items: any[]): any {
@@ -62,7 +72,8 @@ function makeFakeCell(
id: 'cell-test',
type: 'code',
sharedModel: {
getSource: () => source
getSource: () => source,
setSource: jest.fn()
},
outputs: makeFakeOutputs(errorOutputs),
contentChanged: { connect: jest.fn(), disconnect: jest.fn() },
@@ -71,8 +82,6 @@ function makeFakeCell(
const cell = new (CodeCell as unknown as new () => CodeCell)();
(cell as any).model = model;
// Parent chain: cell -> notebook -> panel (mirrors real JupyterLab, where
// the cell's grandparent Notebook matches the duck-typed panel lookup).
const notebook: any = { widgets: [] as CodeCell[] };
const panel: any = {
context: { path: notebookPath },
@@ -103,61 +112,56 @@ function makeFakeCell(
}
describe('OpenCodeCellActions', () => {
it('renders 3 buttons with the expected labels', () => {
it('renders a single AI button (not 3 buttons)', () => {
const cell = makeFakeCell('x = 1');
const actions = new OpenCodeCellActions(cell);
const btns = actions.node.querySelectorAll('button');
expect(btns.length).toBe(3);
expect(btns[0].textContent).toBe('✨ 优化');
expect(btns[1].textContent).toBe('🐛 排错');
expect(btns[2].textContent).toBe('🪄 编辑');
expect(btns.length).toBe(1);
expect(btns[0].textContent).toContain('🪄');
});
it('disables all buttons when the notebook panel cannot be resolved', () => {
it('disables the button when notebook panel cannot be resolved', () => {
const cell = new (CodeCell as unknown as new () => CodeCell)();
(cell as any).model = {
id: 'orphan',
type: 'code',
sharedModel: { getSource: () => 'x = 1' },
sharedModel: { getSource: () => 'x = 1', setSource: jest.fn() },
outputs: makeFakeOutputs([]),
contentChanged: { connect: jest.fn(), disconnect: jest.fn() },
stateChanged: { connect: jest.fn(), disconnect: jest.fn() }
};
// No parent chain: extractCellContextFromCell must return null.
const actions = new OpenCodeCellActions(cell);
const btns = actions.node.querySelectorAll('button');
btns.forEach((b: HTMLButtonElement) => {
expect(b.disabled).toBe(true);
});
const btn = actions.node.querySelector('button') as HTMLButtonElement;
expect(btn.disabled).toBe(true);
});
it('enables optimize and edit; fix stays disabled without an error', () => {
const cell = makeFakeCell('x = 1', [], 'foo.ipynb', 0, 1);
it('clicking the button attaches an OpenCodeInlinePrompt to the cell', () => {
const cell = makeFakeCell('x = 1');
const actions = new OpenCodeCellActions(cell);
const btns = actions.node.querySelectorAll('button');
expect((btns[0] as HTMLButtonElement).disabled).toBe(false);
expect((btns[1] as HTMLButtonElement).disabled).toBe(true);
expect((btns[2] as HTMLButtonElement).disabled).toBe(false);
// Attach actions to cell so it can resolve parent chain
Object.defineProperty(actions, 'parent', { value: cell, configurable: true });
(actions as any).onAfterAttach({} as any);
const btn = actions.node.querySelector('button') as HTMLButtonElement;
btn.click();
const prompt = cell.node.querySelector(
'.opencode-inline-prompt'
) as HTMLElement;
expect(prompt).not.toBeNull();
});
it('enables the fix button when the cell has an error output', () => {
const cell = makeFakeCell(
'1/0',
[
{
type: 'error',
ename: 'ZeroDivisionError',
evalue: 'div by zero',
traceback: []
}
],
'foo.ipynb',
0,
1
);
it('clicking the button twice detaches the inline prompt', () => {
const cell = makeFakeCell('x = 1');
const actions = new OpenCodeCellActions(cell);
const btns = actions.node.querySelectorAll('button');
expect((btns[1] as HTMLButtonElement).disabled).toBe(false);
Object.defineProperty(actions, 'parent', { value: cell, configurable: true });
(actions as any).onAfterAttach({} as any);
const btn = actions.node.querySelector('button') as HTMLButtonElement;
btn.click();
btn.click();
const prompt = cell.node.querySelector('.opencode-inline-prompt');
expect(prompt).toBeNull();
});
it('disconnects model signals on dispose', () => {
@@ -169,3 +173,16 @@ describe('OpenCodeCellActions', () => {
expect(model.stateChanged.disconnect).toHaveBeenCalled();
});
});
describe('OpenCodeInlinePrompt', () => {
it('renders a textarea, a send and a cancel button', () => {
const cell = makeFakeCell('x = 1');
const prompt = new OpenCodeInlinePrompt(cell, {
onSubmit: jest.fn(),
onCancel: jest.fn(),
disabled: false
});
expect(prompt.node.querySelector('textarea')).not.toBeNull();
expect(prompt.node.querySelectorAll('button').length).toBe(2);
});
});