2

1 つのページの複数の場所に追加する必要がある (非常に大きな) select 要素を作成しています。インスタンスごとに再作成する代わりに、単一のプロトタイプを作成してから、インスタンスごとにディープ クローンを作成し、新しいインスタンスにいくつかの新しいプロパティを追加しています。

Dart ではすべてが期待どおりに機能しますが、JavaScript にコンパイルすると失敗します。

以下は、問題を再現するための最小限の手順です。

<!DOCTYPE html>

<html>
  <head>
    <title>test</title>
    <script type="application/dart">
        import "dart:html";

        main()
        {
          List<String> languages = ["Japan", "Ireland", "Spain"];
          SelectElement langSelect = new SelectElement();
          for (int i = 0; i < languages.length; i++) {
            OptionElement option = new OptionElement();
            option.text = languages[i];    

            print("Before Assigning child");
            langSelect.children.add(option);
            print("After Assignment");
          }
        }
      </script>
    <script src="packages/browser/dart.js"></script>
  </head>
  <body>   
    <p id="text">Test</p>
  </body>
</html>

予想される出力は、「子の割り当て前」と「割り当て後」が 3 回出力されることです。これは、Dart で実行した場合です。JavaScript にコンパイルした後、"Before Assigning child" が出力され、Dartium で実行すると次のエラーが発生します。

Uncaught Error: Assertion failed shadow_dom.debug.js:1437
    assert shadow_dom.debug.js:1437
    assertIsNodeWrapper shadow_dom.debug.js:2592
    mixin.appendChild shadow_dom.debug.js:2780
    VG.h html_dart2js.dart:7928
    E2 test.html.0.dart:17
    Iq test.html_bootstrap.dart:11
    aX.vV isolate_helper.dart:248
    Rq isolate_helper.dart:66
    (anonymous function) test.html_bootstrap.dart.js:4350
    init.currentScript test.html_bootstrap.dart.js:4330
    (anonymous function) test.html_bootstrap.dart.js:4344
    (anonymous function)

Dart エディター: バージョン 0.8.7_r29341 Dart SDK: バージョン 0.8.7.0_r29341

4

1 に答える 1