-
Notifications
You must be signed in to change notification settings - Fork 165
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #309 from churkin/i294
Tap doesn't set hoverPseudoClass on an element in Android (close #294)
- Loading branch information
Showing
6 changed files
with
152 additions
and
173 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,82 @@ | ||
| import INTERNAL_ATTRS from '../../../processing/dom/internal-attributes'; | ||
| import SandboxBase from '../base'; | ||
| import nativeMethods from '../native-methods'; | ||
| import * as domUtils from '../../utils/dom'; | ||
|
|
||
| export default class HoverSandbox extends SandboxBase { | ||
| constructor (listeners) { | ||
| super(); | ||
|
|
||
| this.listeners = listeners; | ||
|
|
||
| this.hoverElementFixed = false; | ||
| this.lastHoveredElement = null; | ||
| } | ||
|
|
||
| static _setHoverMarker (newHoveredElement, jointParent) { | ||
| if (jointParent) | ||
| nativeMethods.setAttribute.call(jointParent, INTERNAL_ATTRS.hoverPseudoClass, ''); | ||
|
|
||
| while (newHoveredElement && newHoveredElement.tagName) { | ||
| // NOTE: Assign a pseudo-class marker to the elements until the joint parent is found. | ||
| if (newHoveredElement !== jointParent) { | ||
| nativeMethods.setAttribute.call(newHoveredElement, INTERNAL_ATTRS.hoverPseudoClass, ''); | ||
| newHoveredElement = newHoveredElement.parentNode; | ||
| } | ||
| else | ||
| break; | ||
| } | ||
| } | ||
|
|
||
| // NOTE: In this method, we go up to the tree of elements and look for a joint parent for the | ||
| // previous and new hovered elements. Processing is needed only until that parent is found. | ||
| // In this case, we’ll reduce the number of dom calls. | ||
| _clearHoverMarkerUntilJointParent (newHoveredElement) { | ||
| var jointParent = null; | ||
|
|
||
| if (this.lastHoveredElement) { | ||
| var el = this.lastHoveredElement; | ||
|
|
||
| while (el && el.tagName) { | ||
| // NOTE: Check that the current element is a joint parent for the hovered elements. | ||
| if (el.contains && !el.contains(newHoveredElement)) { | ||
| nativeMethods.removeAttribute.call(el, INTERNAL_ATTRS.hoverPseudoClass); | ||
| el = el.parentNode; | ||
| } | ||
| else | ||
| break; | ||
| } | ||
|
|
||
| jointParent = el; | ||
|
|
||
| if (jointParent) | ||
| nativeMethods.removeAttribute.call(jointParent, INTERNAL_ATTRS.hoverPseudoClass); | ||
| } | ||
|
|
||
| return jointParent; | ||
| } | ||
|
|
||
| _hover (el) { | ||
| if (!this.hoverElementFixed && !domUtils.isShadowUIElement(el)) { | ||
| var jointParent = this._clearHoverMarkerUntilJointParent(el); | ||
|
|
||
| HoverSandbox._setHoverMarker(el, jointParent); | ||
|
|
||
| this.lastHoveredElement = el; | ||
| } | ||
| } | ||
|
|
||
| fixHoveredElement () { | ||
| this.hoverElementFixed = true; | ||
| } | ||
|
|
||
| freeHoveredElement () { | ||
| this.hoverElementFixed = false; | ||
| } | ||
|
|
||
| attach (window) { | ||
| super.attach(window); | ||
|
|
||
| this.listeners.addInternalEventListener(window, ['mouseover', 'touchstart'], e => this._hover(e.target)); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| var INTERNAL_ATTRS = hammerhead.get('../processing/dom/internal-attributes'); | ||
|
|
||
| var hover = hammerhead.sandbox.event.hover; | ||
| var browserUtils = hammerhead.utils.browser; | ||
| var eventSimulator = hammerhead.sandbox.event.eventSimulator; | ||
|
|
||
| function hoverElement (el) { | ||
| if (browserUtils.hasTouchEvents) | ||
| eventSimulator.touchstart(el, {}); | ||
| else | ||
| eventSimulator.mouseover(el, {}); | ||
| } | ||
|
|
||
| function isHovered (el) { | ||
| return el.getAttribute(INTERNAL_ATTRS.hoverPseudoClass) === ''; | ||
| } | ||
|
|
||
| test('hover pseudo class', function () { | ||
| var $parent = $('<div style="width:100px; height:100px; background-color: Red" class="parent">').appendTo($('body')); | ||
| var $child = $('<div style="width:50px; height:50px; background-color: Blue" class="child">').appendTo($parent); | ||
|
|
||
| ok(!isHovered($parent[0])); | ||
| ok(!isHovered($child[0])); | ||
|
|
||
| hoverElement($parent[0]); | ||
| ok(isHovered($parent[0])); | ||
| ok(!isHovered($child[0])); | ||
|
|
||
| hoverElement($child[0]); | ||
| ok(isHovered($parent[0])); | ||
| ok(isHovered($child[0])); | ||
|
|
||
| hoverElement($('body')[0]); | ||
| ok(!isHovered($parent[0])); | ||
| ok(!isHovered($child[0])); | ||
|
|
||
| $parent.remove(); | ||
| $child.remove(); | ||
| }); | ||
|
|
||
| test('hover.fixHoveredElement, hover.freeHoveredElement (B254111)', function () { | ||
| var $parent = $('<div style="width:100px; height:100px; background-color: Red" class="parent">').appendTo($('body')); | ||
| var $child = $('<div style="width:50px; height:50px; background-color: Blue" class="child">').appendTo($parent); | ||
|
|
||
| ok(!isHovered($parent[0])); | ||
| ok(!isHovered($child[0])); | ||
|
|
||
| hover.fixHoveredElement(); | ||
|
|
||
| hoverElement($parent[0]); | ||
| ok(!isHovered($parent[0])); | ||
| ok(!isHovered($child[0])); | ||
|
|
||
| hover.freeHoveredElement(); | ||
|
|
||
| hoverElement($child[0]); | ||
| ok(isHovered($parent[0])); | ||
| ok(isHovered($child[0])); | ||
|
|
||
| hoverElement($('body')[0]); | ||
| ok(!isHovered($parent[0])); | ||
| ok(!isHovered($child[0])); | ||
|
|
||
| $parent.remove(); | ||
| $child.remove(); | ||
| }); |