31 lines
1.3 KiB
JavaScript
31 lines
1.3 KiB
JavaScript
// test/merging.test.js
|
|
window.testMerging = async function() {
|
|
const { Component, RefreshState, $ } = ApigoState;
|
|
console.log('Testing complex class/style merging (DataTable Resizer scenario)...');
|
|
|
|
Component.register('Resizer-Real', container => {
|
|
container.isVertical = true;
|
|
}, document.createRange().createContextualFragment('<div $class="tpl-static ${this.isVertical?\'tpl-v\':\'tpl-h\'}" $style="color:blue"></div>').firstChild);
|
|
|
|
document.body.innerHTML = '<Resizer-Real id="res-inst" class="ins-static" style="opacity:0.5"></Resizer-Real>';
|
|
RefreshState(document.documentElement);
|
|
await new Promise(r => setTimeout(r, 50));
|
|
|
|
const inst = $('#res-inst');
|
|
// Note: in current implementation, component root replaces the custom tag or merges?
|
|
// Based on base project usage, it merges into the tag.
|
|
|
|
const classList = Array.from(inst.classList);
|
|
console.log('Final ClassList:', classList);
|
|
if (!classList.includes('ins-static') || !classList.includes('tpl-static')) {
|
|
throw new Error('Class merging failed');
|
|
}
|
|
|
|
const style = inst.getAttribute('style');
|
|
console.log('Final Style:', style);
|
|
if (!style.includes('color: blue') && !style.includes('color:blue')) throw new Error('Style merging failed');
|
|
|
|
console.log('Merging test passed');
|
|
return true;
|
|
}
|