Posted at

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

More than 3 years have passed since last update.

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 がバインディングされるように、警告もなく型を破ってくるのでつらい。