parse5 8.0.1 → 8.1.1

package/dist/parser/index.js

@@ -9,12 +9,32 @@ import * as unicode from '../common/unicode.js';
 import { TAG_ID as $, TAG_NAMES as TN, NS, ATTRS, SPECIAL_ELEMENTS, DOCUMENT_MODE, NUMBERED_HEADERS, getTagID, } from '../common/html.js';
 import { TokenType, getTokenAttr, } from '../common/token.js';
 //Misc constants
+// Elements that can select an insertion mode when it is reset.
+const INSERTION_MODE_TAGS = [
+    $.TR,
+    $.TBODY,
+    $.THEAD,
+    $.TFOOT,
+    $.CAPTION,
+    $.COLGROUP,
+    $.TABLE,
+    $.FRAMESET,
+    $.SELECT,
+    $.TEMPLATE,
+    $.TD,
+    $.TH,
+    $.HEAD,
+    $.BODY,
+    $.HTML,
+];
 const HIDDEN_INPUT_TYPE = 'hidden';
+// For the integration-point check of elements whose attributes do not matter; never attached to a node.
+const EMPTY_ATTRS = [];
 //Adoption agency loops iteration count
 const AA_OUTER_LOOP_ITER = 8;
 const AA_INNER_LOOP_ITER = 3;
 //Insertion modes
-var InsertionMode;
+export var InsertionMode;
 (function (InsertionMode) {
     InsertionMode[InsertionMode["INITIAL"] = 0] = "INITIAL";
     InsertionMode[InsertionMode["BEFORE_HTML"] = 1] = "BEFORE_HTML";
@@ -77,8 +97,7 @@ export class Parser {
         /** Indicates that the current node is not an element in the HTML namespace */
         this.currentNotInHTML = false;
         /**
-         * The template insertion mode stack is maintained from the left.
-         * Ie. the topmost element will always have index 0.
+         * The topmost template insertion mode is the last element.
          *
          * @internal
          */
@@ -105,7 +124,7 @@ export class Parser {
         }
         this.document = document !== null && document !== void 0 ? document : this.treeAdapter.createDocument();
         this.tokenizer = new Tokenizer(this.options, this);
-        this.activeFormattingElements = new FormattingElementList(this.treeAdapter);
+        this.activeFormattingElements = new FormattingElementList();
         this.fragmentContextID = fragmentContext ? getTagID(this.treeAdapter.getTagName(fragmentContext)) : $.UNKNOWN;
         this._setContextModes(fragmentContext !== null && fragmentContext !== void 0 ? fragmentContext : this.document, this.fragmentContextID);
         this.openElements = new OpenElementStack(this.document, this.treeAdapter, this);
@@ -130,7 +149,7 @@ export class Parser {
         const documentMock = opts.treeAdapter.createElement('documentmock', NS.HTML, []);
         const parser = new this(opts, documentMock, fragmentContext);
         if (parser.fragmentContextID === $.TEMPLATE) {
-            parser.tmplInsertionModeStack.unshift(InsertionMode.IN_TEMPLATE);
+            parser.tmplInsertionModeStack.push(InsertionMode.IN_TEMPLATE);
         }
         parser._initTokenizerForFragmentParsing();
         parser._insertFakeRootElement();
@@ -172,11 +191,12 @@ export class Parser {
     }
     /** @internal */
     onItemPop(node, isTop) {
-        var _a, _b;
+        var _a, _b, _c;
         if (this.options.sourceCodeLocationInfo) {
             this._setEndLocation(node, this.currentToken);
         }
         (_b = (_a = this.treeAdapter).onItemPop) === null || _b === void 0 ? void 0 : _b.call(_a, node, this.openElements.current);
+        (_c = this.annotationXmlIntegrationPoints) === null || _c === void 0 ? void 0 : _c.delete(node);
         if (isTop) {
             let current;
             let currentTagId;
@@ -219,7 +239,7 @@ export class Parser {
     _findFormInFragmentContext() {
         let node = this.fragmentContext;
         while (node) {
-            if (this.treeAdapter.getTagName(node) === TN.FORM) {
+            if (this.treeAdapter.getTagName(node) === TN.FORM && this.treeAdapter.getNamespaceURI(node) === NS.HTML) {
                 this.formElement = node;
                 break;
             }
@@ -273,7 +293,7 @@ export class Parser {
         }
     }
     /** @protected */
-    _attachElementToTree(element, location) {
+    _attachElementToTree(element, location, insertionLocation) {
         if (this.options.sourceCodeLocationInfo) {
             const loc = location && {
                 ...location,
@@ -281,13 +301,34 @@ export class Parser {
             };
             this.treeAdapter.setNodeSourceCodeLocation(element, loc);
         }
-        if (this._shouldFosterParentOnInsertion()) {
-            this._fosterParentElement(element);
+        if (insertionLocation.beforeElement) {
+            this.treeAdapter.insertBefore(insertionLocation.parent, element, insertionLocation.beforeElement);
         }
         else {
-            const parent = this.openElements.currentTmplContentOrNode;
-            this.treeAdapter.appendChild(parent !== null && parent !== void 0 ? parent : this.document, element);
+            this.treeAdapter.appendChild(insertionLocation.parent, element);
+        }
+    }
+    /** @protected */
+    _getInsertionLocation() {
+        var _a;
+        if (this._shouldFosterParentOnInsertion()) {
+            return this._findFosterParentingLocation();
         }
+        return {
+            parent: (_a = this.openElements.currentTmplContentOrNode) !== null && _a !== void 0 ? _a : this.document,
+            beforeElement: null,
+        };
+    }
+    /** @protected */
+    _createElement(tagName, namespaceURI, attrs, intendedParent) {
+        var _a, _b;
+        const element = this.treeAdapter.createElement(tagName, namespaceURI, attrs);
+        (_b = (_a = this.treeAdapter).onElementCreated) === null || _b === void 0 ? void 0 : _b.call(_a, element, {
+            intendedParent,
+            formElement: this.formElement,
+            isInTemplate: this.openElements.tmplCount > 0,
+        });
+        return element;
     }
     /**
      * For self-closing tags. Add an element to the tree, but skip adding it
@@ -295,37 +336,41 @@ export class Parser {
      */
     /** @protected */
     _appendElement(token, namespaceURI) {
-        const element = this.treeAdapter.createElement(token.tagName, namespaceURI, token.attrs);
-        this._attachElementToTree(element, token.location);
+        const insertionLocation = this._getInsertionLocation();
+        const element = this._createElement(token.tagName, namespaceURI, token.attrs, insertionLocation.parent);
+        this._attachElementToTree(element, token.location, insertionLocation);
     }
     /** @protected */
     _insertElement(token, namespaceURI) {
-        const element = this.treeAdapter.createElement(token.tagName, namespaceURI, token.attrs);
-        this._attachElementToTree(element, token.location);
+        const insertionLocation = this._getInsertionLocation();
+        const element = this._createElement(token.tagName, namespaceURI, token.attrs, insertionLocation.parent);
+        this._attachElementToTree(element, token.location, insertionLocation);
         this.openElements.push(element, token.tagID);
     }
     /** @protected */
     _insertFakeElement(tagName, tagID) {
-        const element = this.treeAdapter.createElement(tagName, NS.HTML, []);
-        this._attachElementToTree(element, null);
+        const insertionLocation = this._getInsertionLocation();
+        const element = this._createElement(tagName, NS.HTML, [], insertionLocation.parent);
+        this._attachElementToTree(element, null, insertionLocation);
         this.openElements.push(element, tagID);
     }
     /** @protected */
     _insertTemplate(token) {
-        const tmpl = this.treeAdapter.createElement(token.tagName, NS.HTML, token.attrs);
+        const insertionLocation = this._getInsertionLocation();
+        const tmpl = this._createElement(token.tagName, NS.HTML, token.attrs, insertionLocation.parent);
         const content = this.treeAdapter.createDocumentFragment();
         this.treeAdapter.setTemplateContent(tmpl, content);
-        this._attachElementToTree(tmpl, token.location);
+        this._attachElementToTree(tmpl, token.location, insertionLocation);
         this.openElements.push(tmpl, token.tagID);
         if (this.options.sourceCodeLocationInfo)
             this.treeAdapter.setNodeSourceCodeLocation(content, null);
     }
     /** @protected */
     _insertFakeRootElement() {
-        const element = this.treeAdapter.createElement(TN.HTML, NS.HTML, []);
+        const element = this._createElement(TN.HTML, NS.HTML, [], this.document);
         if (this.options.sourceCodeLocationInfo)
             this.treeAdapter.setNodeSourceCodeLocation(element, null);
-        this.treeAdapter.appendChild(this.openElements.current, element);
+        this.treeAdapter.appendChild(this.document, element);
         this.openElements.push(element, $.HTML);
     }
     /** @protected */
@@ -370,8 +415,12 @@ export class Parser {
     }
     /** @protected */
     _adoptNodes(donor, recipient) {
-        for (let child = this.treeAdapter.getFirstChild(donor); child; child = this.treeAdapter.getFirstChild(donor)) {
-            this.treeAdapter.detachNode(child);
+        // Detaching from the end keeps an array-backed child list from shifting once per child.
+        const children = [...this.treeAdapter.getChildNodes(donor)];
+        for (let i = children.length - 1; i >= 0; i--) {
+            this.treeAdapter.detachNode(children[i]);
+        }
+        for (const child of children) {
             this.treeAdapter.appendChild(recipient, child);
         }
     }
@@ -463,25 +512,31 @@ export class Parser {
             }
         }
     }
-    //Integration points
     /** @protected */
     _isIntegrationPoint(tid, element, foreignNS) {
+        var _a;
         const ns = this.treeAdapter.getNamespaceURI(element);
-        const attrs = this.treeAdapter.getAttrList(element);
-        return foreignContent.isIntegrationPoint(tid, ns, attrs, foreignNS);
+        if (tid === $.ANNOTATION_XML && ns === NS.MATHML && foreignNS !== NS.MATHML) {
+            const verdicts = ((_a = this.annotationXmlIntegrationPoints) !== null && _a !== void 0 ? _a : (this.annotationXmlIntegrationPoints = new Map()));
+            let isIntegrationPoint = verdicts.get(element);
+            if (isIntegrationPoint === undefined) {
+                isIntegrationPoint = foreignContent.isIntegrationPoint(tid, ns, this.treeAdapter.getAttrList(element));
+                verdicts.set(element, isIntegrationPoint);
+            }
+            return isIntegrationPoint;
+        }
+        return foreignContent.isIntegrationPoint(tid, ns, EMPTY_ATTRS, foreignNS);
     }
     //Active formatting elements reconstruction
     /** @protected */
     _reconstructActiveFormattingElements() {
-        const listLength = this.activeFormattingElements.entries.length;
-        if (listLength) {
-            const endIndex = this.activeFormattingElements.entries.findIndex((entry) => entry.type === EntryType.Marker || this.openElements.contains(entry.element));
-            const unopenIdx = endIndex === -1 ? listLength - 1 : endIndex - 1;
-            for (let i = unopenIdx; i >= 0; i--) {
-                const entry = this.activeFormattingElements.entries[i];
-                this._insertElement(entry.token, this.treeAdapter.getNamespaceURI(entry.element));
-                entry.element = this.openElements.current;
-            }
+        let oldest = null;
+        for (let entry = this.activeFormattingElements.newest; entry !== null && entry.type === EntryType.Element && !this.openElements.contains(entry.element); entry = entry.older) {
+            oldest = entry;
+        }
+        for (let entry = oldest; entry !== null && entry.type === EntryType.Element; entry = entry.newer) {
+            this._insertElement(entry.token, this.treeAdapter.getNamespaceURI(entry.element));
+            this.activeFormattingElements.replaceElement(entry, this.openElements.current);
         }
     }
     //Close elements
@@ -500,9 +555,14 @@ export class Parser {
     //Insertion modes
     /** @protected */
     _resetInsertionMode() {
-        for (let i = this.openElements.stackTop; i >= 0; i--) {
+        // The topmost open HTML element that selects a mode; the fragment context stands in for the root.
+        const i = this.openElements.indexOfTopmostOf(INSERTION_MODE_TAGS);
+        const tn = i === 0 && this.fragmentContext ? this.fragmentContextID : this.openElements.tagIDs[i];
+        const node = i === 0 && this.fragmentContext ? this.fragmentContext : this.openElements.items[i];
+        // Only HTML elements select an insertion mode.
+        if (node !== undefined && this.treeAdapter.getNamespaceURI(node) === NS.HTML) {
             //Insertion mode reset map
-            switch (i === 0 && this.fragmentContext ? this.fragmentContextID : this.openElements.tagIDs[i]) {
+            switch (tn) {
                 case $.TR: {
                     this.insertionMode = InsertionMode.IN_ROW;
                     return;
@@ -538,7 +598,7 @@ export class Parser {
                     return;
                 }
                 case $.TEMPLATE: {
-                    this.insertionMode = this.tmplInsertionModeStack[0];
+                    this.insertionMode = this.tmplInsertionModeStack[this.tmplInsertionModeStack.length - 1];
                     return;
                 }
                 case $.HTML: {
@@ -566,16 +626,12 @@ export class Parser {
     }
     /** @protected */
     _resetInsertionModeForSelect(selectIdx) {
+        // The select is the topmost element that selects a mode, so open tables and templates are below it.
         if (selectIdx > 0) {
-            for (let i = selectIdx - 1; i > 0; i--) {
-                const tn = this.openElements.tagIDs[i];
-                if (tn === $.TEMPLATE) {
-                    break;
-                }
-                else if (tn === $.TABLE) {
-                    this.insertionMode = InsertionMode.IN_SELECT_IN_TABLE;
-                    return;
-                }
+            const tableIdx = this.openElements.indexOfTopmost($.TABLE);
+            if (tableIdx > 0 && tableIdx > this.openElements.indexOfTopmost($.TEMPLATE)) {
+                this.insertionMode = InsertionMode.IN_SELECT_IN_TABLE;
+                return;
             }
         }
         this.insertionMode = InsertionMode.IN_SELECT;
@@ -593,27 +649,24 @@ export class Parser {
     }
     /** @protected */
     _findFosterParentingLocation() {
-        for (let i = this.openElements.stackTop; i >= 0; i--) {
-            const openElement = this.openElements.items[i];
-            switch (this.openElements.tagIDs[i]) {
-                case $.TEMPLATE: {
-                    if (this.treeAdapter.getNamespaceURI(openElement) === NS.HTML) {
-                        return { parent: this.treeAdapter.getTemplateContent(openElement), beforeElement: null };
-                    }
-                    break;
-                }
-                case $.TABLE: {
-                    const parent = this.treeAdapter.getParentNode(openElement);
-                    if (parent) {
-                        return { parent, beforeElement: openElement };
-                    }
-                    return { parent: this.openElements.items[i - 1], beforeElement: null };
-                }
-                default:
-                // Do nothing
+        const { openElements } = this;
+        const tableIdx = openElements.indexOfTopmost($.TABLE);
+        const templateIdx = openElements.indexOfTopmost($.TEMPLATE);
+        if (templateIdx > tableIdx) {
+            return {
+                parent: this.treeAdapter.getTemplateContent(openElements.items[templateIdx]),
+                beforeElement: null,
+            };
+        }
+        if (tableIdx !== -1) {
+            const table = openElements.items[tableIdx];
+            const parent = this.treeAdapter.getParentNode(table);
+            if (parent) {
+                return { parent, beforeElement: table };
             }
+            return { parent: openElements.items[openElements.slotBelow(tableIdx)], beforeElement: null };
         }
-        return { parent: this.openElements.items[0], beforeElement: null };
+        return { parent: openElements.items[0], beforeElement: null };
     }
     /** @protected */
     _fosterParentElement(element) {
@@ -1185,7 +1238,7 @@ function aaObtainFormattingElementEntry(p, token) {
             p.activeFormattingElements.removeEntry(formattingElementEntry);
             formattingElementEntry = null;
         }
-        else if (!p.openElements.hasInScope(token.tagID)) {
+        else if (!p.openElements.hasInScope(token.tagID, formattingElementEntry.element)) {
             formattingElementEntry = null;
         }
     }
@@ -1196,30 +1249,28 @@ function aaObtainFormattingElementEntry(p, token) {
 }
 //Steps 9 and 10 of the algorithm
 function aaObtainFurthestBlock(p, formattingElementEntry) {
-    let furthestBlock = null;
-    let idx = p.openElements.stackTop;
-    for (; idx >= 0; idx--) {
-        const element = p.openElements.items[idx];
-        if (element === formattingElementEntry.element) {
-            break;
-        }
-        if (p._isSpecialElement(element, p.openElements.tagIDs[idx])) {
-            furthestBlock = element;
+    const { openElements } = p;
+    const formattingIdx = openElements._indexOf(formattingElementEntry.element);
+    // The furthest block is the lowest special element above the formatting element.
+    for (let idx = openElements.slotAbove(formattingIdx); idx !== -1; idx = openElements.slotAbove(idx)) {
+        if (p._isSpecialElement(openElements.items[idx], openElements.tagIDs[idx])) {
+            return idx;
         }
     }
-    if (!furthestBlock) {
-        p.openElements.shortenToLength(Math.max(idx, 0));
-        p.activeFormattingElements.removeEntry(formattingElementEntry);
-    }
-    return furthestBlock;
+    openElements.shortenToLength(formattingIdx);
+    p.activeFormattingElements.removeEntry(formattingElementEntry);
+    return -1;
 }
 //Step 13 of the algorithm
-function aaInnerLoop(p, furthestBlock, formattingElement) {
+function aaInnerLoop(p, furthestBlockIdx, formattingElement) {
+    const furthestBlock = p.openElements.items[furthestBlockIdx];
     let lastElement = furthestBlock;
-    let nextElement = p.openElements.getCommonAncestor(furthestBlock);
-    for (let i = 0, element = nextElement; element !== formattingElement; i++, element = nextElement) {
-        //NOTE: store the next element for the next loop iteration (it may be deleted from the stack by step 9.5)
-        nextElement = p.openElements.getCommonAncestor(element);
+    let nextIdx = p.openElements.slotBelow(furthestBlockIdx);
+    const intendedParent = p.openElements.getCommonAncestor(formattingElement);
+    for (let i = 0, idx = nextIdx; p.openElements.items[idx] !== formattingElement; i++, idx = nextIdx) {
+        let element = p.openElements.items[idx];
+        // Store the next element for the next loop iteration (this one may be removed from the stack by step 9.5).
+        nextIdx = p.openElements.slotBelow(idx);
         const elementEntry = p.activeFormattingElements.getElementEntry(element);
         const counterOverflow = elementEntry && i >= AA_INNER_LOOP_ITER;
         const shouldRemoveFromOpenElements = !elementEntry || counterOverflow;
@@ -1227,10 +1278,10 @@ function aaInnerLoop(p, furthestBlock, formattingElement) {
             if (counterOverflow) {
                 p.activeFormattingElements.removeEntry(elementEntry);
             }
-            p.openElements.remove(element);
+            p.openElements.removeAt(idx);
         }
         else {
-            element = aaRecreateElementFromEntry(p, elementEntry);
+            element = aaRecreateElementFromEntry(p, elementEntry, intendedParent);
             if (lastElement === furthestBlock) {
                 p.activeFormattingElements.bookmark = elementEntry;
             }
@@ -1242,11 +1293,11 @@ function aaInnerLoop(p, furthestBlock, formattingElement) {
     return lastElement;
 }
 //Step 13.7 of the algorithm
-function aaRecreateElementFromEntry(p, elementEntry) {
+function aaRecreateElementFromEntry(p, elementEntry, intendedParent) {
     const ns = p.treeAdapter.getNamespaceURI(elementEntry.element);
-    const newElement = p.treeAdapter.createElement(elementEntry.token.tagName, ns, elementEntry.token.attrs);
+    const newElement = p._createElement(elementEntry.token.tagName, ns, elementEntry.token.attrs, intendedParent);
     p.openElements.replace(elementEntry.element, newElement);
-    elementEntry.element = newElement;
+    p.activeFormattingElements.replaceElement(elementEntry, newElement);
     return newElement;
 }
 //Step 14 of the algorithm
@@ -1268,27 +1319,41 @@ function aaInsertLastNodeInCommonAncestor(p, commonAncestor, lastElement) {
 function aaReplaceFormattingElement(p, furthestBlock, formattingElementEntry) {
     const ns = p.treeAdapter.getNamespaceURI(formattingElementEntry.element);
     const { token } = formattingElementEntry;
-    const newElement = p.treeAdapter.createElement(token.tagName, ns, token.attrs);
+    const newElement = p._createElement(token.tagName, ns, token.attrs, furthestBlock);
     p._adoptNodes(furthestBlock, newElement);
     p.treeAdapter.appendChild(furthestBlock, newElement);
     p.activeFormattingElements.insertElementAfterBookmark(newElement, token);
     p.activeFormattingElements.removeEntry(formattingElementEntry);
-    p.openElements.remove(formattingElementEntry.element);
-    p.openElements.insertAfter(furthestBlock, newElement, token.tagID);
+    // Only the elements the inner loop kept are open between the formatting element and the furthest block.
+    const formattingIdx = p.openElements._indexOf(formattingElementEntry.element);
+    let furthestBlockIdx = p.openElements.slotAbove(formattingIdx);
+    while (p.openElements.items[furthestBlockIdx] !== furthestBlock) {
+        furthestBlockIdx = p.openElements.slotAbove(furthestBlockIdx);
+    }
+    p.openElements.replaceFormattingElement(formattingIdx, furthestBlockIdx, newElement, token.tagID);
 }
 //Algorithm entry point
 function callAdoptionAgency(p, token) {
+    const { current, currentTagId } = p.openElements;
+    //Step 2 of the algorithm
+    if (currentTagId === token.tagID &&
+        p.treeAdapter.getNamespaceURI(current) === NS.HTML &&
+        !p.activeFormattingElements.getElementEntry(current)) {
+        p.openElements.pop();
+        return;
+    }
     for (let i = 0; i < AA_OUTER_LOOP_ITER; i++) {
         const formattingElementEntry = aaObtainFormattingElementEntry(p, token);
         if (!formattingElementEntry) {
             break;
         }
-        const furthestBlock = aaObtainFurthestBlock(p, formattingElementEntry);
-        if (!furthestBlock) {
+        const furthestBlockIdx = aaObtainFurthestBlock(p, formattingElementEntry);
+        if (furthestBlockIdx === -1) {
             break;
         }
+        const furthestBlock = p.openElements.items[furthestBlockIdx];
         p.activeFormattingElements.bookmark = formattingElementEntry;
-        const lastElement = aaInnerLoop(p, furthestBlock, formattingElementEntry.element);
+        const lastElement = aaInnerLoop(p, furthestBlockIdx, formattingElementEntry.element);
         const commonAncestor = p.openElements.getCommonAncestor(formattingElementEntry.element);
         p.treeAdapter.detachNode(lastElement);
         if (commonAncestor)
@@ -1314,7 +1379,7 @@ function stopParsing(p, token) {
         // NOTE: If we are not in a fragment, `html` and `body` will stay on the stack.
         // This is a problem, as we might overwrite their end position here.
         const target = p.fragmentContext ? 0 : 2;
-        for (let i = p.openElements.stackTop; i >= target; i--) {
+        for (let i = p.openElements.stackTop; i >= target; i = p.openElements.slotBelow(i)) {
             p._setEndLocation(p.openElements.items[i], token);
         }
         // Handle `html` and `body`
@@ -1452,7 +1517,7 @@ function startTagInHead(p, token) {
             p.activeFormattingElements.insertMarker();
             p.framesetOk = false;
             p.insertionMode = InsertionMode.IN_TEMPLATE;
-            p.tmplInsertionModeStack.unshift(InsertionMode.IN_TEMPLATE);
+            p.tmplInsertionModeStack.push(InsertionMode.IN_TEMPLATE);
             break;
         }
         case $.HEAD: {
@@ -1494,7 +1559,7 @@ function templateEndTagInHead(p, token) {
         }
         p.openElements.popUntilTagNamePopped($.TEMPLATE);
         p.activeFormattingElements.clearToLastMarker();
-        p.tmplInsertionModeStack.shift();
+        p.tmplInsertionModeStack.pop();
         p._resetInsertionMode();
     }
     else {
@@ -1723,21 +1788,15 @@ function formStartTagInBody(p, token) {
 }
 function listItemStartTagInBody(p, token) {
     p.framesetOk = false;
-    const tn = token.tagID;
-    for (let i = p.openElements.stackTop; i >= 0; i--) {
-        const elementId = p.openElements.tagIDs[i];
-        if ((tn === $.LI && elementId === $.LI) ||
-            ((tn === $.DD || tn === $.DT) && (elementId === $.DD || elementId === $.DT))) {
-            p.openElements.generateImpliedEndTagsWithExclusion(elementId);
-            p.openElements.popUntilTagNamePopped(elementId);
-            break;
-        }
-        if (elementId !== $.ADDRESS &&
-            elementId !== $.DIV &&
-            elementId !== $.P &&
-            p._isSpecialElement(p.openElements.items[i], elementId)) {
-            break;
-        }
+    // The topmost open item of the token's kind closes, unless a special element other than address, div and p is
+    // above it.
+    const idx = token.tagID === $.LI
+        ? p.openElements.indexOfTopmost($.LI)
+        : Math.max(p.openElements.indexOfTopmost($.DD), p.openElements.indexOfTopmost($.DT));
+    if (idx !== -1 && !p.openElements.hasListItemBoundaryAbove(idx)) {
+        const elementId = p.openElements.tagIDs[idx];
+        p.openElements.generateImpliedEndTagsWithExclusion(elementId);
+        p.openElements.popUntilTagNamePopped(elementId);
     }
     if (p.openElements.hasInButtonScope($.P)) {
         p._closePElement();
@@ -2221,21 +2280,16 @@ function brEndTagInBody(p) {
     p.framesetOk = false;
 }
 function genericEndTagInBody(p, token) {
-    const tn = token.tagName;
     const tid = token.tagID;
-    for (let i = p.openElements.stackTop; i > 0; i--) {
-        const element = p.openElements.items[i];
-        const elementId = p.openElements.tagIDs[i];
-        // Compare the tag name here, as the tag might not be a known tag with an ID.
-        if (tid === elementId && (tid !== $.UNKNOWN || p.treeAdapter.getTagName(element) === tn)) {
-            p.openElements.generateImpliedEndTagsWithExclusion(tid);
-            if (p.openElements.stackTop >= i)
-                p.openElements.shortenToLength(i);
-            break;
-        }
-        if (p._isSpecialElement(element, elementId)) {
-            break;
-        }
+    // The topmost open HTML element with the token's name closes, unless a special element is above it. A tag without
+    // an ID is matched by name.
+    const i = tid === $.UNKNOWN
+        ? p.openElements.indexOfTopmostByName(NS.HTML, token.tagName)
+        : p.openElements.indexOfTopmost(tid);
+    if (i > 0 && !p.openElements.hasSpecialElementAbove(i)) {
+        p.openElements.generateImpliedEndTagsWithExclusion(tid);
+        if (p.openElements.stackTop >= i)
+            p.openElements.shortenToLength(i);
     }
 }
 function endTagInBody(p, token) {
@@ -2920,7 +2974,7 @@ function endTagInSelect(p, token) {
         case $.OPTGROUP: {
             if (p.openElements.stackTop > 0 &&
                 p.openElements.currentTagId === $.OPTION &&
-                p.openElements.tagIDs[p.openElements.stackTop - 1] === $.OPTGROUP) {
+                p.openElements.tagIDs[p.openElements.slotBelow(p.openElements.stackTop)] === $.OPTGROUP) {
                 p.openElements.pop();
             }
             if (p.openElements.currentTagId === $.OPTGROUP) {
@@ -3013,32 +3067,32 @@ function startTagInTemplate(p, token) {
         case $.TBODY:
         case $.TFOOT:
         case $.THEAD: {
-            p.tmplInsertionModeStack[0] = InsertionMode.IN_TABLE;
+            p.tmplInsertionModeStack[p.tmplInsertionModeStack.length - 1] = InsertionMode.IN_TABLE;
             p.insertionMode = InsertionMode.IN_TABLE;
             startTagInTable(p, token);
             break;
         }
         case $.COL: {
-            p.tmplInsertionModeStack[0] = InsertionMode.IN_COLUMN_GROUP;
+            p.tmplInsertionModeStack[p.tmplInsertionModeStack.length - 1] = InsertionMode.IN_COLUMN_GROUP;
             p.insertionMode = InsertionMode.IN_COLUMN_GROUP;
             startTagInColumnGroup(p, token);
             break;
         }
         case $.TR: {
-            p.tmplInsertionModeStack[0] = InsertionMode.IN_TABLE_BODY;
+            p.tmplInsertionModeStack[p.tmplInsertionModeStack.length - 1] = InsertionMode.IN_TABLE_BODY;
             p.insertionMode = InsertionMode.IN_TABLE_BODY;
             startTagInTableBody(p, token);
             break;
         }
         case $.TD:
         case $.TH: {
-            p.tmplInsertionModeStack[0] = InsertionMode.IN_ROW;
+            p.tmplInsertionModeStack[p.tmplInsertionModeStack.length - 1] = InsertionMode.IN_ROW;
             p.insertionMode = InsertionMode.IN_ROW;
             startTagInRow(p, token);
             break;
         }
         default: {
-            p.tmplInsertionModeStack[0] = InsertionMode.IN_BODY;
+            p.tmplInsertionModeStack[p.tmplInsertionModeStack.length - 1] = InsertionMode.IN_BODY;
             p.insertionMode = InsertionMode.IN_BODY;
             startTagInBody(p, token);
         }
@@ -3051,9 +3105,12 @@ function endTagInTemplate(p, token) {
 }
 function eofInTemplate(p, token) {
     if (p.openElements.tmplCount > 0) {
-        p.openElements.popUntilTagNamePopped($.TEMPLATE);
-        p.activeFormattingElements.clearToLastMarker();
-        p.tmplInsertionModeStack.shift();
+        // EOF closes every open template.
+        do {
+            p.openElements.popUntilTagNamePopped($.TEMPLATE);
+            p.activeFormattingElements.clearToLastMarker();
+            p.tmplInsertionModeStack.pop();
+        } while (p.openElements.tmplCount > 0);
         p._resetInsertionMode();
         p.onEof(token);
     }
@@ -3228,18 +3285,24 @@ function endTagInForeignContent(p, token) {
         p._endTagOutsideForeignContent(token);
         return;
     }
-    for (let i = p.openElements.stackTop; i > 0; i--) {
-        const element = p.openElements.items[i];
-        if (p.treeAdapter.getNamespaceURI(element) === NS.HTML) {
-            p._endTagOutsideForeignContent(token);
-            break;
-        }
-        const tagName = p.treeAdapter.getTagName(element);
-        if (tagName.toLowerCase() === token.tagName) {
-            //NOTE: update the token tag name for `_setEndLocation`.
-            token.tagName = tagName;
-            p.openElements.shortenToLength(i);
-            break;
-        }
+    // The current node is the root element (fragment case): ignore the token.
+    if (p.openElements.stackTop === 0)
+        return;
+    // The topmost foreign element with the token's name closes, unless an HTML element is above it. Foreign names are
+    // the lowercased start-tag name or its SVG adjustment, so these two are the ASCII case-insensitive match.
+    const { tagName } = token;
+    const adjustedTagName = foreignContent.SVG_TAG_NAMES_ADJUSTMENT_MAP.get(tagName);
+    // Elements outside HTML, SVG and MathML only come from a fragment context in their namespace.
+    const contextNs = p.fragmentContext ? p.treeAdapter.getNamespaceURI(p.fragmentContext) : NS.HTML;
+    const i = Math.max(p.openElements.indexOfTopmostByName(NS.SVG, tagName), p.openElements.indexOfTopmostByName(NS.MATHML, tagName), adjustedTagName === undefined ? -1 : p.openElements.indexOfTopmostByName(NS.SVG, adjustedTagName), contextNs === NS.HTML || contextNs === NS.SVG || contextNs === NS.MATHML
+        ? -1
+        : p.openElements.indexOfTopmostByName(contextNs, tagName));
+    if (i > p.openElements.indexOfTopmostHtmlElement()) {
+        //NOTE: update the token tag name for `_setEndLocation`.
+        token.tagName = p.treeAdapter.getTagName(p.openElements.items[i]);
+        p.openElements.shortenToLength(i);
+    }
+    else {
+        p._endTagOutsideForeignContent(token);
     }
 }