it('should fill param values for advanced setup with the given parameters', function() {
builder = new ApiBuilder({
parameters: {
foo: {
type: 'string',
value: 'value',
description: 'desc',
required: true
},
bar: {
type: 'boolean',
validator: 'validator'
}
}
}).render();
var paramRows = builder.element.querySelectorAll('.builder-params .builder-param-item');
var advancedElement = paramRows[0].querySelector('.builder-param-item-advanced');
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
assert.strictEqual('value', paramRows[0].querySelector('input[data-name="value"]').value);
var codeMirror = paramRows[0].querySelector('.CodeMirror').CodeMirror;
assert.strictEqual('', codeMirror.getValue());
advancedElement = paramRows[1].querySelector('.builder-param-item-advanced');
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
assert.strictEqual('', paramRows[1].querySelector('input[data-name="value"]').value);
codeMirror = paramRows[1].querySelector('.CodeMirror').CodeMirror;
assert.strictEqual('validator', codeMirror.getValue());
});
it.skip('should expand table contents when pressing enter or space on columns with nested tables', () => {
datatable = new Datatable({
data: [
{
arr: [1, 2, 3]
}
]
});
var label = datatable.element.querySelector('.datatable-label');
expect(dom.hasClass(label, 'collapsed')).toBeTruthy();
expect(dom.hasClass(dom.next(label, 'table'), 'hidden')).toBeTruthy();
const col = datatable.refs['table-1-0'];
dom.triggerEvent(col, 'keydown', {
keyCode: 13
});
expect(dom.hasClass(label, 'expanded')).toBeTruthy();
expect(!dom.hasClass(dom.next(label, 'table'), 'hidden')).toBeTruthy();
dom.triggerEvent(col, 'keydown', {
keyCode: 32
});
expect(!dom.hasClass(label, 'expanded')).toBeTruthy();
expect(dom.hasClass(dom.next(label, 'table'), 'hidden')).toBeTruthy();
datatable.dispose();
});
it('should keep rendering received real time responses', function(done) {
explorer = new ApiExplorer({
method: ['get', 'post']
}).render();
dom.triggerEvent(explorer.element.querySelector('.switcher'), 'click');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
ioInstance.emit('changes', 'foo');
explorer.once('attrsChanged', function() {
var codeMirrorComp = explorer.components[explorer.id + '-responseCodeMirror'];
codeMirrorComp.once('attrsChanged', function() {
var codeMirror = explorer.element.querySelector('.explorer-code-container .CodeMirror').CodeMirror;
assert.strictEqual('foo', codeMirror.getValue());
assert.strictEqual('text/plain', codeMirror.getOption('mode'));
ioInstance.emit('changes', 'bar');
explorer.once('attrsChanged', function() {
codeMirrorComp.once('attrsChanged', function() {
codeMirror = explorer.element.querySelector('.explorer-code-container .CodeMirror').CodeMirror;
assert.strictEqual('bar', codeMirror.getValue());
assert.strictEqual('text/plain', codeMirror.getOption('mode'));
done();
});
});
});
});
});
it('should send request with default value if param chosen value is deleted', function() {
explorer = new ApiExplorer({
method: ['post'],
parameters: [
{
name: 'name',
value: 'foo'
},
{
name: 'age'
},
{
name: 'extra'
}
]
}).render();
var inputs = explorer.element.querySelectorAll('.explorer-section-try-param');
inputs[0].value = 'bar';
dom.triggerEvent(inputs[0], 'input');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
assert.strictEqual('{"name":"bar"}', requests[0].requestBody);
inputs[0].value = '';
dom.triggerEvent(inputs[0], 'input');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
assert.strictEqual('{"name":"foo"}', requests[1].requestBody);
});
it('should render correct cURL snippet when body is set', function(done) {
explorer = new ApiExplorer({
host: 'foo.org',
path: '/data',
response: {
statusText: 'OK'
}
}).render();
dom.triggerEvent(explorer.element.querySelectorAll('.codeMirrorTabs-tab')[2], 'click');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-body-toggler'), 'click');
var bodyCodeMirror = explorer.element.querySelector('.explorer-section-body .CodeMirror').CodeMirror;
bodyCodeMirror.setValue('{"foo":"bar"}');
explorer.response = {
statusText: 'OK'
};
explorer.once('attrsChanged', function() {
explorer.components[explorer.id + '-snippetsCodeMirror'].once('attrsChanged', function() {
var codeMirror = explorer.element.querySelector('.explorer-section-snippets .CodeMirror').CodeMirror;
assert.notStrictEqual(-1, codeMirror.getValue().indexOf('curl -X "GET" "foo.org/data"'));
assert.notStrictEqual(-1, codeMirror.getValue().indexOf('-d "{\\"foo\\":\\"bar\\"}"'));
done();
});
});
});
it('should render correct Java snippet when body is set to an object', function(done) {
explorer = new ApiExplorer({
host: 'foo.org',
path: '/data',
response: {
statusText: 'OK'
}
}).render();
dom.triggerEvent(explorer.element.querySelectorAll('.codeMirrorTabs-tab')[1], 'click');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-body-toggler'), 'click');
var bodyCodeMirror = explorer.element.querySelector('.explorer-section-body .CodeMirror').CodeMirror;
bodyCodeMirror.setValue('{foo: \'bar\'}');
explorer.response = {
statusText: 'OK'
};
explorer.once('attrsChanged', function() {
explorer.components[explorer.id + '-snippetsCodeMirror'].once('attrsChanged', function() {
var codeMirror = explorer.element.querySelector('.explorer-section-snippets .CodeMirror').CodeMirror;
var expectedStr = 'Launchpad.url("foo.org/data")\n' +
' .header("content-type", "application/json")\n' +
' .get("{\\"foo\\":\\"bar\\"}");';
assert.strictEqual(expectedStr, codeMirror.getValue());
done();
});
});
});
expect(() => {
dom.triggerEvent(component.inputElement, 'keydown', {keyCode: 40});
dom.triggerEvent(component.inputElement, 'keydown', {keyCode: 38});
dom.triggerEvent(component.inputElement, 'keydown', {keyCode: 13});
dom.triggerEvent(component.inputElement, 'keydown', {keyCode: 32});
done();
}).not.toThrow();
it('should send request with chosen path params', function() {
explorer = new ApiExplorer({
host: 'foo.org',
parameters: [
{
name: 'name',
value: 'foo'
},
{
name: 'age'
},
{
name: 'extra'
}
],
path: '/data/:name/:age'
}).render();
var inputs = explorer.element.querySelectorAll('.explorer-section-try-param');
assert.strictEqual(3, inputs.length);
inputs[1].value = 12;
dom.triggerEvent(inputs[1], 'input');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
assert.strictEqual('http://foo.org/data/foo/12', requests[0].url);
});
it('should send request with chosen body params', function() {
explorer = new ApiExplorer({
method: ['post'],
parameters: [
{
name: 'name',
value: 'foo'
},
{
name: 'age'
},
{
name: 'extra'
}
]
}).render();
var inputs = explorer.element.querySelectorAll('.explorer-section-try-param');
assert.strictEqual(3, inputs.length);
inputs[1].value = 12;
dom.triggerEvent(inputs[1], 'input');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
assert.strictEqual('{"name":"foo","age":"12"}', requests[0].requestBody);
});
expect(() => {
dom.triggerEvent(col, 'keydown', {
keyCode: 13
});
dom.triggerEvent(col, 'keydown', {
keyCode: 32
});
}).not.toThrow();
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);
});
component.on('stateSynced', () => {
expect(dom.hasClass(getListItem(0), 'active')).toBeTruthy();
dom.triggerEvent(component.inputElement, 'keydown', {keyCode: 40});
dom.triggerEvent(component.inputElement, 'keydown', {keyCode: 40});
expect(dom.hasClass(getListItem(0), 'active')).toBeTruthy();
expect(dom.hasClass(getListItems(1), 'active')).toBeFalsy();
done();
});
it('should not render real time response if button is clicked but selected method is not "get"', function() {
explorer = new ApiExplorer({
method: ['post', 'get']
}).render();
dom.triggerEvent(explorer.element.querySelector('.switcher'), 'click');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
ioInstance.emit('changes', 'foo');
assert.ok(!explorer.response.bodyString);
});
setTimeout(function() {
dom.triggerEvent(trigger, 'click');
dom.triggerEvent(triggerOther, 'click');
setTimeout(function() {
assert.ok(tooltip.visible);
assert.strictEqual(triggerOther, tooltip.currentAlignElement);
dom.exitDocument(trigger);
dom.exitDocument(triggerOther);
done();
}, 25);
}, 25);
it('should not add nameless option to "body" when input event is triggered for CodeMirror\'s textarea', function() {
builder = new ApiBuilder().render();
var advancedElement = builder.element.querySelector('.builder-param-item-advanced');
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
var textarea = builder.element.querySelector('.builder-param-item .CodeMirror textarea');
textarea.value = 'validator';
dom.triggerEvent(textarea, 'input');
assert.ok(!builder.body[null]);
});
it('should close the dropdown when ESC key is pressed', function() {
select = new Select({
items: ['First', 'Second', 'Third']
});
dom.triggerEvent(select.element.querySelector('button'), 'click');
dom.triggerEvent(select.element, 'keydown', {
keyCode: 27
});
assert.ok(!select.getDropdown().expanded);
});
it('should update "method" when method button is clicked', function() {
builder = new ApiBuilder().render();
var buttons = builder.element.querySelectorAll('.btn-group button');
dom.triggerEvent(buttons[4], 'click');
var expectedMethod = ['get', 'delete'];
assert.deepEqual(expectedMethod, builder.method);
dom.triggerEvent(buttons[0], 'click');
expectedMethod = ['delete'];
assert.deepEqual(expectedMethod, builder.method);
});
it('should send request with chosen wildcard value', function() {
explorer = new ApiExplorer({
host: 'foo.org',
path: '/data/*'
}).render();
var input = explorer.element.querySelector('.explorer-section-try-param');
input.value = 12;
dom.triggerEvent(input, 'input');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
assert.strictEqual('http://foo.org/data/12', requests[0].url);
});
it('should not build a new CodeMirror if the textarea hasn\'t change when the advanced options are opened', function() {
builder = new ApiBuilder().render();
var advancedElement = builder.element.querySelector('.builder-param-item-advanced');
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
var codeMirror = builder.element.querySelector('.builder-param-item .CodeMirror').CodeMirror;
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
var newCodeMirror = builder.element.querySelector('.builder-param-item .CodeMirror').CodeMirror;
assert.strictEqual(codeMirror, newCodeMirror);
});
select.getDropdown().once('stateChanged', function() {
dom.triggerEvent(select.element, 'keydown', {
keyCode: 38
});
assert.strictEqual(document.activeElement, options[0]);
dom.triggerEvent(select.element, 'keydown', {
keyCode: 38
});
assert.strictEqual(document.activeElement, options[2]);
done();
});
it('should expand/collapse advanced setup when its button is clicked for body', function() {
builder = new ApiBuilder().render();
var advancedElement = builder.element.querySelector('.builder-param-item-advanced');
assert.ok(!dom.hasClass(advancedElement, 'expanded'));
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
assert.ok(dom.hasClass(advancedElement, 'expanded'));
assert.strictEqual(builder.element.querySelector('.builder-param-item [data-name="description"]'), document.activeElement);
dom.triggerEvent(advancedElement.querySelector('button'), 'click');
assert.ok(!dom.hasClass(advancedElement, 'expanded'));
});
it('should send request with chosen js code body', function() {
explorer = new ApiExplorer({
method: ['post']
}).render();
dom.triggerEvent(explorer.element.querySelector('.explorer-section-body-toggler'), 'click');
var codeMirror = explorer.element.querySelector('.explorer-section-body .CodeMirror').CodeMirror;
codeMirror.setValue('2 + 2');
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
assert.strictEqual(1, requests.length);
assert.strictEqual(4, requests[0].requestBody);
assert.strictEqual('text/plain', requests[0].requestHeaders['Content-Type'].substr(0, 10));
});
it('should open/close dropdown when button is clicked', function() {
select = new Select({
items: ['First', 'Second', 'Third']
});
var dropdown = select.getDropdown();
assert.ok(!dropdown.expanded);
dom.triggerEvent(select.element.querySelector('button'), 'click');
assert.ok(dropdown.expanded);
dom.triggerEvent(select.element.querySelector('button'), 'click');
assert.ok(!dropdown.expanded);
});
setTimeout(function() {
assert.ok(tooltip.visible);
dom.triggerEvent(trigger, 'mouseout');
dom.triggerEvent(tooltip.element, 'mouseenter');
setTimeout(function() {
assert.ok(tooltip.visible);
dom.triggerEvent(tooltip.element, 'mouseleave');
setTimeout(function() {
assert.ok(!tooltip.visible);
dom.exitDocument(trigger);
done();
}, 25);
}, 25);
}, 25);
it('should not update "body" twice if input event is triggered but value doesn\'t change', function() {
builder = new ApiBuilder().render();
var listener = sinon.stub();
builder.on('bodyChanged', listener);
var element = builder.element.querySelector('.builder-param-item [data-name="description"]');
element.value = 'bar';
dom.triggerEvent(element, 'input');
assert.strictEqual(1, listener.callCount);
dom.triggerEvent(element, 'input');
assert.strictEqual(1, listener.callCount);
});
it('should render correct snippet for sending request via Java', function(done) {
explorer = new ApiExplorer({
host: 'foo.org',
parameters: [
{
name: 'foo',
value: 12
},
{
name: 'bar',
value: 1
}
],
path: '/data/:foo',
response: {
statusText: 'OK'
}
}).render();
dom.triggerEvent(explorer.element.querySelectorAll('.codeMirrorTabs-tab')[1], 'click');
explorer.components[explorer.id + '-snippetsCodeMirror'].once('attrsChanged', function() {
var codeMirror = explorer.element.querySelector('.explorer-section-snippets .CodeMirror').CodeMirror;
var expectedStr = 'Launchpad.url("foo.org/data/12")\n' +
' .header("content-type", "application/json")\n' +
' .get("{\\"bar\\":1}");';
assert.strictEqual(expectedStr, codeMirror.getValue());
done();
});
});
it('should render correct snippet for sending request via cURL', function(done) {
explorer = new ApiExplorer({
host: 'foo.org',
parameters: [
{
name: 'foo',
value: 12
},
{
name: 'bar',
value: 1
}
],
path: '/data/:foo',
response: {
statusText: 'OK'
}
}).render();
dom.triggerEvent(explorer.element.querySelectorAll('.codeMirrorTabs-tab')[2], 'click');
explorer.components[explorer.id + '-snippetsCodeMirror'].once('attrsChanged', function() {
var codeMirror = explorer.element.querySelector('.explorer-section-snippets .CodeMirror').CodeMirror;
assert.notStrictEqual(-1, codeMirror.getValue().indexOf('curl -X "GET" "foo.org/data/12"'));
assert.notStrictEqual(-1, codeMirror.getValue().indexOf('-d "{\\"bar\\":1}"'));
done();
});
});
it('should render correct snippet when non json body is set', function(done) {
explorer = new ApiExplorer({
host: 'foo.org',
path: '/data',
response: {
statusText: 'OK'
}
}).render();
dom.triggerEvent(explorer.element.querySelector('.explorer-section-body-toggler'), 'click');
var bodyCodeMirror = explorer.element.querySelector('.explorer-section-body .CodeMirror').CodeMirror;
bodyCodeMirror.setValue('10');
explorer.response = {
statusText: 'OK'
};
explorer.once('attrsChanged', function() {
explorer.components[explorer.id + '-snippetsCodeMirror'].once('attrsChanged', function() {
var codeMirror = explorer.element.querySelector('.explorer-section-snippets .CodeMirror').CodeMirror;
var expectedStr = 'Launchpad.url(\'foo.org/data\')\n .get(10);';
assert.strictEqual(expectedStr, codeMirror.getValue());
done();
});
});
});
it('should render correct snippet when path param changes', function(done) {
explorer = new ApiExplorer({
host: 'foo.org',
path: '/data/:foo',
response: {
statusText: 'OK'
}
}).render();
var inputs = explorer.element.querySelectorAll('.explorer-section-try-param');
inputs[0].value = 12;
dom.triggerEvent(inputs[0], 'input');
explorer.once('attrsChanged', function() {
explorer.response = {
statusText: 'OK'
};
explorer.components[explorer.id + '-snippetsCodeMirror'].once('attrsChanged', function() {
var codeMirror = explorer.element.querySelector('.explorer-section-snippets .CodeMirror').CodeMirror;
var expectedStr = 'Launchpad.url(\'foo.org/data/12\')\n .get();';
assert.strictEqual(expectedStr, codeMirror.getValue());
done();
});
});
});
it('should send request with chosen path params after method is changed', function(done) {
explorer = new ApiExplorer({
host: 'foo.org',
method: ['post', 'put'],
parameters: [
{
name: 'name'
}
],
path: '/data/:name'
}).render();
var methodSelect = explorer.components[explorer.element.id + '-methodSelect'];
methodSelect.selectedIndex = 1;
var input = explorer.element.querySelector('.explorer-section-try-param');
input.value = 'foo';
dom.triggerEvent(input, 'input');
explorer.once('attrsChanged', function() {
dom.triggerEvent(explorer.element.querySelector('.explorer-section-try-button'), 'click');
assert.strictEqual('http://foo.org/data/foo', requests[0].url);
assert.strictEqual('PUT', requests[0].method);
done();
});
});