首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何用web组件测试仪测试用ES6/ES6 2015编写的聚合物组件?

如何用web组件测试仪测试用ES6/ES6 2015编写的聚合物组件?
EN

Stack Overflow用户
提问于 2015-10-05 20:53:47
回答 1查看 708关注 0票数 1

从聚合物启动工具包1.1.0开始,我将工具包中的所有现有代码修改为ES6/ES6 2015,包括以下内容:gulpfile.js, app.js, routing.html, my-greeting.html, my-list.html, my-greeting-basic.html and my-listing-basic.html。按照docs文件夹中es6 babel食谱的说明,我运行了gulp serve来验证应用程序是否正确工作,但所有现有的测试都失败了。

代码语言:javascript
运行
复制
chrome 48                ✖ Test Suite Initialization

  Block-scoped declarations (let, const, function, class) not yet supported outside strict mode

chrome 48                Tests failed: 2 failed tests

以上对于chrome 41firefox 44safari 9.0也是如此。

看来wct运行未编译的代码,我找不到任何选项允许wct抢先编译任务,或者指向.tmpdist文件夹进行测试。

这里有一个修改的例子..。

代码语言:javascript
运行
复制
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../../bower_components/polymer/polymer.html">

<dom-module id="my-list">
  <template>
    <style>
      :host {
        display: block;
      }
    </style>
    <ul>
      <template is="dom-repeat" items="{{items}}">
        <li><span class="paper-font-body1">{{item}}</span></li>
      </template>
    </ul>
  </template>
  <script>
    (() => {
      'use strict';

      class MyList {

        beforeRegister() {
          let is = this.constructor.name
            .replace(/\W+/g, '-')
            .replace(/([a-z\d])([A-Z])/g, '$1-$2')
            .toLowerCase();

          this.is = is;

          this.properties = {
            items : {
              type   : Array,
              notify : true,
            }
          };
        }

        ready() {
          this.items = [
            'Responsive Web App boilerplate',
            'Iron Elements and Paper Elements',
            'End-to-end Build Tooling (including Vulcanize)',
            'Unit testing with Web Component Tester',
            'Routing with Page.js',
            'Offline support with the Platinum Service Worker Elements'
          ];
        }
      }

      Polymer(MyList);
    })();
  </script>
</dom-module>
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-10-12 15:40:22

通过Babel添加ES2015支持文档中添加文档、描述测试ES6/ES6 2015代码的首选方法之前,“我的叉子聚合物起动器-工具包”有一个修改过的gulpfile.jswtc.conf.js,允许ES6/ES6 2015元素、测试和代码正确测试。

基本上,我修改了wtc.conf.js配置文件以指向dist,而不是用于测试套件和bower_components路径映射的app。为了确保正确构建项目,wct gulp任务(在gulpfile.js中)被注入了与gulp serve任务相同的依赖项。

免责声明-让我说我不认为是理想的方法,它只是一个临时的补丁解决方案,所以我可以继续使用测试和ES2015。

我个人喜欢WTC目前不需要构建,使开发过程更加流畅和动态。也许,当它检测到ES2015时,它可以注入Babel浏览器的支持。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/32957704

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档