Not Quite Ready for Dart M2

‹prev | My Chain | next›

The Dart team gave the world a lovely present: the M2 release of the langauge. This means more than new language awesomeness—it means that it's time to run the dart_analyzer again.

Many of the changes that I need to make are minor changes to the API—things like removing parentheses from getters, specifying default values, etc. Among the more interesting things that changed are the departures from JavaScript naming of standard DOM things. I get a lot of deprecation warnings along the lines of:

file:/home/chris/repos/dart-comics/app/lib/Views.Comics.dart:22:8: Field 'innerHTML' is deprecated
    21:   render() {  
    22:     el.innerHTML = template(collection);

It is now innerHtml instead of innerHTML. I, for one, definitely appreciate the switch for consistency's sake.

Another warning is more of a quasi-bug than it is an M2 issue. The warning is:

file:/home/chris/repos/dart-comics/app/lib/Views.AddComicForm.dart:13:10: 'ModalDialog' is not assignable to 'Element'
    12:   post_initialize() {
    13:     el = new ModalDialog();
                 ~~~~~~~~~~~~~~~~~

In a view, I am setting the el property to a locally written ModalDialog object, which is a perfectly reasonable thing to do. The reason that dart_analyzer is complaining is that the el property was declared as an Element whereas ModalDialog is a plain old Dart class.

The fix is easy enough, I just need to declare ModalDialog as extending (subclassing) Element:

library modal_dialog;

import "dart:html";

class ModalDialog extends Element {
  Element el, bg;
  var resizeHandler;

  ModalDialog(): this.tag('div');

  ModalDialog.tag(String tag) {
    el = new Element.tag(tag);
    resizeHandler = _drawBackground;
  }

  ModalDialog.html(String html) {
    el = new Element.tag('div');
    el.innerHtml = html;
  }
  // ...
}

And that fixes my problem. Except it introduces two new problems:

file:/home/chris/repos/dart-comics/app/lib/ModalDialog.dart:11:3: super type Element does not have a default constructor
    10: 
    11:   ModalDialog.tag(String tag) {
          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
file:/home/chris/repos/dart-comics/app/lib/ModalDialog.dart:16:3: super type Element does not have a default constructor
    15: 
    16:   ModalDialog.html(String html) {
          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

This, I think is probably a legitimate bug. Unfortunately, I am unsure how to fix it. The Element constructors are factory constructors, so I can eliminate the dart_analyzer warning with a simple factory constructor like:

class ModalDialog extends DivElement {
  Element el = new DivElement();
  Element bg;
  var resizeHandler = _drawBackground;

  factory ModalDialog() => new DivElement();
  // ...
}

The dart_analyzer warnings go away, but the code no longer runs in Dartium. When I try to start a ModalDialog, I receive the following error:

Internal error: 'http://localhost:8000/packages/scripts/ModalDialog.dart': Error: line 5 pos 7: class 'ModalDialog' is trying to extend a native fields class, but library 'http://localhost:8000/packages/scripts/ModalDialog.dart' has no native resolvers
class ModalDialog extends DivElement {

This would seem to indicate that there is no way to create an Element subclass in Dart, which would be a bummer as I would like to create element-like things like modal dialogs. I have to call it a night here, but I will try to revisit tomorrow.



Day #603