How to test Polymer Dart

2019-02-16 01:20发布

站内问答 / 后端开发
779 1 5

I started testing my web components and noticed that Dart has a good library for that and it does work well with Dart. But now I also want to test my Polymer component, but I'm having a hard time doing that. It seems that my Unit Test does not recognize my Element as a Polymer Element. That how my "test" looks like at the moment

test.dart

import "../../../components/medium/bar-chart.dart";
import "package:unittest/unittest.dart";
import 'package:polymer/polymer.dart';
import 'dart:html';

main() {
    // initPolymer();

    print("--- Bar Chart Test ---");

    group('Bar Chart Test', () {
        test(("queryForBarChart"),() {
            expect(querySelector('bar-chart'), isNotNull); // PASS
        });

        test(("testtest"),() {
            // This should pass
            expect(querySelector('bar-chart').test(), equals(5));
            // Test failed: Caught type 'HtmlElement' is not a subtype of type 'BarChartElement' in type cast.
            // without Cast: Test failed: Caught Class 'HtmlElement' has no instance method 'test'.
        });

    });
}

test.html

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>Unit Test Results</title>
    <script src="../packages/web_components/platform.js"></script>
    <link rel="import" href="packages/polymer/polymer.html"/>
    <link rel="import" href="../../../components/medium/bar-chart.html"/>
    <script src="../packages/browser/dart.js"></script>

  <script type="application/dart" src="test.dart"></script>
  </head>

<body
  <bar-chart></bar-chart>
</body>
</html>

also I get the Exception:

Uncaught HierarchyRequestError: Failed to execute 'appendChild' on 'Node': Nodes of type 'HTML' may not be inserted inside nodes of type '#document'.

from: polymer.concat.js:6313

As i dont have any experience testing dart polymer, I take any advice whats the best what to do that.

1条回答
贪生不怕死
2楼-- · 2019-02-16 02:04

You need proper Polymer initialization code. See how to implement a main function in polymer apps for details.

This package contains a lot of Polymer.dart unit tests you can use as example https://github.com/dart-lang/core-elements/tree/master/test

  import "../../../components/medium/bar-chart.dart";
  import "package:unittest/unittest.dart";
  import 'package:polymer/polymer.dart';
  import 'dart:html';

  main() {
    // old initPolymer().run(() {
    initPolymer().then((zone) => zone.run(() {
      print("--- Bar Chart Test ---");

      group('Bar Chart Test', () {
        test(("queryForBarChart"),() {
            expect(querySelector('bar-chart'), isNotNull); // PASS
        });

        test(("testtest"),() {
          // This should pass
          expect(querySelector('bar-chart').test(), equals(5));
          // Test failed: Caught type 'HtmlElement' is not a subtype of type 'BarChartElement' in type cast.
          // without Cast: Test failed: Caught Class 'HtmlElement' has no instance method 'test'.
        });
      });
    });
  }

Hint: don't forget to add the entry pages for the test to the polymer transformer configuation.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)