随机失败的聚合物网组件测试答案

【问题标题】：Randomly failing polymer web component test随机失败的聚合物网组件测试
【发布时间】：2015-08-06 18:06:25
【问题描述】：

又一次尝试将 Polymer 与 ES6 类结合起来。

它几乎可以工作，除了 wct 测试在具有导入的 es6 类（通过 systemjs）的聚合物组件上随机失败。据我了解，这是因为包含类定义的脚本在 mocha 执行测试后被加载。聚合物组件由两部分组成 - html和javascript（将后者编译为es5），

html:

<dom-module id="my-test">
   <template>hello</template>
   <script>
      System.import('elements/my-test.js');
   </script>
</dom-module>

javascript：

import {User} from 'elements/model/user.js';

Polymer({
 is: "my-test",

 method: function(){
   console.log("method, user="+this.val);
 },

 ready: function(){
   this.user= new User(); //this.user is randomly undefined
 }
});

这似乎在浏览器中工作得相当稳定，至少在从 localhost 加载时是这样。但唯一能“修复”测试的是延迟 Polymer 的就绪调用：

Polymer.whenReady = function (f) {
   console.log("polymer ready");
   setTimeout(f, 100);// "fix"
   //f();
}

这意味着在某些时候所有这些都将在浏览器中失败（可能不是从本地主机提供服务时）。

我正在考虑以某种方式实现系统注册的承诺并制作类似于 HTMLImports.whenDocumentReady 的东西，但我仍然不清楚这一切是如何工作的。

因此，我们非常感谢任何想法和建议！

示例应用在 github 上：

git clone https://github.com/bushuyev/test_test.git
cd test_test
git checkout tags/random_fail
npm install
bower install
gulp wct

为了使其成功多于失败 - 在 wct.conf.js 中将 verbose 更改为 true。

更新类型：How to import system js SFX library

【问题讨论】：

标签： javascript polymer-1.0 systemjs es6-module-loader

【解决方案1】：

可以以非常好的方式一起使用 Polymer、SystemJS 和 TypeScript（类似于 ES6，但添加了对 Polymer 友好的语法），还可以使用 SystemJS 处理 HTML 导入。这确实涉及时间问题，我已经发布了一个small shim，它首先等待 webcomponents.js 加载并捕获其就绪事件（在其他代码有机会看到它之前），然后它加载 Polymer，最后加载所有其他组件和 TypeScript 代码。然后它再次分派事件，以便 Polymer 完成自身初始化。

这里是an article about combining the technologies，上面有提到的解决方案、可下载的代码和一个演示。

【讨论】：