chore: 移除 Playwright MCP 并添加 e2e 测试技能

Tevin

2 days ago fb6b8a6aecdc110fd700953f42396846165f93f1

 example/App.tsx

@@ -1,8 +1,80 @@
import { useState } from 'react';
import type { ReactNode } from 'react';
import { SideMenuPage } from './pages/side-menu/SideMenuPage';

/** 组件配置 */
const components: Array<{ name: string; path: string; component: ReactNode }> = [
  {
    name: 'CSideMenu',
    path: '/pages/side-menu/SideMenuPage.tsx',
    component: <SideMenuPage />,
  },
];

/**
 * 组件展示主页面
 * 左侧：组件列表
 * 右侧：iframe 展示组件示例
 */
function App() {
  const [activeIndex, setActiveIndex] = useState(0);

  return (
    <div style={{ padding: '20px' }}>
      <h1>admin2-components</h1>
      <p>组件展示示例（待开发）</p>
    <div style={{ display: 'table', width: '100%', height: '100vh' }}>
      {/* 左侧组件列表 */}
      <div
        style={{
          display: 'table-cell',
          width: '200px',
          borderRight: '1px solid #eee',
          padding: '16px',
          background: '#fafafa',
          verticalAlign: 'top',
        }}
      >
        <h3 style={{ marginTop: 0 }}>组件列表</h3>
        <ul style={{ listStyle: 'none', padding: 0, margin: 0 }}>
          {components.map((comp, index) => (
            <li key={comp.name} style={{ marginBottom: '8px' }}>
              <button
                onClick={() => setActiveIndex(index)}
                style={{
                  width: '100%',
                  padding: '8px 12px',
                  textAlign: 'left',
                  background: activeIndex === index ? '#1890ff' : '#fff',
                  color: activeIndex === index ? '#fff' : '#333',
                  border: '1px solid #d9d9d9',
                  borderRadius: '4px',
                  cursor: 'pointer',
                  fontSize: '14px',
                }}
              >
                {comp.name}
              </button>
            </li>
          ))}
        </ul>
      </div>

      {/* 右侧 iframe 容器 */}
      <div
        style={{
          display: 'table-cell',
          background: '#fff',
          verticalAlign: 'top',
        }}
      >
        <iframe
          src={`http://localhost:5173/#/preview/${components[activeIndex].path}`}
          style={{
            width: '100%',
            height: '100%',
            border: 'none',
          }}
          title={components[activeIndex].name}
        />
      </div>
    </div>
  );
}