52 lines
1.9 KiB
JavaScript
52 lines
1.9 KiB
JavaScript
|
import { test, expect } from '@playwright/test';
|
||
|
|
|
||
|
|
test.describe('Mindmap Basic Functionality', () => {
|
||
|
|
test('should render the root and child nodes', async ({ page }) => {
|
||
|
|
await page.goto('/test/index.html');
|
||
|
|
const nodes = page.locator('.mindmap-node');
|
||
|
|
await expect(nodes).toHaveCount(3); // Root + 2 children
|
||
|
|
await expect(nodes.first()).toHaveText('思维导图核心');
|
||
|
|
});
|
||
|
|
|
||
|
|
test('should collapse and expand nodes on click', async ({ page }) => {
|
||
|
|
await page.goto('/test/index.html');
|
||
|
|
|
||
|
|
// Initial state: 3 nodes
|
||
|
|
await expect(page.locator('.mindmap-node')).toHaveCount(3);
|
||
|
|
|
||
|
|
// Click root to collapse
|
||
|
|
await page.locator('.mindmap-node').first().click();
|
||
|
|
await expect(page.locator('.mindmap-node')).toHaveCount(1);
|
||
|
|
|
||
|
|
// Click root to expand
|
||
|
|
await page.locator('.mindmap-node').first().click();
|
||
|
|
await expect(page.locator('.mindmap-node')).toHaveCount(3);
|
||
|
|
});
|
||
|
|
|
||
|
|
test('performance benchmark: 1000 nodes render', async ({ page }) => {
|
||
|
|
await page.goto('/test/index.html');
|
||
|
|
const renderTime = await page.evaluate(() => {
|
||
|
|
const generateTree = (depth, breadth) => {
|
||
|
|
if (depth === 0) return { text: 'Leaf' };
|
||
|
|
const children = [];
|
||
|
|
for (let i = 0; i < breadth; i++) {
|
||
|
|
children.push(generateTree(depth - 1, breadth));
|
||
|
|
}
|
||
|
|
return { text: `Node ${depth}`, children };
|
||
|
|
};
|
||
|
|
|
||
|
|
const largeData = generateTree(3, 10); // 1 + 10 + 100 + 1000 = 1111 nodes
|
||
|
|
const container = document.getElementById('app');
|
||
|
|
container.innerHTML = '';
|
||
|
|
|
||
|
|
const start = performance.now();
|
||
|
|
const { Mindmap } = window.testExports; // I need to expose Mindmap to window for this
|
||
|
|
new Mindmap({ container, data: largeData });
|
||
|
|
document.body.offsetHeight;
|
||
|
|
return performance.now() - start;
|
||
|
|
});
|
||
|
|
console.log(`1000 nodes render time: ${renderTime}ms`);
|
||
|
|
expect(renderTime).toBeLessThan(500);
|
||
|
|
});
|
||
|
|
});
|