| Index: LayoutTests/fast/dom/shadow/hover-active-drag-distributed-nodes.html
|
| diff --git a/LayoutTests/fast/dom/shadow/hover-active-drag-distributed-nodes.html b/LayoutTests/fast/dom/shadow/hover-active-drag-distributed-nodes.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..9153907aae33cdcdcfc2615bc2fd0b57a1146c84
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/dom/shadow/hover-active-drag-distributed-nodes.html
|
| @@ -0,0 +1,109 @@
|
| +<!doctype html>
|
| +<html>
|
| +<head>
|
| +<template id='template'>
|
| + <style>
|
| + div {
|
| + background-color: rgb(255, 0, 0);
|
| + }
|
| + div:hover {
|
| + background-color: rgb(0, 128, 0);
|
| + }
|
| + div:hover:active {
|
| + background-color: rgb(0, 255, 255);
|
| + }
|
| + div:active {
|
| + background-color: rgb(0, 0, 255);
|
| + }
|
| + </style>
|
| + <div id='div-in-shadow'>
|
| + <content></content>
|
| + </div>
|
| +</template>
|
| +<style>
|
| + span:hover {
|
| + color: rgb(0, 128, 0);
|
| + }
|
| + span:active:hover {
|
| + color: rgb(0, 255, 255);
|
| + }
|
| + span:active {
|
| + color: rgb(0, 0, 255);
|
| + }
|
| +</style>
|
| +</head>
|
| +<body>
|
| + <div id='host'>Top-level text <span>Nested text</span></div>
|
| + <div id='other'>Other div</div>
|
| + <pre id='console'></pre>
|
| +</body>
|
| +
|
| +<script src="../../js/resources/js-test-pre.js"></script>
|
| +<script>
|
| +var backgroundColor, textColor;
|
| +
|
| +function shouldHaveBackgroundColor(element, bg) {
|
| + backgroundColor = getComputedStyle(element, null).getPropertyValue("background-color")
|
| + shouldBeEqualToString('backgroundColor', bg)
|
| +}
|
| +
|
| +function shouldHaveTextColor(element, col) {
|
| + textColor = getComputedStyle(element, null).getPropertyValue("color")
|
| + shouldBeEqualToString('textColor', col)
|
| +}
|
| +
|
| +var host = document.getElementById('host');
|
| +var shadowRoot = host.webkitCreateShadowRoot();
|
| +var temp = document.getElementById('template');
|
| +shadowRoot.appendChild(temp.content.cloneNode(true));
|
| +var div = shadowRoot.querySelector('div');
|
| +var span = host.querySelector(':scope > span');
|
| +
|
| +var divRect = div.getBoundingClientRect();
|
| +var spanRect = span.getBoundingClientRect();
|
| +var otherRect = document.getElementById('other').getBoundingClientRect();
|
| +
|
| +eventSender.dragMode = false;
|
| +eventSender.mouseDown();
|
| +eventSender.mouseUp();
|
| +
|
| +var posDivNotSpanX = parseInt((spanRect.right + divRect.right) / 2);
|
| +var spanCenterPosX = parseInt((spanRect.left + spanRect.right) / 2);
|
| +var spanCenterPosY = parseInt((spanRect.top + spanRect.bottom) / 2);
|
| +var topTextPosX = parseInt((divRect.left + spanRect.left) / 2);
|
| +var topTextPosY = spanCenterPosY;
|
| +var otherPosX = parseInt((otherRect.left + otherRect.right) / 2);
|
| +var otherPosY = parseInt((otherRect.top + otherRect.bottom) / 2);
|
| +
|
| +eventSender.mouseMoveTo(posDivNotSpanX, spanCenterPosY);
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 128, 0)');
|
| +eventSender.mouseDown();
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 255, 255)');
|
| +eventSender.mouseUp();
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 128, 0)');
|
| +eventSender.mouseMoveTo(otherPosX, otherPosY);
|
| +shouldHaveBackgroundColor(div, 'rgb(255, 0, 0)');
|
| +
|
| +eventSender.mouseMoveTo(spanCenterPosX, spanCenterPosY);
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 128, 0)');
|
| +shouldHaveTextColor(span, 'rgb(0, 128, 0)');
|
| +eventSender.mouseDown();
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 255, 255)');
|
| +shouldHaveTextColor(span, 'rgb(0, 255, 255)');
|
| +eventSender.mouseUp();
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 128, 0)');
|
| +shouldHaveTextColor(span, 'rgb(0, 128, 0)');
|
| +eventSender.mouseMoveTo(otherPosX, otherPosY);
|
| +shouldHaveBackgroundColor(div, 'rgb(255, 0, 0)');
|
| +shouldHaveTextColor(span, 'rgb(0, 0, 0)');
|
| +
|
| +eventSender.mouseMoveTo(topTextPosX, topTextPosY);
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 128, 0)');
|
| +eventSender.mouseDown();
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 255, 255)');
|
| +eventSender.mouseUp();
|
| +shouldHaveBackgroundColor(div, 'rgb(0, 128, 0)');
|
| +eventSender.mouseMoveTo(otherPosX, otherPosY);
|
| +shouldHaveBackgroundColor(div, 'rgb(255, 0, 0)');
|
| +</script>
|
| +</html>
|
|
|