LoginSignup
4

More than 5 years have passed since last update.

Polymer.dart のデータバインディングでの型が変わった

Posted at

1年前に作った Polymer.dart アプリケーション が、最新の Google Chrome で動かなくなっていたので、動くように修正した。ついでに Polymer.dart などの依存パッケージのアップデートをしていたらハマッたのでメモ。

端的に描いてしまうと Polymer.dart の <input type="number"> でバインディングされる型が変わった。

具体的には:

  • Polymer.dart 1.5.x では <input type="number"> でバインディングされる型が他の type 属性値と同様 String だった。
  • Polymer.dart 1.6.x では <input type="number"> でバインディングされる型が int になっている。

実行例(エントリポイントは省略):

my_app.html
<link rel="import" href="packages/polymer/polymer.html">
<polymer-element name="my-app">
  <template>
    <table>
      <tr>
        <th><label for="number-input">input type="number"</label></th>
        <td><input id="number-input" type="number" value="{{foo}}"></td>
      </tr>
      <tr>
        <th><label for="text-input">input type="text"</label></th>
        <td><input id="text-input" type="text" value="{{foo}}"></td>
      </tr>
      <tr>
        <th>型情報:</th>
        <td>{{foo.runtimeType.toString()}}</td>
      </tr>
    </table>
    <script type="application/dart" src="my_app.dart"></script>
  </template>
</polymer-element>
my_app.dart
library my_app;

import 'package:polymer/polymer.dart';

@CustomTag("my-app")
class MyAppElement extends PolymerElement {
  MyAppElement.created(): super.created();
  @observable String foo;
}

これを Google Chrome で動かしてみる。

Polymer.dart 1.5.5+4

Screenshot from 2015-08-17 22:47:56.png

Screenshot from 2015-08-17 22:48:47.png

Polymer.dart 1.6.0

Screenshot from 2015-08-17 22:51:57.png

Screenshot from 2015-08-17 22:52:13.png

Screenshot from 2015-08-17 22:52:30.png

Screenshot from 2015-08-17 23:11:37.png

String foo なのに、foo.runtimeType.toString()int になったり、double になったりしている。

Changelog で言及されてる?

これかな:

The transformer has been heavily refactored and may behave slightly differently.
polymer 0.16.3+3 | Pub Package Manager から引用

つらい

つらい。

加えて、以前からそうだったけど、Polymer.dart は今回の String foo で定義してるのに int がバインディングされるように、警告もなく型を破ってくるのでつらい。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4