diff --git a/.changeset/swift-eels-drum.md b/.changeset/swift-eels-drum.md
new file mode 100644
index 0000000..6c09ea8
--- /dev/null
+++ b/.changeset/swift-eels-drum.md
@@ -0,0 +1,5 @@
+---
+'@ciolabs/html-mod': patch
+---
+
+Update experimental version to have same API as standard
diff --git a/packages/html-mod/src/experimental/auto-flush-edge-cases.test.ts b/packages/html-mod/src/experimental/auto-flush-edge-cases.test.ts
index abcbc1d..cc982ca 100644
--- a/packages/html-mod/src/experimental/auto-flush-edge-cases.test.ts
+++ b/packages/html-mod/src/experimental/auto-flush-edge-cases.test.ts
@@ -1,7 +1,8 @@
/* eslint-disable unicorn/prefer-dom-node-dataset */
+import { SourceText } from '@ciolabs/htmlparser2-source';
import { describe, expect, test } from 'vitest';
-import { HtmlMod, HtmlModElement, HtmlModText } from './index';
+import { HtmlMod, HtmlModText } from './index';
describe('Auto-Flush Edge Cases - Aggressive Testing', () => {
describe('Chained Modifications with Queries', () => {
@@ -256,16 +257,10 @@ describe('Auto-Flush Edge Cases - Aggressive Testing', () => {
const html = new HtmlMod('
');
const p = html.querySelector('p')!;
- const pText = p.children[0];
- if (pText instanceof HtmlModText) {
- pText.textContent = 'modified-text1';
- }
+ p.textContent = 'modified-text1';
const span = html.querySelector('span')!;
- const spanText = span.children[0];
- if (spanText instanceof HtmlModText) {
- spanText.textContent = 'modified-text2';
- }
+ span.textContent = 'modified-text2';
expect(html.querySelector('p')!.textContent).toBe('modified-text1');
expect(html.querySelector('span')!.textContent).toBe('modified-text2');
@@ -771,21 +766,19 @@ describe('Auto-Flush Edge Cases - Aggressive Testing', () => {
const html = new HtmlMod('text1middletext2
');
const div = html.querySelector('div')!;
- // Get all text nodes
const children = div.children;
- const textNodes = children.filter(child => child instanceof HtmlModText) as HtmlModText[];
+ const textNodes = children
+ .filter(child => child.type === 'text')
+ .map(child => new HtmlModText(child as SourceText, html));
expect(textNodes.length).toBe(2);
- // Modify first text node
textNodes[0].textContent = 'modified1';
expect(html.toString()).toBe('modified1middletext2
');
- // Modify second text node
textNodes[1].textContent = 'modified2';
expect(html.toString()).toBe('modified1middlemodified2
');
- // Modify first again
textNodes[0].textContent = 'final1';
expect(html.toString()).toBe('final1middlemodified2
');
});
@@ -1829,11 +1822,9 @@ describe('Auto-Flush Edge Cases - Aggressive Testing', () => {
expect(children.length).toBe(3);
- // Modify through children array
- const firstChild = children[0];
- if (firstChild instanceof HtmlModElement) {
- firstChild.innerHTML = 'modified';
- }
+ const firstChild = html.querySelectorAll('p')[0];
+ firstChild.innerHTML = 'modified';
+
expect(html.querySelectorAll('p')[0].innerHTML).toBe('modified');
});
@@ -1864,12 +1855,10 @@ describe('Auto-Flush Edge Cases - Aggressive Testing', () => {
const div = html.querySelector('div')!;
div.setAttribute('class', 'parent');
- const children = div.children;
- const firstChild = children[0];
- if (firstChild instanceof HtmlModElement) {
- firstChild.innerHTML = 'modified';
- }
+ const firstChildElement = html.querySelector('p')!;
+ firstChildElement.innerHTML = 'modified';
+
expect(html.toString()).toBe('');
});
@@ -1882,13 +1871,9 @@ describe('Auto-Flush Edge Cases - Aggressive Testing', () => {
test('should remove child through children array', () => {
const html = new HtmlMod('');
- const div = html.querySelector('div')!;
- const children = div.children;
- const secondChild = children[1];
- if (secondChild instanceof HtmlModElement) {
- secondChild.remove();
- }
+ const paragraphs = html.querySelectorAll('p');
+ paragraphs[1].remove();
expect(html.querySelectorAll('p').length).toBe(2);
expect(html.querySelectorAll('p')[0].innerHTML).toBe('1');
diff --git a/packages/html-mod/src/experimental/index.ts b/packages/html-mod/src/experimental/index.ts
index 817ea9d..8181964 100644
--- a/packages/html-mod/src/experimental/index.ts
+++ b/packages/html-mod/src/experimental/index.ts
@@ -510,19 +510,8 @@ export class HtmlModElement {
);
}
- get children(): (HtmlModElement | HtmlModText)[] {
- this.__htmlMod.__ensureFlushed();
- return this.__element.children
- .map(child => {
- if (child.type === 'text') {
- return new this.__htmlMod.__HtmlModText(child as unknown as SourceText, this.__htmlMod);
- } else if (child.type === 'tag') {
- return new this.__htmlMod.__HtmlModElement(child as unknown as SourceElement, this.__htmlMod);
- }
- // For other node types (comments, etc.), skip them for now
- return null;
- })
- .filter((child): child is HtmlModElement | HtmlModText => child !== null);
+ get children() {
+ return this.__element.children;
}
get parent(): HtmlModElement | null {