Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
it('should attach inline listeners', function() {
class TestComponent extends Component {
render() {
return <div>
<button data-onclick="{this.handleClick.bind(this)}"></button>
</div>;
}
}
TestComponent.prototype.handleClick = sinon.stub();
TestComponent.RENDERER = JSX;
component = new TestComponent();
dom.triggerEvent(component.element.childNodes[0], 'click');
assert.strictEqual(1, component.handleClick.callCount);
});
it('should attach function listeners found in component\'s soy template', function() {
comp = new FunctionsComponent();
dom.triggerEvent(comp.element, 'click');
assert.strictEqual(0, comp.handleClick.callCount);
dom.triggerEvent(comp.element.querySelector('button'), 'click');
assert.strictEqual(1, comp.handleClick.callCount);
});
it('should attach inline listeners', function() {
class TestComponent extends JSXComponent {
render() {
return <div>
<button data-onclick="{this.handleClick.bind(this)}"></button>
</div>;
}
}
TestComponent.prototype.handleClick = sinon.stub();
component = new TestComponent();
dom.triggerEvent(component.element.childNodes[0], 'click');
assert.strictEqual(1, component.handleClick.callCount);
});
it('should attach listeners from "data-on" attributes', function() {
class TestComponent extends Component {
render() {
IncDom.elementOpen('div');
IncDom.elementVoid('div', null, null, 'data-onclick', 'handleClick');
IncDom.elementClose('div');
}
}
TestComponent.RENDERER = IncrementalDomRenderer;
TestComponent.prototype.handleClick = sinon.stub();
component = new TestComponent();
assert.strictEqual(0, component.handleClick.callCount);
dom.triggerEvent(component.element, 'click');
assert.strictEqual(0, component.handleClick.callCount);
dom.triggerEvent(component.element.childNodes[0], 'click');
assert.strictEqual(1, component.handleClick.callCount);
});
it('should attach sub component inline listeners', function() {
class TestComponent extends Component {
render() {
IncDom.elementOpen('div');
IncDom.elementVoid('ChildComponent', null, null, 'ref', 'child');
IncDom.elementClose('div');
}
}
TestComponent.RENDERER = IncrementalDomRenderer;
component = new TestComponent();
var child = component.components.child;
assert.strictEqual(0, child.handleClick.callCount);
var button = child.element.querySelector('button');
dom.triggerEvent(button, 'click');
assert.strictEqual(1, child.handleClick.callCount);
});
it('should attach function listeners found in component\'s soy template', function() {
comp = new FunctionsComponent();
dom.triggerEvent(comp.element, 'click');
assert.strictEqual(0, comp.handleClick.callCount);
dom.triggerEvent(comp.element.querySelector('button'), 'click');
assert.strictEqual(1, comp.handleClick.callCount);
});
it('should attach listeners to parent component when its id is the listener name\'s prefix', function() {
ChildrenTestComponent.ATTRS = {
bar: 'bar',
children: {
value: ''
}
};
nestedComp = new DeeplyNestedTestComponent({
id: 'nested'
}).render();
var parentButton = nestedComp.element.querySelector('.parentButton');
dom.triggerEvent(parentButton, 'click');
assert.strictEqual(1, nestedComp.handleClick.callCount);
});
it('should detach all listeners when detachAllListeners is called', function() {
var custom = createCustomComponentInstance(
'<div data-onkeydown="handleKeyDown" data-onclick="handleClick"></div>'
);
custom.handleClick = sinon.stub();
custom.handleKeyDown = sinon.stub();
var collector = new EventsCollector(custom);
collector.startCollecting();
collector.attachListener('click', 'handleClick');
collector.attachListener('keydown', 'handleKeyDown');
collector.detachAllListeners();
dom.triggerEvent(custom.element.childNodes[0], 'click');
assert.strictEqual(0, custom.handleClick.callCount);
dom.triggerEvent(custom.element.childNodes[0], 'keydown');
assert.strictEqual(0, custom.handleKeyDown.callCount);
});
IncDom.elementVoid('div', null, null, 'data-onkeydown', 'handleKeydown');
}
IncDom.elementClose('div');
}
}
TestComponent.RENDERER = IncrementalDomRenderer;
TestComponent.STATE = {
keydown: {
value: true
}
};
TestComponent.prototype.handleClick = sinon.stub();
TestComponent.prototype.handleKeydown = sinon.stub();
component = new TestComponent();
dom.triggerEvent(component.element.childNodes[1], 'keydown');
assert.strictEqual(1, component.handleKeydown.callCount);
sinon.spy(component, 'removeListener');
component.keydown = false;
component.once('stateSynced', function() {
assert.strictEqual(2, component.removeListener.callCount);
assert.notStrictEqual(-1, component.removeListener.args[0][0][0].indexOf('keydown'));
assert.strictEqual('stateSynced', component.removeListener.args[1][0]);
done();
});
});
render() {
IncDom.elementOpen('div');
IncDom.elementVoid('div', null, null, 'data-onclick', 'handleClick');
IncDom.elementClose('div');
}
}
TestComponent.RENDERER = IncrementalDomRenderer;
TestComponent.prototype.handleClick = sinon.stub();
component = new TestComponent();
assert.strictEqual(0, component.handleClick.callCount);
dom.triggerEvent(component.element, 'click');
assert.strictEqual(0, component.handleClick.callCount);
dom.triggerEvent(component.element.childNodes[0], 'click');
assert.strictEqual(1, component.handleClick.callCount);
});