@tkeron/html-parser 0.1.4 → 0.1.5

package/tests/official/html5lib/tokenizer.test.ts

@@ -5,7 +5,7 @@ import {
   type HTML5libTokenizerTestSuite
 } from './tokenizer-utils';
 
-// Sample HTML5lib tokenizer tests embedded directly
+
 const basicTokenizerTests: HTML5libTokenizerTestSuite = {
   "tests": [
     {
@@ -86,7 +86,7 @@ const basicTokenizerTests: HTML5libTokenizerTestSuite = {
   ]
 };
 
-// Entity tests
+
 const entityTests: HTML5libTokenizerTestSuite = {
   "tests": [
     {
@@ -123,7 +123,7 @@ const entityTests: HTML5libTokenizerTestSuite = {
   ]
 };
 
-// Comment tests
+
 const commentTests: HTML5libTokenizerTestSuite = {
   "tests": [
     {
@@ -163,7 +163,7 @@ const commentTests: HTML5libTokenizerTestSuite = {
   ]
 };
 
-// Run the embedded tests
+
 describe('HTML5lib Tokenizer Tests', () => {
   runHTML5libTokenizerTestSuite(basicTokenizerTests, 'Basic Tokenizer');
   runHTML5libTokenizerTestSuite(entityTests, 'Entity Handling');

package/tests/official/html5lib/tree-construction-utils.ts

@@ -3,7 +3,7 @@ import { parse } from '../../../src/parser';
 import { tokenize } from '../../../src/tokenizer';
 import type { ASTNode } from '../../../src/parser';
 
-// HTML5lib tree construction test format
+
 export interface HTML5libTreeTest {
   data: string;
   errors: string[];
@@ -14,9 +14,7 @@ export interface HTML5libTreeTest {
   document: string;
 }
 
-/**
- * Parses HTML5lib DAT format test files
- */
+
 export function parseHTML5libDATFile(content: string): HTML5libTreeTest[] {
   const tests: HTML5libTreeTest[] = [];
   const sections = content.split('\n\n').filter(section => section.trim());
@@ -24,7 +22,7 @@ export function parseHTML5libDATFile(content: string): HTML5libTreeTest[] {
   for (const section of sections) {
     const lines = section.split('\n');
     const test: Partial<HTML5libTreeTest> = {
-      errors: [] // Initialize errors as empty array
+      errors: [] 
     };
     
     let currentSection = '';
@@ -32,7 +30,7 @@ export function parseHTML5libDATFile(content: string): HTML5libTreeTest[] {
     
     for (const line of lines) {
       if (line.startsWith('#')) {
-        // Save previous section
+        
         if (currentSection) {
           switch (currentSection) {
             case 'data':
@@ -53,11 +51,11 @@ export function parseHTML5libDATFile(content: string): HTML5libTreeTest[] {
           }
         }
         
-        // Start new section
+        
         currentSection = line.substring(1);
         currentContent = [];
         
-        // Handle script flags
+        
         if (currentSection === 'script-off') {
           test.scriptOff = true;
         } else if (currentSection === 'script-on') {
@@ -68,7 +66,7 @@ export function parseHTML5libDATFile(content: string): HTML5libTreeTest[] {
       }
     }
     
-    // Save last section
+    
     if (currentSection) {
       switch (currentSection) {
         case 'data':
@@ -97,16 +95,14 @@ export function parseHTML5libDATFile(content: string): HTML5libTreeTest[] {
   return tests;
 }
 
-/**
- * Converts AST to HTML5lib tree format
- */
+
 export function convertASTToHTML5libTree(node: ASTNode, depth: number = 0): string[] {
   const lines: string[] = [];
   const indent = '| ' + '  '.repeat(depth);
   
   switch (node.type) {
     case 'DOCUMENT':
-      // Document node doesn't have a line representation
+      
       break;
     case 'DOCTYPE':
       lines.push(`${indent}<!DOCTYPE ${node.tagName || 'html'}>`);
@@ -115,7 +111,7 @@ export function convertASTToHTML5libTree(node: ASTNode, depth: number = 0): stri
       const tagName = node.tagName || 'unknown';
       lines.push(`${indent}<${tagName}>`);
       
-      // Add attributes
+      
       if (node.attributes) {
         for (const [name, value] of Object.entries(node.attributes).sort()) {
           lines.push(`${indent}  ${name}="${value}"`);
@@ -135,7 +131,7 @@ export function convertASTToHTML5libTree(node: ASTNode, depth: number = 0): stri
       break;
   }
   
-  // Add children
+  
   if (node.children) {
     for (const child of node.children) {
       lines.push(...convertASTToHTML5libTree(child, depth + 1));
@@ -145,9 +141,7 @@ export function convertASTToHTML5libTree(node: ASTNode, depth: number = 0): stri
   return lines;
 }
 
-/**
- * Normalizes HTML5lib tree format for comparison
- */
+
 export function normalizeHTML5libTree(tree: string): string {
   return tree
     .split('\n')
@@ -156,33 +150,29 @@ export function normalizeHTML5libTree(tree: string): string {
     .join('\n');
 }
 
-/**
- * Runs a single HTML5lib tree construction test
- */
+
 export function runHTML5libTreeTest(test: HTML5libTreeTest, testName: string): void {
   it(testName, () => {
     const { data, document: expectedTree, documentFragment, scriptOff, scriptOn } = test;
     
-    // Parse the HTML
+    
     const tokens = tokenize(data);
     const ast = parse(tokens);
     
-    // Convert to HTML5lib tree format
+    
     const actualTreeLines = convertASTToHTML5libTree(ast);
     const actualTree = actualTreeLines.join('\n');
     
-    // Normalize both trees for comparison
+    
     const normalizedActual = normalizeHTML5libTree(actualTree);
     const normalizedExpected = normalizeHTML5libTree(expectedTree);
     
-    // Compare trees
+    
     expect(normalizedActual).toBe(normalizedExpected);
   });
 }
 
-/**
- * Runs all tests from an HTML5lib tree construction test suite
- */
+
 export function runHTML5libTreeTestSuite(tests: HTML5libTreeTest[], suiteName: string): void {
   describe(`HTML5lib Tree Construction Tests: ${suiteName}`, () => {
     tests.forEach((test, index) => {
@@ -192,17 +182,13 @@ export function runHTML5libTreeTestSuite(tests: HTML5libTreeTest[], suiteName: s
   });
 }
 
-/**
- * Loads and runs HTML5lib tree construction tests from DAT format
- */
+
 export async function loadHTML5libTreeTests(testData: string, suiteName: string): Promise<void> {
   const tests = parseHTML5libDATFile(testData);
   runHTML5libTreeTestSuite(tests, suiteName);
 }
 
-/**
- * Validates HTML5lib tree construction test format
- */
+
 export function validateHTML5libTreeTest(test: HTML5libTreeTest): boolean {
   return !!(test.data && test.document && test.errors !== undefined);
 }

package/tests/official/html5lib/tree-construction.test.ts

@@ -6,7 +6,7 @@ import {
   type HTML5libTreeTest,
 } from "./tree-construction-utils";
 
-// Sample HTML5lib tree construction tests in DAT format
+
 const basicTreeTestData = `#data
 Test
 #errors
@@ -206,13 +206,13 @@ const errorHandlingTestData = `#data
 |       <a>
 |     <a>`;
 
-// Run the embedded tests
+
 describe("HTML5lib Tree Construction Tests", () => {
   it("should parse DAT format correctly", () => {
     const tests = parseHTML5libDATFile(basicTreeTestData);
     expect(tests.length).toBeGreaterThan(0);
 
-    // Check first test
+    
     const firstTest = tests[0];
     if (firstTest) {
       expect(firstTest.data).toBe("Test");
@@ -225,7 +225,7 @@ describe("HTML5lib Tree Construction Tests", () => {
     const tests = parseHTML5libDATFile(doctypeTestData);
     expect(tests.length).toBeGreaterThan(0);
 
-    // Check first doctype test
+    
     const firstTest = tests[0];
     if (firstTest) {
       expect(firstTest.data).toBe("<!DOCTYPE html>");
@@ -238,7 +238,7 @@ describe("HTML5lib Tree Construction Tests", () => {
     const tests = parseHTML5libDATFile(errorHandlingTestData);
     expect(tests.length).toBeGreaterThan(0);
 
-    // Check error handling
+    
     const firstTest = tests[0];
     if (firstTest) {
       expect(firstTest.errors.length).toBeGreaterThan(0);

package/tests/official/validator/validator-tests.test.ts

@@ -42,7 +42,7 @@ describe('Validator.nu Tests', () => {
     });
 
     it('should handle content model violations', () => {
-      // These should parse but may generate warnings in a full validator
+      
       const contentModelHTML = `
         <p>
           <div>Block inside paragraph</div>
@@ -53,7 +53,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(contentModelHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -67,7 +67,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(obsoleteHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -85,7 +85,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(deprecatedHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -114,7 +114,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(formHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -136,7 +136,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(mediaHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -162,7 +162,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(semanticHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -184,7 +184,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(interactiveHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -200,7 +200,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(unclosedHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -215,7 +215,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(mismatchedHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });
@@ -229,7 +229,7 @@ describe('Validator.nu Tests', () => {
       `;
       
       const document = parseHTML(invalidNestingHTML);
-      // const ast = parse(tokens);
+      
       
       expect(document).toBeDefined();
     });

package/tests/official/wpt/wpt-tests.test.ts

@@ -135,10 +135,10 @@ describe('Web Platform Tests (WPT) Compliance', () => {
     
     it('should handle numeric character references', () => {
       const numericRefs = [
-        'A',   // A
-        'A',  // A (hex)
-        '€', // Euro symbol
-        '€' // Euro symbol (hex)
+        'A',   
+        'A',  
+        '€', 
+        '€' 
       ];
       
       numericRefs.forEach(ref => {
@@ -404,6 +404,6 @@ describe('WPT Integration Tests', () => {
     
     expect(ast).toBeDefined();
     expect((ast as any).children?.length).toBeGreaterThan(0);
-    expect(end - start).toBeLessThan(1000); // Should parse within 1 second
+    expect(end - start).toBeLessThan(1000); 
   });
 });

package/tests/outerHTML-replacement.test.ts

@@ -0,0 +1,208 @@
+import { describe, it, expect } from "bun:test";
+import { parseHTML } from "../index";
+
+describe("outerHTML replacement - Browser behavior", () => {
+  it("should replace element with its innerHTML when setting outerHTML = innerHTML", () => {
+    
+    
+    
+    
+    const doc = parseHTML(`
+      <html>
+        <body>
+          <div id="mi-prueba" style="border: 2px solid red; padding: 10px;">
+            <strong>Lorem ipsum!</strong> Dolor sit amet consectetur.
+          </div>
+        </body>
+      </html>
+    `);
+    
+    const elem = doc.querySelector("#mi-prueba");
+    expect(elem).not.toBeNull();
+    
+    
+    const innerHTML = elem!.innerHTML;
+    expect(innerHTML).toContain("<strong>Lorem ipsum!</strong>");
+    expect(innerHTML).toContain("Dolor sit amet consectetur.");
+    
+    
+    const parent = elem!.parentNode;
+    expect(parent).not.toBeNull();
+    expect(parent!.childNodes).toContain(elem);
+    
+    
+    elem!.outerHTML = innerHTML;
+    
+    
+    const elemAfter = doc.querySelector("#mi-prueba");
+    expect(elemAfter).toBeNull();
+    
+    
+    const body = doc.querySelector("body");
+    expect(body!.innerHTML).toContain("<strong>Lorem ipsum!</strong>");
+    expect(body!.innerHTML).toContain("Dolor sit amet consectetur.");
+    
+    
+    expect(body!.innerHTML).not.toContain('id="mi-prueba"');
+    expect(body!.innerHTML).not.toContain('style=');
+  });
+
+  it("should replace element with simple text content", () => {
+    const doc = parseHTML(`
+      <div>
+        <p id="paragraph" class="styled">Simple text</p>
+      </div>
+    `);
+    
+    const paragraph = doc.querySelector("#paragraph");
+    expect(paragraph).not.toBeNull();
+    
+    const parent = paragraph!.parentNode;
+    const innerHTML = paragraph!.innerHTML;
+    
+    
+    paragraph!.outerHTML = innerHTML;
+    
+    
+    expect(doc.querySelector("#paragraph")).toBeNull();
+    
+    
+    expect(parent!.textContent).toContain("Simple text");
+  });
+
+  it("should replace element with multiple child nodes", () => {
+    const doc = parseHTML(`
+      <ul>
+        <li id="item-container">
+          <span>Item 1</span>
+          <span>Item 2</span>
+        </li>
+      </ul>
+    `);
+    
+    const container = doc.querySelector("#item-container");
+    expect(container).not.toBeNull();
+    
+    const ul = doc.querySelector("ul");
+    const innerHTML = container!.innerHTML;
+    
+    
+    container!.outerHTML = innerHTML;
+    
+    
+    expect(doc.querySelector("#item-container")).toBeNull();
+    
+    
+    const spans = ul!.querySelectorAll("span");
+    expect(spans.length).toBe(2);
+    expect(spans[0]?.textContent).toBe("Item 1");
+    expect(spans[1]?.textContent).toBe("Item 2");
+  });
+
+  it("should replace element with empty string", () => {
+    const doc = parseHTML(`
+      <div>
+        <span id="to-remove"></span>
+      </div>
+    `);
+    
+    const span = doc.querySelector("#to-remove");
+    expect(span).not.toBeNull();
+    
+    const parent = span!.parentNode;
+    const childCountBefore = parent!.childNodes.length;
+    
+    
+    span!.outerHTML = "";
+    
+    
+    expect(doc.querySelector("#to-remove")).toBeNull();
+    
+    
+    expect(parent!.childNodes.length).toBe(childCountBefore - 1);
+  });
+
+  it("should replace element with new HTML structure", () => {
+    const doc = parseHTML(`
+      <div>
+        <p id="old">Old content</p>
+      </div>
+    `);
+    
+    const oldParagraph = doc.querySelector("#old");
+    expect(oldParagraph).not.toBeNull();
+    
+    const parent = oldParagraph!.parentNode;
+    
+    
+    oldParagraph!.outerHTML = '<div id="new">New content</div>';
+    
+    
+    expect(doc.querySelector("#old")).toBeNull();
+    
+    
+    const newDiv = doc.querySelector("#new");
+    expect(newDiv).not.toBeNull();
+    expect(newDiv!.textContent).toBe("New content");
+    expect(newDiv!.parentNode).toBe(parent);
+  });
+
+  it("should maintain sibling relationships after outerHTML replacement", () => {
+    const doc = parseHTML(`
+      <div>
+        <span>First</span>
+        <p id="middle">Middle</p>
+        <span>Last</span>
+      </div>
+    `);
+    
+    const middle = doc.querySelector("#middle");
+    const firstSpan = doc.querySelectorAll("span")[0];
+    const lastSpan = doc.querySelectorAll("span")[1];
+    
+    
+    middle!.outerHTML = middle!.innerHTML;
+    
+    
+    expect(firstSpan!.nextSibling).not.toBe(middle);
+    expect(lastSpan!.previousSibling).not.toBe(middle);
+    
+    
+    const parent = firstSpan!.parentNode;
+    expect(parent!.textContent).toContain("Middle");
+  });
+
+  it("should handle complex nested HTML replacement", () => {
+    const doc = parseHTML(`
+      <article>
+        <section id="wrapper" class="container" data-id="123">
+          <h2>Title</h2>
+          <p>Paragraph <strong>bold</strong> text</p>
+          <ul>
+            <li>Item 1</li>
+            <li>Item 2</li>
+          </ul>
+        </section>
+      </article>
+    `);
+    
+    const wrapper = doc.querySelector("#wrapper");
+    expect(wrapper).not.toBeNull();
+    
+    const article = doc.querySelector("article");
+    const innerHTML = wrapper!.innerHTML;
+    
+    
+    wrapper!.outerHTML = innerHTML;
+    
+    
+    expect(doc.querySelector("#wrapper")).toBeNull();
+    expect(doc.querySelector("section")).toBeNull();
+    
+    
+    expect(article!.querySelector("h2")).not.toBeNull();
+    expect(article!.querySelector("h2")!.textContent).toBe("Title");
+    expect(article!.querySelector("strong")).not.toBeNull();
+    expect(article!.querySelectorAll("li").length).toBe(2);
+  });
+});

package/tests/parser.test.ts

@@ -326,7 +326,7 @@ describe('HTML Parser', () => {
       )!;
       expect(htmlElement.type).toBe(ASTNodeType.ELEMENT);
       expect(htmlElement.tagName).toBe('html');
-      expect(htmlElement.attributes!.lang).toBe('es');
+      expect(htmlElement.attributes!.lang).toBe('en');
       const headElement = htmlElement.children!.find(
         child => child.type === ASTNodeType.ELEMENT && child.tagName === 'head'
       )!;