Added offset document measurement to Element.

tests/html/element_test.dart

 // Copyright (c) 2011, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 library ElementTest;
 import '../../pkg/unittest/lib/unittest.dart';
 import '../../pkg/unittest/lib/html_individual_config.dart';
 import 'dart:async';
 import 'dart:html';
 import 'dart:svg' as svg;
@@ skipping 41 matching lines @@
     test('computedStyle', () {
       final element = document.body;
       var style = element.getComputedStyle();
       expect(style.getPropertyValue('left'), 'auto');
     });
 
     test('client position synchronous', () {
       final container = new Element.tag("div");
       container.style.position = 'absolute';
       container.style.top = '8px';
-      container.style.left = '8px';
+      container.style.left = '9px';
       final element = new Element.tag("div");
       element.style.width = '200px';
       element.style.height = '200px';
       container.children.add(element);
       document.body.children.add(container);
 
       expect(element.client.width, greaterThan(100));
       expect(element.client.height, greaterThan(100));
       expect(element.offset.width, greaterThan(100));
       expect(element.offset.height, greaterThan(100));
       expect(element.scrollWidth, greaterThan(100));
       expect(element.scrollHeight, greaterThan(100));
-      expect(element.getBoundingClientRect().left, 8);
+      expect(element.getBoundingClientRect().left, 9);
       expect(element.getBoundingClientRect().top, 8);
+
+      expect(element.documentOffset.x, 9);

[Jennifer Messerly, 2013/07/24 23:26:23]

slightly confused, should this be "documentOffset" or "docOffset"?

[Emily Fortuna, 2013/07/25 00:20:07]

oh, whoops. It's docOffset. I had moved a variant of the test out into a
temporary test for my local testing because there are so many element_tests, but
I forgot to fix this when I moved the test back here.

+      expect(element.documentOffset.y, 8);
       container.remove();
     });
   });
 
   group('constructors', () {
     test('error', () {
       expect(() => new Element.html('<br/><br/>'), throwsArgumentError);
     });
 
     test('.html has no parent', () =>
@@ skipping 631 matching lines @@
       expect(filtered, isElementIterable);
     });
 
     test('sublist', () {
       var range = makeElList().sublist(1, 3);
       expect(range, isElementList);
       expect(range[0], isImageElement);
       expect(range[1], isInputElement);
     });
   });
+  void initPage() {
+    /* Set up the following hierarchy:
+    <ul class="level-1">
+      <li class="item-i">I</li>
+      <li class="item-ii" style="position: relative; top: 4px;">II
+        <ul class="level-2">
+          <li class="item-a">A</li>
+          <li class="item-b"
+              style="position: relative; top: 20px; left: 15px;">B
+            <ul class="level-3">
+              <li class="item-1">1</li>
+              <li class="item-2">2</li>
+              <li class="item-3">3</li>
+            </ul>
+          </li>
+          <li class="item-c">C</li>
+        </ul>
+      </li>
+      <li class="item-iii">III</li>
+    </ul> */
+    var level1 = new UListElement()
+      ..classes.add('level-1')
+      ..children.add(new LIElement()..innerHtml = 'I');
+    var itemii = new LIElement()
+      ..classes.add('item-ii')
+      ..style.position = 'relative'
+      ..style.top = '4px'
+      ..innerHtml = 'II';
+    level1.children.add(itemii);
+    var level2 = new UListElement();
+    itemii.children.add(level2);
+    var itema = new LIElement()
+      ..classes.add('item-a')
+      ..innerHtml = 'A';
+    var item1 = new LIElement()
+      ..classes.add('item-1')
+      ..innerHtml = '1';
+    var item2 = new LIElement()
+      ..classes.add('item-2')
+      ..innerHtml = '2';
+    var level3 = new UListElement()
+      ..children.addAll([item1, item2]);
+    var itemb = new LIElement()
+      ..classes.add('item-b')
+      ..style.position = 'relative'
+      ..style.top = '20px'
+      ..style.left = '150px'
+      ..innerHtml = 'B'
+      ..children.add(level3);
+    level2.children.addAll([itema, itemb, new LIElement()..innerHtml = 'C']);
+    document.body.append(level1);
+
+    var bar = new DivElement()..classes.add('bar');
+    var style = bar.style;
+    style..position = 'absolute'
+         ..top = '8px'
+         ..left = '90px';
+    var baz = new DivElement()..classes.add('baz');
+    style = baz.style;
+    style..position = 'absolute'
+         ..top = '600px'
+         ..left = '7000px';
+    bar.children.add(baz);
+
+    var quux = new DivElement()..classes.add('quux');
+    var qux = new DivElement()
+      ..classes.add('qux')
+      ..children.add(quux);
+
+    document.body.append(bar);
+    document.body.append(qux);
+  }
+
+  group('offset', () {
+    setUp(initPage);
+
+    test('offsetTo', () {
+      var itema = query('.item-a');
+      var itemb = query('.item-b');
+      var item1 = query('.item-1');
+      var itemii = query('.item-ii');
+      var level1 = query('.level-1');
+      var baz = query('.baz');
+      var bar = query('.bar');
+      var qux = query('.qux');
+      var quux = query('.quux');
+
+      var point = itema.offsetTo(itemii);
+      expect(point.x, 40);
+      expect(point.y, inInclusiveRange(17, 20));
+
+      expect(baz.offsetTo(bar).x, 7000);
+      expect(baz.offsetTo(bar).y, inInclusiveRange(599, 604));
+
+      qux.style.position = 'fixed';
+      expect(quux.offsetTo(qux).x, 0);
+      expect(quux.offsetTo(qux).y, 0);
+
+      point = item1.offsetTo(itemb);
+      expect(point.x, 40);
+      expect(point.y, inInclusiveRange(17, 20));
+      point = itemb.offsetTo(itemii);
+      expect(point.x, 190);
+      expect(point.y, inInclusiveRange(54, 60));
+      point = item1.offsetTo(itemii);
+      expect(point.x, 230);
+      expect(point.y, inInclusiveRange(74, 80));
+    });
+
+    test('docOffset', () {
+      var bar = query('.bar');
+      var baz = query('.baz');
+      var qux = query('.qux');
+      var quux = query('.quux');
+      var itema = query('.item-a');
+      var itemb = query('.item-b');
+      var item1 = query('.item-1');
+      var itemii = query('.item-ii');
+
+      expect(itema.docOffset.x, 88);
+      expect(itema.docOffset.y, inInclusiveRange(119, 124));
+
+      expect(itemii.docOffset.x, 48);
+      expect(itemii.docOffset.y, inInclusiveRange(101, 105));
+
+      expect(itemb.docOffset.x, 238);
+      expect(itemb.docOffset.y, inInclusiveRange(157, 165));
+
+      expect(item1.docOffset.x, 278);
+      expect(item1.docOffset.y, inInclusiveRange(175, 182));
+
+      expect(bar.docOffset.x, 90);
+      expect(bar.docOffset.y, 8);
+
+      expect(baz.docOffset.x, 7090);
+      expect(baz.docOffset.y, 608);
+
+      expect(qux.docOffset.x, 8);
+      expect(qux.docOffset.y, inInclusiveRange(222, 232));
+
+      expect(quux.docOffset.x, 8);
+      expect(quux.docOffset.y, inInclusiveRange(222, 232));
+    });
+  });
+
 }