[SOLVED] Cannot get mouse pointer information from mousemove event

Cannot get mouse pointer information from mousemove event

In normal JS Polymer, I can do something like this:

<dom-module id="my-module">
  <template>
    <div on-mousemove="mousemove">Text here!</div>
  </template>
  <script>
    Polymer({
      is: 'my-module',

      mousemove: function (event) {
        console.log(event);
      }
    });
  </script>
</dom-module>

This will print a mouse movement event containing the coordinates of the mouse pointer.

However, consider the following Dart project:

pubspec.yaml

name: example
description: "stuff here"
version: 0.1.0
dependencies:
  polymer: ^1.0.0-rc.18
  web_components: ^0.12.0
  browser: ^0.10.0
transformers:
- polymer:
    entry_points:
    - web/index.html

web/index.dart

library photon.index;

import 'package:example/test.dart';

export 'package:polymer/init.dart';
import 'package:polymer/polymer.dart';

web/index.html

<head>
  <script src="packages/web_components/webcomponents-lite.min.js"></script>
  <script src="packages/web_components/dart_support.js"></script>
</head>
<body unresolved>
  <my-module></my-module>

  <script type="application/dart" src="index.dart"></script>
  <script src="packages/browser/dart.js"></script>
</body>

lib/test.dart

@HtmlImport('test.html')
library example.test;

import 'package:polymer/polymer.dart';
import 'package:web_components/web_components.dart' show HtmlImport;

@PolymerRegister('my-module')
class MyModule extends PolymerElement {
  MyModule.created() : super.created();

  @reflectable
  void mousemove(event, [_]) {
    print(event);
  }
}

lib/test.html

<dom-module id="my-module">
  <template>
    <div on-mousemove="mousemove" id="target">Text here!</div>
  </template>
</dom-module>

This is roughly equivalent to the JavaScript version. However, this will instead print an instance of CustomEventWrapper, which lacks the information on where the cursor is located. Is there some way to access the mouse pointer information?

Solution

This should work

  @reflectable
  void mousemove(CustomEventWrapper event, [_]) {
    MouseEvent mouseEvent = event.original;
    print('x: ${mouseEvent.client.x}');
    print('y: ${mouseEvent.client.y}');
  }