Files
gerrit/polygerrit-ui/app/elements/plugins/gr-event-helper/gr-event-helper_test.html
Viktar Donich ae7c9618d3 Low-level plugin event helper API
Can be used to listen to tap evens (i.e. click/touch), preventing their
bubbling, or preventing normal execution. To stop either bubbling or
normal execution, callback should explicitly return false. By default,
bubbling and normal execution is not prevented.

onTap() adds a listener to a click or touch event to element wrapped
with event helper.

captureTap() installs a capture phase listener and callback returning
false at that moment intercepts tap before any action is taken by other
listeners (i.e. PolyGerrit buttons).

Sample code

``` js
Gerrit.install(plugin => {
  plugin.hook('reply-text').onAttached(element => {
    if (!element.content) { return; }
    plugin.eventHelper(element.content).onTap(() => {
      console.log('reply test tapped!');
    });
    plugin.eventHelper(element.content).captureTap(() => {
      // Prevent onTap() handler from being called.
      return false;
    });
  });
});
```

Change-Id: Ie10169e2c801ce85590e4f700e6041e9c8a02bff
2017-09-15 15:32:04 -07:00

97 lines
2.5 KiB
HTML

<!DOCTYPE html>
<!--
Copyright (C) 2017 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>gr-event-helper</title>
<script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
<script src="../../../bower_components/web-component-tester/browser.js"></script>
<link rel="import" href="../../../test/common-test-setup.html"/>
<link rel="import" href="gr-event-helper.html"/>
<script>void(0);</script>
<dom-element id="some-element">
<script>
Polymer({
is: 'some-element',
properties: {
fooBar: {
type: Object,
notify: true,
},
},
});
</script>
</dom-element>
<test-fixture id="basic">
<template>
<some-element></some-element>
</template>
</test-fixture>
<script>
suite('gr-event-helper tests', () => {
let element;
let instance;
let sandbox;
setup(() => {
sandbox = sinon.sandbox.create();
element = fixture('basic');
instance = new GrEventHelper(element);
});
teardown(() => {
sandbox.restore();
});
test('onTap()', done => {
instance.onTap(() => {
done();
});
element.fire('tap');
});
test('onTap() cancel', () => {
const tapStub = sandbox.stub();
element.parentElement.addEventListener('tap', tapStub);
instance.onTap(() => false);
element.fire('tap');
flushAsynchronousOperations();
assert.isFalse(tapStub.called);
});
test('captureTap()', done => {
instance.captureTap(() => {
done();
});
element.fire('tap');
});
test('captureTap() cancels tap()', () => {
const tapStub = sandbox.stub();
element.addEventListener('tap', tapStub);
instance.captureTap(() => false);
element.fire('tap');
flushAsynchronousOperations();
assert.isFalse(tapStub.called);
});
});
</script>