Safari 8 toolbar extension: No 'hover' events

Originator:krohne
Number:rdar://18783194 Date Originated:27-Oct-2014
Status:Duplicate Resolved:
Product:Safari Product Version:8
Classification: Reproducible:Always
 
Duplicate of 18663126 (Open)

Summary:

After update to Yosemite, Safari 8 extensions no longer fire 'hover' (MouseEnter, MouseOver, MouseOut) events, even when the toolbar has focus. The mouse-move events fire only when elements are clicked.

Steps to Reproduce:
1. Build a new extension in Safari 8 Extension Builder
2. Add a new bar to Extension Chrome
3. Set attached 'bar.html' as the file for Bar 1
4. Install the extension
5. Reload
6. Move mouse over the toolbar elements. Note no color change.
7. Click on the toolbar elements. Note color change.
8. Watch console log. Note when JavaScript mouse events report.

Expected Results:
Moving the mouse over the elements should trigger 'hover' events and change element colors. Clicking on the elements or toolbar should not matter.

Actual Results:
Moving the mouse over the toolbar does not trigger mouse 'hover' events; elements do not change. Click on an element triggers the mouse events (MouseEnter, MouseOver). Clicking outside the element triggers a mouse event (MouseOut).

Version:
Safari version 8.0 (10600.1.25)

Notes:
No workaround found, yet.

Configuration:
Occurs in OSX Yosemite version 10.10, MacBook Pro (13", Late 2011)
Does not occur in OS X Mavericks 10.9, MacBook Pro (13", Late 2011)

<body> of bar.html:

	<input type=button value="Javascript Hover" id="hoverBtn" title="Javascript Hover">
	<script test="JavaScript">
      var hoverTest = document.getElementById('hoverBtn');
      hoverTest.addEventListener('mouseenter', function(event) {
         console.log('enter');
         event.target.style.color="green";
      });
      hoverTest.addEventListener('mouseover', function(event) {
         console.log('hovering');
         event.target.style.color="yellow";
      });
      hoverTest.addEventListener('mouseout', function(event) {
         console.log('out');
         event.target.style.color="red";
      });
	</script>
	&nbsp;&nbsp;

	<a href=''
		onMouseOver="this.style.color='yellow'"
		onMouseOut="this.style.color='red'"
		onMouseEnter="this.style.color='green'"
		>Inline Hover</a>
	&nbsp;&nbsp;

	<style>
		#cssHover:hover {color:green;}
	</style>
	<div style='float:right;margin-right:10px;' id='cssHover'>CSS Hover</div>

Comments


Please note: Reports posted here will not necessarily be seen by Apple. All problems should be submitted at bugreport.apple.com before they are posted here. Please only post information for Radars that you have filed yourself, and please do not include Apple confidential information in your posts. Thank you!