'use strict';
/* global $:off */
var noElementChildrenElementTypes;
/**
* @external ThreadItem
*/
/**
* @param {Node} node
* @return {boolean} Node is a block element
*/
function isBlockElement( node ) {
return node instanceof HTMLElement && ve.isBlockElement( node );
}
/**
* @param {Node} node
* @return {boolean} Node is considered a rendering-transparent node in Parsoid
*/
function isRenderingTransparentNode( node ) {
return (
node.nodeType === Node.COMMENT_NODE ||
node.nodeType === Node.ELEMENT_NODE && (
node.tagName.toLowerCase() === 'meta' ||
node.tagName.toLowerCase() === 'link' ||
// Empty inline templates, e.g. tracking templates
(
node.tagName.toLowerCase() === 'span' &&
( node.getAttribute( 'typeof' ) || '' ).split( ' ' ).indexOf( 'mw:Transclusion' ) !== -1 &&
// eslint-disable-next-line no-use-before-define
!htmlTrim( node.innerHTML )
)
)
);
}
// Elements which can't have element children (but some may have text content).
// https://html.spec.whatwg.org/#elements-2
noElementChildrenElementTypes = [
// Void elements
'area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input',
'link', 'meta', 'param', 'source', 'track', 'wbr',
// Raw text elements
'script', 'style',
// Escapable raw text elements
'textarea', 'title'
];
/**
* @param {Node} node
* @return {boolean} If true, node can't have element children. If false, it's complicated.
*/
function cantHaveElementChildren( node ) {
return (
node.nodeType === Node.COMMENT_NODE ||
node.nodeType === Node.ELEMENT_NODE &&
noElementChildrenElementTypes.indexOf( node.tagName.toLowerCase() ) !== -1
);
}
/**
* Get the index of a node in its parentNode's childNode list
*
* @param {Node} child
* @return {number} Index in parentNode's childNode list
*/
function childIndexOf( child ) {
var i = 0;
while ( ( child = child.previousSibling ) ) {
i++;
}
return i;
}
/**
* Check whether a Node contains (is an ancestor of) another Node (or is the same node)
*
* @param {Node} ancestor
* @param {Node} descendant
* @return {boolean}
*/
function contains( ancestor, descendant ) {
// Support: IE 11
// Node#contains is only supported on HTMLElement nodes. Otherwise we could just use
// `ancestor.contains( descendant )`.
return ancestor === descendant ||
// eslint-disable-next-line no-bitwise
ancestor.compareDocumentPosition( descendant ) & Node.DOCUMENT_POSITION_CONTAINED_BY;
}
/**
* Find closest ancestor element using one of the given tag names.
*
* @param {Node} node
* @param {string[]} tagNames
* @return {HTMLElement|null}
*/
function closestElement( node, tagNames ) {
do {
if (
node.nodeType === Node.ELEMENT_NODE &&
tagNames.indexOf( node.tagName.toLowerCase() ) !== -1
) {
return node;
}
node = node.parentNode;
} while ( node );
return null;
}
/**
* Find the transclusion node which rendered the current node, if it exists.
*
* 1. Find the closest ancestor with an 'about' attribute
* 2. Find the main node of the about-group (first sibling with the same 'about' attribute)
* 3. If this is an mw:Transclusion node, return it; otherwise, go to step 1
*
* @param {Node} node
* @return {HTMLElement|null} Translcusion node, null if not found
*/
function getTranscludedFromElement( node ) {
var about;
while ( node ) {
// 1.
if (
node.nodeType === Node.ELEMENT_NODE &&
node.getAttribute( 'about' ) &&
/^#mwt\d+$/.test( node.getAttribute( 'about' ) )
) {
about = node.getAttribute( 'about' );
// 2.
while (
node.previousSibling &&
node.previousSibling.nodeType === Node.ELEMENT_NODE &&
node.previousSibling.getAttribute( 'about' ) === about
) {
node = node.previousSibling;
}
// 3.
if (
node.getAttribute( 'typeof' ) &&
node.getAttribute( 'typeof' ).split( ' ' ).indexOf( 'mw:Transclusion' ) !== -1
) {
break;
}
}
node = node.parentNode;
}
return node;
}
/**
* Given a heading node, return the node on which the ID attribute is set.
*
* Also returns the offset within that node where the heading text starts.
*
* @param {HTMLElement} heading Heading node (`
`-``)
* @return {Array} Array containing a 'node' (HTMLElement) and offset (number)
*/
function getHeadlineNodeAndOffset( heading ) {
// This code assumes that $wgFragmentMode is [ 'html5', 'legacy' ] or [ 'html5' ]
var headline = heading,
offset = 0;
if ( headline.getAttribute( 'data-mw-comment-start' ) ) {
headline = headline.parentNode;
}
if ( !headline.getAttribute( 'id' ) ) {
// PHP HTML: Find the child with .mw-headline
headline = headline.querySelector( '.mw-headline' );
if ( headline ) {
if ( headline.querySelector( '.mw-headline-number' ) ) {
offset = 1;
}
} else {
headline = heading;
}
}
return {
node: headline,
offset: offset
};
}
/**
* Trim ASCII whitespace, as defined in the HTML spec.
*
* @param {string} str
* @return {string}
*/
function htmlTrim( str ) {
// https://infra.spec.whatwg.org/#ascii-whitespace
return str.replace( /^[\t\n\f\r ]+/, '' ).replace( /[\t\n\f\r ]+$/, '' );
}
/**
* Get the indent level of the node, relative to rootNode.
*
* The indent level is the number of lists inside of which it is nested.
*
* @private
* @param {Node} node
* @param {Node} rootNode
* @return {number}
*/
function getIndentLevel( node, rootNode ) {
var indent = 0, tagName;
while ( node ) {
if ( node === rootNode ) {
break;
}
tagName = node.tagName && node.tagName.toLowerCase();
if ( tagName === 'li' || tagName === 'dd' ) {
indent++;
}
node = node.parentNode;
}
return indent;
}
/**
* Get an array of sibling nodes that contain parts of the given thread item.
*
* @param {ThreadItem} item Thread item
* @return {HTMLElement[]}
*/
function getCoveredSiblings( item ) {
var range, ancestor, siblings, start, end;
range = item.getNativeRange();
ancestor = range.commonAncestorContainer;
if ( ancestor === range.startContainer || ancestor === range.endContainer ) {
return [ ancestor ];
}
siblings = ancestor.childNodes;
start = 0;
end = siblings.length - 1;
// Find first of the siblings that contains the item
while ( !contains( siblings[ start ], range.startContainer ) ) {
start++;
}
// Find last of the siblings that contains the item
while ( !contains( siblings[ end ], range.endContainer ) ) {
end--;
}
return Array.prototype.slice.call( siblings, start, end + 1 );
}
/**
* Get the nodes (if any) that contain the given thread item, and nothing else.
*
* @param {ThreadItem} item Thread item
* @return {HTMLElement[]|null}
*/
function getFullyCoveredSiblings( item ) {
var siblings, node, startMatches, endMatches, length, parent;
siblings = getCoveredSiblings( item );
function isIgnored( n ) {
// Ignore empty text nodes, and our own reply buttons
return ( n.nodeType === Node.TEXT_NODE && htmlTrim( n.textContent ) === '' ) ||
( n.className && n.className.indexOf( 'dt-init-replylink-buttons' ) !== -1 );
}
function isFirstNonemptyChild( n ) {
while ( ( n = n.previousSibling ) ) {
if ( !isIgnored( n ) ) {
return false;
}
}
return true;
}
function isLastNonemptyChild( n ) {
while ( ( n = n.nextSibling ) ) {
if ( !isIgnored( n ) ) {
return false;
}
}
return true;
}
startMatches = false;
node = siblings[ 0 ];
while ( node ) {
if ( item.range.startContainer === node && item.range.startOffset === 0 ) {
startMatches = true;
break;
}
if ( isIgnored( node ) ) {
node = node.nextSibling;
} else {
node = node.firstChild;
}
}
endMatches = false;
node = siblings[ siblings.length - 1 ];
while ( node ) {
length = node.nodeType === Node.TEXT_NODE ?
node.textContent.replace( /[\t\n\f\r ]+$/, '' ).length :
node.childNodes.length;
if ( item.range.endContainer === node && item.range.endOffset === length ) {
endMatches = true;
break;
}
if ( isIgnored( node ) ) {
node = node.previousSibling;
} else {
node = node.lastChild;
}
}
if ( startMatches && endMatches ) {
// If these are all of the children (or the only child), go up one more level
while (
( parent = siblings[ 0 ].parentNode ) &&
isFirstNonemptyChild( siblings[ 0 ] ) &&
isLastNonemptyChild( siblings[ siblings.length - 1 ] )
) {
siblings = [ parent ];
}
return siblings;
}
return null;
}
/**
* Traverse the document in depth-first order, calling the callback whenever entering and leaving
* a node. The walk starts before the given node and ends when callback returns a truthy value, or
* after reaching the end of the document.
*
* You might also think about this as processing XML token stream linearly (rather than XML
* nodes), as if we were parsing the document.
*
* @param {Node} node Node to start at
* @param {Function} callback Function accepting two arguments: `event` ('enter' or 'leave') and
* `node` (DOMNode)
* @return {Mixed} Final return value of the callback
*/
function linearWalk( node, callback ) {
var
result = null,
withinNode = node.parentNode,
beforeNode = node;
while ( beforeNode || withinNode ) {
if ( beforeNode ) {
result = callback( 'enter', beforeNode );
withinNode = beforeNode;
beforeNode = beforeNode.firstChild;
} else {
result = callback( 'leave', withinNode );
beforeNode = withinNode.nextSibling;
withinNode = withinNode.parentNode;
}
if ( result ) {
return result;
}
}
return result;
}
module.exports = {
isBlockElement: isBlockElement,
isRenderingTransparentNode: isRenderingTransparentNode,
cantHaveElementChildren: cantHaveElementChildren,
childIndexOf: childIndexOf,
closestElement: closestElement,
getIndentLevel: getIndentLevel,
getFullyCoveredSiblings: getFullyCoveredSiblings,
getTranscludedFromElement: getTranscludedFromElement,
getHeadlineNodeAndOffset: getHeadlineNodeAndOffset,
htmlTrim: htmlTrim,
linearWalk: linearWalk
};