0

我正在使用命令行中的 web 组件测试器在我的 Polymer 组件上运行基于夹具的测试。测试成功 Chrome (v.47) 但在 Firefox (v.42) 中失败。问题是，在我的 Polymer 组件中的某些更改观察器函数中，预期的数据正在 Chrome 中接收，但在 Firefox 中为空，导致后者的测试失败。以下是基本代码：

聚合物组件：聚合物（{ 是：'组件名称'，

  properties: {
    data: {
    type: Array,
    observer: '_dataChanged'
  },
  _dataChanged: function() {
    process(this.data)  // this line
    ...
  },
  ...

在 Chrome 中，上面“这一行”中的“this.data”的值是非空的，无论在 html 夹具中传递什么。这使我的测试用例能够成功。但是在 Firefox 中，从事件接收到的 'this.data' 的值是一个空数组 []，导致上述测试失败。任何想法为什么会这样？

我还尝试将我的测试套件包装在“WebComponentsReady”事件的事件侦听器中，即使 web-component-tester 已经确保套件仅在此类事件触发后才启动。这种方法在 Chrome 中仍然有效，在 Firefox 中仍然失败。

4

2 回答 2

1

更改您的 _dataChanged 方法以将数据值作为参数，如下所示：

properties: {
    data: {
    type: Array,
    observer: '_dataChanged'
},
_dataChanged: function(data) {
    process(data);
...
}

我不认为 Polymer 保证在触发观察者时属性的值将在 this 上下文中设置。

于 2015-12-09T02:03:09.933 回答
0

我发现的一个解决方法（并非没有运气）是按以下模式构建夹具和测试脚本：

夹具（HTML）：

<html>
  <head>
    ...
    <script src="../web-component-tester/browser.js"></script>
    ...
    <script src="test-script.js"></script>
    ...
  </head>
  <body>
    ...
    <my-component ...></my-component>
    ...
  </body>
</html>

测试脚本.js：

document.addEventListener("WebComponentsReady", function() {
  ...
  // some code that changes the data of my-component
  // (needed for correct state of the test cases)
  ...
  runTests();
}

function runTests() {
  suite('Test suite for my-component', function(){
    ...
  });
}

上述模式适用于 Chrome 和 Firefox。这有点多余，因为 web-component-tester 已经在侦听“WebComponentsReady”，但是上面添加的事件侦听器是测试在 Firefox 上运行所需要的。

我听说 Firefox 在管理组件层次结构的“就绪”事件方面还不如 Chrome 强大或稳定。这可能与问题有关。

于 2015-12-09T22:26:38.020 回答