Use tree order when z-index is the same

This commit is contained in:
Niklas von Hertzen
2017-08-09 11:52:42 +08:00
parent ed92d2354c
commit 77393074ba
36 changed files with 392 additions and 337 deletions

View File

@ -80,9 +80,11 @@ export default class NodeContainer {
bounds: Bounds;
curvedBounds: BoundCurves;
image: ?string;
index: number;
constructor(node: HTMLElement, parent: ?NodeContainer, imageLoader: ImageLoader) {
constructor(node: HTMLElement, parent: ?NodeContainer, imageLoader: ImageLoader, index: number) {
this.parent = parent;
this.index = index;
this.childNodes = [];
const defaultView = node.ownerDocument.defaultView;
const style = defaultView.getComputedStyle(node, null);

View File

@ -17,11 +17,13 @@ export const NodeParser = (
logger.log(`Starting node parsing`);
}
const container = new NodeContainer(node, null, imageLoader);
let index = 0;
const container = new NodeContainer(node, null, imageLoader, index++);
const stack = new StackingContext(container, null, true);
createPseudoHideStyles(node.ownerDocument);
parseNodeTree(node, container, stack, imageLoader);
parseNodeTree(node, container, stack, imageLoader, index);
if (__DEV__) {
logger.log(`Finished parsing node tree`);
@ -41,7 +43,8 @@ const parseNodeTree = (
node: HTMLElement,
parent: NodeContainer,
stack: StackingContext,
imageLoader: ImageLoader
imageLoader: ImageLoader,
index: number
): void => {
for (let childNode = node.firstChild, nextNode; childNode; childNode = nextNode) {
nextNode = childNode.nextSibling;
@ -57,7 +60,7 @@ const parseNodeTree = (
if (IGNORED_NODE_NAMES.indexOf(childNode.nodeName) === -1) {
inlinePseudoElement(childNode, PSEUDO_BEFORE);
inlinePseudoElement(childNode, PSEUDO_AFTER);
const container = new NodeContainer(childNode, parent, imageLoader);
const container = new NodeContainer(childNode, parent, imageLoader, index++);
if (container.isVisible()) {
if (childNode.tagName === 'INPUT') {
// $FlowFixMe
@ -89,12 +92,12 @@ const parseNodeTree = (
);
parentStack.contexts.push(childStack);
if (SHOULD_TRAVERSE_CHILDREN) {
parseNodeTree(childNode, container, childStack, imageLoader);
parseNodeTree(childNode, container, childStack, imageLoader, index);
}
} else {
stack.children.push(container);
if (SHOULD_TRAVERSE_CHILDREN) {
parseNodeTree(childNode, container, stack, imageLoader);
parseNodeTree(childNode, container, stack, imageLoader, index);
}
}
}

View File

@ -395,5 +395,6 @@ const sortByZIndex = (a: StackingContext, b: StackingContext): number => {
} else if (a.container.style.zIndex.order < b.container.style.zIndex.order) {
return -1;
}
return 0;
return a.container.index > b.container.index ? 1 : -1;
};