Skip to content

Commit

Permalink
Improve Mouse Wheel (#1785)
Browse files Browse the repository at this point in the history
* Improve Mouse Wheel

* Code factor
  • Loading branch information
kblok authored Jul 20, 2021
1 parent ad28b6f commit 32a57a6
Show file tree
Hide file tree
Showing 5 changed files with 134 additions and 5 deletions.
43 changes: 43 additions & 0 deletions lib/PuppeteerSharp.TestServer/wwwroot/input/wheel.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body {
min-height: 100vh;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
}

div {
width: 105px;
height: 105px;
background: #cdf;
padding: 5px;
}
</style>
<title>Element: wheel event - Scaling_an_element_via_the_wheel - code sample</title>
</head>
<body>
<div>Scale me with your mouse wheel.</div>
<script>
function zoom(event) {
event.preventDefault();

scale += event.deltaY * -0.01;

// Restrict scale
scale = Math.min(Math.max(.125, scale), 4);

// Apply scale transform
el.style.transform = `scale(${scale})`;
}

let scale = 1;
const el = document.querySelector('div');
el.onwheel = zoom;
</script>
</body>
</html>
73 changes: 69 additions & 4 deletions lib/PuppeteerSharp.Tests/MouseTests/MouseTests.cs
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,35 @@ public MouseTests(ITestOutputHelper output) : base(output)
{
}

[PuppeteerTest("mouse.spec.ts", "Mouse", "should click the document")]
[Fact(Timeout = TestConstants.DefaultTestTimeout)]
public async Task ShouldClickTheDocument()
{
await Page.EvaluateFunctionAsync(@"() => {
globalThis.clickPromise = new Promise((resolve) => {
document.addEventListener('click', (event) => {
resolve({
type: event.type,
detail: event.detail,
clientX: event.clientX,
clientY: event.clientY,
isTrusted: event.isTrusted,
button: event.button,
});
});
});
}");
await Page.Mouse.ClickAsync(50, 60);
var e = await Page.EvaluateFunctionAsync<MouseEvent>("() => globalThis.clickPromise");

Assert.Equal("click", e.Type);
Assert.Equal(1, e.Detail);
Assert.Equal(50, e.ClientX);
Assert.Equal(60, e.ClientY);
Assert.True(e.IsTrusted);
Assert.Equal(0, e.Button);
}

[PuppeteerTest("mouse.spec.ts", "Mouse", "should resize the textarea")]
[SkipBrowserFact(skipFirefox: true)]
public async Task ShouldResizeTheTextarea()
Expand Down Expand Up @@ -115,16 +144,37 @@ public async Task ShouldSetModifierKeysOnClick()
}
}

[PuppeteerTest("mouse.spec.ts", "Mouse", "should send mouse wheel events")]
[SkipBrowserFact(skipFirefox: true)]
public async Task ShouldSendMouseWheelEvents()
{
await Page.GoToAsync(TestConstants.ServerUrl + "/input/wheel.html");
var elem = await Page.QuerySelectorAsync("div");
var boundingBoxBefore = await elem.BoundingBoxAsync();
Assert.Equal(115, boundingBoxBefore.Width);
Assert.Equal(115, boundingBoxBefore.Height);

await Page.Mouse.MoveAsync(
boundingBoxBefore.X + (boundingBoxBefore.Width / 2),
boundingBoxBefore.Y + (boundingBoxBefore.Height / 2)
);

await Page.Mouse.WheelAsync(0, -100);
var boundingBoxAfter = await elem.BoundingBoxAsync();
Assert.Equal(230, boundingBoxAfter.Width);
Assert.Equal(230, boundingBoxAfter.Height);
}

[PuppeteerTest("mouse.spec.ts", "Mouse", "should tween mouse movement")]
[SkipBrowserFact(skipFirefox: true)]
public async Task ShouldTweenMouseMovement()
{
await Page.Mouse.MoveAsync(100, 100);
await Page.EvaluateExpressionAsync(@"{
window.result = [];
document.addEventListener('mousemove', event => {
window.result.push([event.clientX, event.clientY]);
});
window.result = [];
document.addEventListener('mousemove', event => {
window.result.push([event.clientX, event.clientY]);
});
}");
await Page.Mouse.MoveAsync(200, 300, new MoveOptions { Steps = 5 });
Assert.Equal(new[] {
Expand Down Expand Up @@ -192,5 +242,20 @@ public void Scroll(decimal deltaX, decimal deltaY)
Y = Math.Max(0, Y + deltaY);
}
}

internal struct MouseEvent
{
public string Type { get; set; }

public int Detail { get; set; }

public int ClientX { get; set; }

public int ClientY { get; set; }

public bool IsTrusted { get; set; }

public int Button { get; set; }
}
}
}
6 changes: 5 additions & 1 deletion lib/PuppeteerSharp/Input/Mouse.cs
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,11 @@ public Task WheelAsync(decimal deltaX, decimal deltaY)
{
Type = MouseEventType.MouseWheel,
DeltaX = deltaX,
DeltaY = deltaY
DeltaY = deltaY,
X = _x,
Y = _y,
Modifiers = _keyboard.Modifiers,
PointerType = PointerType.Mouse
});
}
}
15 changes: 15 additions & 0 deletions lib/PuppeteerSharp/Input/PointerType.cs
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
using System.Runtime.Serialization;
using Newtonsoft.Json;
using Newtonsoft.Json.Converters;

namespace PuppeteerSharp.Input
{
[JsonConverter(typeof(StringEnumConverter))]
internal enum PointerType
{
[EnumMember(Value = "mouse")]
Mouse,
[EnumMember(Value = "pen")]
Pen,
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -19,5 +19,7 @@ internal class InputDispatchMouseEventRequest
public decimal DeltaX { get; set; }

public decimal DeltaY { get; set; }

public PointerType PointerType { get; set; }
}
}

0 comments on commit 32a57a6

Please sign in to comment.