Question

我无法在网络组件测试器测试用例中使用MockInteractions.pressEnter模拟纸张输入中的简单输入。

当我用真正的键盘输入时，它可以完成这项工作。

这是我的代码，有没有人有想法或解决方法？

<!doctype html>
    <html>
    <head>
      <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">

      <script src="../bower_components/webcomponentsjs/webcomponents-lite.js"></script>
      <script src="../bower_components/web-component-tester/browser.js"></script>
      <script src="../bower_components/iron-test-helpers/mock-interactions.js"></script>


      <link rel="import" href="../bower_components/polymer/polymer.html">
      <link rel="import" href="../bower_components/iron-test-helpers/iron-test-helpers.html">
      <link rel="import" href="../bower_components/paper-input/paper-input.html">

    </head>
    <body>
    <test-fixture id="basic">

      <template>
        <dom-module id="search-module">
          <template>
            <paper-input id="searchInput" label="Search" value="{{searchValue}}"></paper-input>
          </template>

          <script>
            (function() {
              'use strict';
              Polymer({
                is: 'search-module',
                properties: {
                  searchValue: String
                },
                listeners: {
                  'searchInput.keypress': '_keyType'
                },
                _keyType: function(keypress) {
                    this.fire('search');
                }
              });
            })();
          </script>
        </dom-module>

        <search-module id="moduleUnderTest"></search-module>
      </template>
    </test-fixture>

    <script>
      describe('search-module', function() {
        var element;

        beforeEach(function() {
          element = fixture('basic')
            .find(function(elem){
                if(elem.id === 'moduleUnderTest') return elem;
            });
        });
        it('should fire search on press enter', function (done) {
          element.set('searchValue', 'tap enter');
          flush(function () {
            var input = element.$.searchInput;
            element.addEventListener('search',function () {
              expect(element.searchValue).to.be.equal('tap enter');
              done()
            });
            MockInteractions.focus(input);
            setTimeout(function () {
              MockInteractions.pressEnter(input);
              // pressAndReleaseKeyOn Does not work as well.
              // MockInteractions.pressAndReleaseKeyOn(input, 'a'.charCodeAt(0))
            },500)
          })
        });
      });
    </script>

    </body>
    </html>

Answer 1

我找到了解决方案。当我听到按键事件时，事件正确地被捕获。

这是MockInteractions中缺少的功能。

  listeners: {
    'searchInput.keydown': '_keyType'
  },

Answer 2

它适用于'keydown'事件，而不是'keypress'事件。

web-component-tester MockInteractions不发送按键事件

2 个答案: