121 lines
4.6 KiB
HTML
121 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<title>Windychen Utils - 浏览器测试</title>
|
||
<style>
|
||
body { font-family: monospace; padding: 20px; background: #1a1a2e; color: #eee; }
|
||
.pass { color: #4ade80; }
|
||
.fail { color: #f87171; }
|
||
.group { margin: 16px 0; font-weight: bold; color: #60a5fa; }
|
||
h1 { border-bottom: 2px solid #3b82f6; padding-bottom: 10px; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<h1>Windychen Utils 测试结果</h1>
|
||
<div id="output"></div>
|
||
|
||
<script src="dist/windychen-utils.js"></script>
|
||
<script>
|
||
const $ = document.getElementById.bind(document);
|
||
let passed = 0, failed = 0;
|
||
|
||
function assert(desc, condition) {
|
||
const el = document.createElement('div');
|
||
el.className = condition ? 'pass' : 'fail';
|
||
el.textContent = `${condition ? '✓' : '✗'} ${desc}`;
|
||
$('output').appendChild(el);
|
||
condition ? passed++ : failed++;
|
||
}
|
||
|
||
function group(name) {
|
||
const el = document.createElement('div');
|
||
el.className = 'group';
|
||
el.textContent = `\n─── ${name} ───`;
|
||
$('output').appendChild(el);
|
||
}
|
||
|
||
// ===== Object.getPro 测试 =====
|
||
group('Object.getPro');
|
||
const obj = { a: { b: { c: 1 } }, 'x.y': { z: 2 } };
|
||
|
||
assert("getPro('a.b.c') === 1", obj.getPro('a.b.c') === 1);
|
||
assert("getPro('a.b.d', 'default') === 'default'", obj.getPro('a.b.d', 'default') === 'default');
|
||
assert("getPro(\"['x.y'].z\") === 2", obj.getPro("['x.y'].z") === 2);
|
||
assert("getPro('missing', 42) === 42", obj.getPro('missing', 42) === 42);
|
||
|
||
// ===== Object.setPro 测试 =====
|
||
group('Object.setPro');
|
||
const obj2 = {};
|
||
obj2.setPro('foo.bar.baz', 'hello');
|
||
assert("setPro 嵌套赋值", obj2.foo.bar.baz === 'hello');
|
||
|
||
obj2.setPro("['a.b'].c", 99);
|
||
assert("setPro 特殊键名", obj2['a.b'].c === 99);
|
||
|
||
// ===== Object.getTypeString 测试 =====
|
||
group('Object.getTypeString');
|
||
assert("getTypeString('hello') === 'String'", Object.getTypeString('hello') === 'String');
|
||
assert("getTypeString(123) === 'Number'", Object.getTypeString(123) === 'Number');
|
||
assert("getTypeString([1,2]) === 'Array'", Object.getTypeString([1,2]) === 'Array');
|
||
assert("getTypeString(null) === 'Null'", Object.getTypeString(null) === 'Null');
|
||
assert("getTypeString(undefined) === 'Undefined'", Object.getTypeString(undefined) === 'Undefined');
|
||
assert("getTypeString({}) === 'Object'", Object.getTypeString({}) === 'Object');
|
||
assert("getTypeString(true) === 'Boolean'", Object.getTypeString(true) === 'Boolean');
|
||
|
||
// ===== Array.findPro 测试 =====
|
||
group('Array.findPro');
|
||
const arr = [
|
||
{ user: { name: 'Alice' } },
|
||
{ user: { name: 'Bob' } },
|
||
null,
|
||
{ user: { name: 'Charlie' } },
|
||
];
|
||
|
||
assert("findPro 回调", [1, 2, 3].findPro(t => t > 1) === 2);
|
||
assert("findPro key-value", arr.findPro('user.name', 'Bob')?.user?.name === 'Bob');
|
||
assert("findPro 单值", ['aa', 'bb', 'cc'].findPro('cc') === 'cc');
|
||
|
||
// ===== Array.filterPro 测试 =====
|
||
group('Array.filterPro');
|
||
assert("filterPro key-value", arr.filterPro('user.name', 'Alice').length === 1);
|
||
assert("filterPro 单值", [1, 2, 2, 3].filterPro(2).length === 2);
|
||
|
||
// ===== Array.findIndexPro 测试 =====
|
||
group('Array.findIndexPro');
|
||
assert("findIndexPro", arr.findIndexPro('user.name', 'Charlie') === 3);
|
||
|
||
// ===== Array.findLastPro 测试 =====
|
||
group('Array.findLastPro');
|
||
assert("findLastPro", arr.findLastPro('user.name', 'Bob')?.user?.name === 'Bob');
|
||
|
||
// ===== Array.somePro / everyPro 测试 =====
|
||
group('Array.somePro / everyPro');
|
||
assert("somePro", arr.somePro('user.name', 'Alice'));
|
||
assert("everyPro", !arr.everyPro('user.name', 'Alice'));
|
||
|
||
// ===== Storage 测试 =====
|
||
group('Storage');
|
||
const storage = new window.IStorage();
|
||
assert("IStorage 实例存在", storage != null);
|
||
|
||
(async function () {
|
||
await storage.set('test_key', { data: 123, name: 'hello' });
|
||
assert("storage.set 执行成功", true);
|
||
|
||
const val = await storage.get('test_key', null);
|
||
assert("storage.get 返回值正确", val && val.data === 123 && val.name === 'hello');
|
||
|
||
const missing = await storage.get('_not_exist_', 'default');
|
||
assert("storage.get 缺失键返回默认值", missing === 'default');
|
||
|
||
// 汇总
|
||
const summary = document.createElement('h2');
|
||
summary.style.marginTop = '20px';
|
||
summary.innerHTML = `共 ${passed + failed} 项,<span class="pass">${passed} 通过</span>,<span class="fail">${failed} 失败</span>`;
|
||
$('output').appendChild(summary);
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|