Bug 88466 – Web Inspector: Forced ':hover' pseudo-state does not bubble to ancestor elements

• Status: ASSIGNED
• Component: Web Inspector

[BrianMB]

This is problematic if an element with :hover styling is hidden until a :hover state is activated on its ancestor.

When :hover is checked, the current element and all its parents should receive the :hover state as well.

EXAMPLE
===
Say we have a common nav setup:

ul > li > ul {
    display: none;
}
ul > li:hover > ul {
    display: block;
}
ul > li > ul a:hover {
    color: green;
}

In this example, I want to tweak the link's :hover color.  However, I can't easily interact with Web Inspector and hover over the <li> at the same time.  Thus, the link is hidden entirely from view.

[BrianMB]

Created attachment 146136 [details]
Screenshot of the "Toggle Element State" menu.

This ticket is in regards to the "Toggle Element State" menu, pictured in the attachment.

[Alexander Pavlov (apavlov)]

Created attachment 157263 [details]
Patch

[Pavel Feldman]

Comment on attachment 157263 [details]
Patch

r- as per out discussion offline: storing counters along with the node state would simplify things.

[Alexander Pavlov (apavlov)]

Created attachment 157672 [details]
Patch

[Pavel Feldman]

Comment on attachment 157672 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=157672&action=review

> Source/WebCore/inspector/InspectorCSSAgent.cpp:724
> +        m_forcedPseudoStateManager->forgetForcedPseudoState(nodeId);

I think that the fundamental problem is that we only force state from within getMatchedStyles call. We should instead provide a full control over the emulation via the protocol.

[Alexander Pavlov (apavlov)]

Created attachment 157947 [details]
Patch

[Pavel Feldman]

Comment on attachment 157947 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=157947&action=review

> Source/WebCore/inspector/InspectorCSSAgent.cpp:935
> +    unsigned currentForcedPseudoState = m_forcedPseudoStateManager->fullForcedPseudoState(nodeId);

Ok, this is not good - we now have both: InspectorInstrumentation and front-end calling different overloads of forcePseudoState. It might be a good idea to rename it back to setForcedPseudoState. Also, I think I have a pseudo code that does what you want to achieve with this test and only takes a dozen of lines. It introduces a convenience struct ForcedPseudoState { unsigned stateMask; unsigned hoverCount; } to achieve that.

    if (forcedPseudoState.hover && !currentForcedPseudoState.hover) {
        for (Element* currentElement = element; currentElement; currentElement = currentElement->parentElement())
            m_nodeIdToForcedPseudoState[m_domAgent->boundNodeId(parentElement)].hoverCount++;
    } else if (!forcedPseudoState.hover && currentForcedPseudoState.hover) {
        for (Element* currentElement = element; currentElement; currentElement = currentElement->parentElement())
            int id = m_domAgent->boundNodeId(parentElement);
            PseudoState& state = m_nodeIdToForcedPseudoState[id];
            state.hoverCount--;
            if (!parentState.stateMask && !parentState.hoverCount)
                m_nodeIdToForcedPseudoState.remove(id);
    }

But I guess we don't even need a counter - there can only be one hovered element at a time, so we only need to mark that element + its path to the document.

Another point that is missing is DOM mutations - what if the node that has been hovered has been removed from the DOM - we need to clean its path as well.

[Radar WebKit Bug Importer]

<rdar://problem/19107056>

[Radar WebKit Bug Importer]

<rdar://problem/19107058>