bind mouseenter/leave events on <svelte:window> to document (#1484)

src/compile/nodes/Window.ts

@@ -33,6 +33,11 @@ const readonly = new Set([
 	'online',
 ]);
 
+const specialEventTargets = new Map([
+	['mouseenter', 'document'],
+	['mouseleave', 'document'],
+]);
+
 export default class Window extends Node {
 	type: 'Window';
 	handlers: EventHandler[];
@@ -93,15 +98,17 @@ export default class Window extends Node {
 					${handlerName}.destroy();
 				`);
 			} else {
+				const target = specialEventTargets.get(handler.name) || 'window';
+
 				block.builders.init.addBlock(deindent`
 					function ${handlerName}(event) {
 						${handlerBody}
 					}
-					window.addEventListener("${handler.name}", ${handlerName});
+					${target}.addEventListener("${handler.name}", ${handlerName});
 				`);
 
 				block.builders.destroy.addBlock(deindent`
-					window.removeEventListener("${handler.name}", ${handlerName});
+					${target}.removeEventListener("${handler.name}", ${handlerName});
 				`);
 			}
 		});

test/runtime/samples/window-event-special-target/_config.js

@@ -0,0 +1,11 @@
+export default {
+	test(assert, component, target, window) {
+		assert.equal(component.get().events.toString(), '');
+		const event1 = new window.Event('mouseenter');
+		window.document.dispatchEvent(event1);
+		assert.equal(component.get().events.toString(), 'enter');
+		const event2 = new window.Event('mouseleave');
+		window.document.dispatchEvent(event2);
+		assert.equal(component.get().events.toString(), 'enter,leave');
+	},
+};

test/runtime/samples/window-event-special-target/main.html

@@ -0,0 +1,12 @@
+<svelte:window on:mouseenter='log("enter")' on:mouseleave='log("leave")'/>
+
+<script>
+	export default {
+		data: () => ({ events: [] }),
+		methods: {
+			log(event) {
+				this.set({ events: this.get().events.concat(event) });
+			},
+		},
+	};
+</script>