mirror of
https://gitee.com/newgateway/vtj.git
synced 2026-06-23 19:53:25 +08:00
afcc737c1b
- 新增 compositionPatch 功能，实现 <script setup> 代码中标识符到 this.xxx 的自动转换 - 扩展全局 API map，新增 pinia 和 vue-i18n 相关全局变量支持与合并声明 - 增加 ScriptSetup 解析模块，完整解析 refs、reactives、computed、methods 等组成部分 - 修改 parseVue 实现，单点分流支持 Composition API 和 Options API 两种模式解析 - 修正工具函数，调整 props 替换逻辑，避免不必要的 this.props 访问替换 - 扩展 Vitest 测试用例，覆盖 Composition API 使用场景 - 增加对 defineProps、defineEmits、inject、provide 等新语法的支持与提取 - 优化 AST 遍历，准确识别 setup 函数内容及生命周期函数映射 - 添加全局 @vueuse/core 和自定义 composable 支持逻辑 - 规范代码结构，拆分解析细节并提升整体可维护性与扩展性
85 lines
2.6 KiB
TypeScript
85 lines
2.6 KiB
TypeScript
import { expect, test, describe } from 'vitest';
|
|
import { htmlToNodes } from '../src/vue/html';
|
|
|
|
describe('htmlToNodes', () => {
|
|
test('should parse simple HTML tag', () => {
|
|
const result = htmlToNodes('<div>Hello</div>');
|
|
expect(result.length).toBe(1);
|
|
expect(result[0].name).toBe('div');
|
|
expect(result[0].children).toBe('Hello');
|
|
});
|
|
|
|
test('should parse nested structure', () => {
|
|
const result = htmlToNodes('<div><span>text</span></div>');
|
|
expect(result.length).toBe(1);
|
|
expect(result[0].name).toBe('div');
|
|
expect(Array.isArray(result[0].children)).toBe(true);
|
|
const children = result[0].children as any[];
|
|
expect(children.length).toBe(1);
|
|
expect(children[0].name).toBe('span');
|
|
expect(children[0].children).toBe('text');
|
|
});
|
|
|
|
test('should parse attributes', () => {
|
|
const result = htmlToNodes(
|
|
'<div class="container" id="main">Content</div>'
|
|
);
|
|
expect(result.length).toBe(1);
|
|
expect(result[0].props).toBeDefined();
|
|
expect(result[0].props!['class']).toBe('container');
|
|
expect(result[0].props!['id']).toBe('main');
|
|
});
|
|
|
|
test('should parse self-closing tags', () => {
|
|
const result = htmlToNodes('<br/><img src="test.png"/>');
|
|
expect(result.length).toBe(2);
|
|
expect(result[0].name).toBe('br');
|
|
expect(result[1].name).toBe('img');
|
|
expect(result[1].props!['src']).toBe('test.png');
|
|
});
|
|
|
|
test('should convert style attribute to object', () => {
|
|
const result = htmlToNodes(
|
|
'<div style="color: red; font-size: 14px">Text</div>'
|
|
);
|
|
expect(result.length).toBe(1);
|
|
expect(result[0].props!.style).toEqual({
|
|
color: 'red',
|
|
'font-size': '14px'
|
|
});
|
|
});
|
|
|
|
test('should handle text nodes', () => {
|
|
const result = htmlToNodes('<p>Hello <strong>world</strong></p>');
|
|
expect(result.length).toBe(1);
|
|
const children = result[0].children as any[];
|
|
expect(children.length).toBeGreaterThan(0);
|
|
const strongChild = children.find(
|
|
(c: any) => c.name === 'strong' || c.name === 'Strong'
|
|
);
|
|
expect(strongChild).toBeDefined();
|
|
});
|
|
|
|
test('should parse complex HTML', () => {
|
|
const html = `<div class="wrapper">
|
|
<header id="header">
|
|
<nav><a href="/">Home</a></nav>
|
|
</header>
|
|
<main>
|
|
<section class="content">
|
|
<h1>Title</h1>
|
|
<p>Description</p>
|
|
</section>
|
|
</main>
|
|
</div>`;
|
|
const result = htmlToNodes(html);
|
|
expect(result.length).toBeGreaterThan(0);
|
|
expect(result[0].name).toBe('div');
|
|
});
|
|
|
|
test('should return empty array for empty string', () => {
|
|
const result = htmlToNodes('');
|
|
expect(result).toEqual([]);
|
|
});
|
|
});
|