Added browser tests for searchable_select and column_select. Streamline of test files.

This commit is contained in:
Martin Edenhofer 2016-02-10 14:54:07 +01:00
parent 2c5bfea046
commit 63485cd861
18 changed files with 208 additions and 33 deletions

View file

@ -88,7 +88,7 @@ class App.ColumnSelect extends Spine.Controller
onFilterKeydown: (event) ->
return if event.keyCode != 13
firstVisibleOption = @poolOptions.not('.is-filtered').not('.is-hidden').first()
if firstVisibleOption
@select firstVisibleOption.attr('data-value')

View file

@ -8,16 +8,16 @@
multiple
>
<% for option in @attribute.options: %>
<option value="<%= option.value %>"><%= option.name %></option>
<option value="<%= option.value %>" <%= ' selected' if option.selected %>><%= option.name %></option>
<% end %>
</select>
<div class="columnSelect-column columnSelect-column--selected js-selected">
<div class="columnSelect-column columnSelect-column--selected js-selected" data-name="<%= @attribute.name %>">
<div class="u-placeholder u-unselectable js-placeholder<%= ' is-hidden' if @values.length %>"><%- @T('Nothing selected') %></div>
<% for option in @attribute.options: %>
<div class="columnSelect-option js-remove js-option<%= ' is-hidden' if !option.selected %>" data-value="<%= option.value %>"><%= option.name %></div>
<% end %>
</div>
<div class="columnSelect-column columnSelect-column--sidebar">
<div class="columnSelect-column columnSelect-column--sidebar" data-name="<%= @attribute.name %>">
<% if @attribute.options.length > 10: %>
<div class="columnSelect-search">
<%- @Icon('magnifier') %>

View file

@ -0,0 +1,22 @@
<link rel="stylesheet" href="/assets/tests/qunit-1.10.0.css">
<script src="/assets/tests/qunit-1.10.0.js"></script>
<script src="/assets/tests/form_column_select.js"></script>
<style type="text/css">
body {
padding-top: 0px;
}
</style>
<script type="text/javascript">
</script>
<div id="qunit" class="u-dontfold"></div>
<div>
<form class="form-stacked pull-left">
<div id="forms"></div>
<button type="submit" class="btn btn-primary submit">Submit</button>
</form>
</div>

View file

@ -1,7 +1,7 @@
<link rel="stylesheet" href="/assets/tests/qunit-1.10.0.css">
<script src="/assets/tests/qunit-1.10.0.js"></script>
<script src="/assets/tests/form-extended.js"></script>
<script src="/assets/tests/form_extended.js"></script>
<style type="text/css">
body {

View file

@ -0,0 +1,22 @@
<link rel="stylesheet" href="/assets/tests/qunit-1.10.0.css">
<script src="/assets/tests/qunit-1.10.0.js"></script>
<script src="/assets/tests/form_searchable_select.js"></script>
<style type="text/css">
body {
padding-top: 0px;
}
</style>
<script type="text/javascript">
</script>
<div id="qunit" class="u-dontfold"></div>
<div>
<form class="form-stacked pull-left">
<div id="forms"></div>
<button type="submit" class="btn btn-primary submit">Submit</button>
</form>
</div>

View file

@ -1,7 +1,7 @@
<link rel="stylesheet" href="/assets/tests/qunit-1.10.0.css">
<script src="/assets/tests/qunit-1.10.0.js"></script>
<script src="/assets/tests/form-trim.js"></script>
<script src="/assets/tests/form_trim.js"></script>
<style type="text/css">
body {

View file

@ -1,6 +1,6 @@
<link rel="stylesheet" href="/assets/tests/qunit-1.10.0.css">
<script src="/assets/tests/qunit-1.10.0.js"></script>
<script src="/assets/tests/form-validation.js"></script>
<script src="/assets/tests/form_validation.js"></script>
<style type="text/css">
body {

View file

@ -1,7 +1,7 @@
<link rel="stylesheet" href="/assets/tests/qunit-1.10.0.css">
<script src="/assets/tests/qunit-1.10.0.js"></script>
<script src="/assets/tests/html-utils.js"></script>
<script src="/assets/tests/html_utils.js"></script>
<style type="text/css">
body {

View file

@ -1,7 +1,7 @@
<link rel="stylesheet" href="/assets/tests/qunit-1.10.0.css">
<script src="/assets/tests/qunit-1.10.0.js"></script>
<script src="/assets/tests/model-ui.js"></script>
<script src="/assets/tests/model_ui.js"></script>
<style type="text/css">
body {

View file

@ -1,16 +1,18 @@
Zammad::Application.routes.draw do
match '/tests-core', to: 'tests#core', via: :get
match '/tests-ui', to: 'tests#ui', via: :get
match '/tests-model', to: 'tests#model', via: :get
match '/tests-model-ui', to: 'tests#model_ui', via: :get
match '/tests-form', to: 'tests#form', via: :get
match '/tests-form-trim', to: 'tests#form_trim', via: :get
match '/tests-form-extended', to: 'tests#form_extended', via: :get
match '/tests-form-validation', to: 'tests#form_validation', via: :get
match '/tests-table', to: 'tests#table', via: :get
match '/tests-html-utils', to: 'tests#html_utils', via: :get
match '/tests-taskbar', to: 'tests#taskbar', via: :get
match '/tests/wait/:sec', to: 'tests#wait', via: :get
match '/tests_core', to: 'tests#core', via: :get
match '/tests_ui', to: 'tests#ui', via: :get
match '/tests_model', to: 'tests#model', via: :get
match '/tests_model_ui', to: 'tests#model_ui', via: :get
match '/tests_form', to: 'tests#form', via: :get
match '/tests_form_trim', to: 'tests#form_trim', via: :get
match '/tests_form_extended', to: 'tests#form_extended', via: :get
match '/tests_form_validation', to: 'tests#form_validation', via: :get
match '/tests_form_column_select', to: 'tests#form_column_select', via: :get
match '/tests_form_searchable_select', to: 'tests#form_searchable_select', via: :get
match '/tests_table', to: 'tests#table', via: :get
match '/tests_html_utils', to: 'tests#html_utils', via: :get
match '/tests_taskbar', to: 'tests#taskbar', via: :get
match '/tests/wait/:sec', to: 'tests#wait', via: :get
end

View file

@ -0,0 +1,53 @@
// column_select
test( "column_select check", function() {
$('#forms').append('<hr><h1>column_select check</h1><form id="form1"></form>')
var el = $('#form1')
var defaults = {
column_select2: ['aaa', 'bbb'],
}
var options = {
'aaa': 'aaa display',
'bbb': 'bbb display',
'ccc': 'ccc display',
}
new App.ControllerForm({
el: el,
model: {
configure_attributes: [
{ name: 'column_select1', display: 'ColumnSelect1', tag: 'column_select', options: options, null: true, default: defaults['column_select1'] },
{ name: 'column_select2', display: 'ColumnSelect2', tag: 'column_select', options: options, null: false, default: defaults['column_select2'] },
]
},
autofocus: true
})
var params = App.ControllerForm.params( el )
var test_params = {
column_select2: ['aaa', 'bbb'],
}
deepEqual( params, test_params, 'form param check' )
// add and remove selections
$('[data-name="column_select1"] .js-pool .js-option[data-value="bbb"]').click()
params = App.ControllerForm.params( el )
test_params = {
column_select1: 'bbb',
column_select2: ['aaa', 'bbb'],
}
deepEqual( params, test_params, 'form param check' )
$('[data-name="column_select1"] .js-pool .js-option[data-value="aaa"]').click()
$('[data-name="column_select2"] .js-pool .js-option[data-value="ccc"]').click()
$('[data-name="column_select2"].js-selected .js-option[data-value="aaa"]').click()
params = App.ControllerForm.params( el )
test_params = {
column_select1: ['aaa', 'bbb'],
column_select2: ['bbb', 'ccc'],
}
deepEqual( params, test_params, 'form param check' )
});

View file

@ -0,0 +1,62 @@
// searchable_select
test( "searchable_select check", function() {
$('#forms').append('<hr><h1>searchable_select check</h1><form id="form1"></form>')
var el = $('#form1')
var defaults = {
searchable_select2: 'bbb',
}
var options = {
'aaa': 'aaa display',
'bbb': 'bbb display',
'ccc': 'ccc display',
}
new App.ControllerForm({
el: el,
model: {
configure_attributes: [
{ name: 'searchable_select1', display: 'SearchableSelect1', tag: 'searchable_select', options: options, null: true, default: defaults['searchable_select1'] },
{ name: 'searchable_select2', display: 'SearchableSelect2', tag: 'searchable_select', options: options, null: false, default: defaults['searchable_select2'] },
]
},
autofocus: true
})
var params = App.ControllerForm.params( el )
var test_params = {
searchable_select1: '',
searchable_select2: 'bbb',
}
deepEqual( params, test_params, 'form param check' )
// change selection
$('[name="searchable_select1"].js-shadow + .js-input').focus().val('').trigger('input')
var entries = $('[name="searchable_select1"]').closest('.searchableSelect').find('.js-optionsList li:not(.is-hidden)').length
equal(entries, 3, 'dropdown count')
$('[name="searchable_select1"].js-shadow + .js-input').focus().val('ccc display').trigger('input')
var entries = $('[name="searchable_select1"]').closest('.searchableSelect').find('.js-optionsList li:not(.is-hidden)').length
equal(entries, 1, 'dropdown count')
$('[name="searchable_select1"]').closest('.searchableSelect').find('.js-optionsList li:not(.is-hidden)').first().click()
params = App.ControllerForm.params( el )
test_params = {
searchable_select1: 'ccc',
searchable_select2: 'bbb',
}
deepEqual( params, test_params, 'form param check' )
$('[name="searchable_select2"].js-shadow + .js-input').focus().val('').trigger('input')
var entries = $('[name="searchable_select2"]').closest('.searchableSelect').find('.js-optionsList li:not(.is-hidden)').length
equal(entries, 3, 'dropdown count')
$('[name="searchable_select2"].js-shadow + .js-input').focus().val('ccc display').trigger('input')
var entries = $('[name="searchable_select2"]').closest('.searchableSelect').find('.js-optionsList li:not(.is-hidden)').length
equal(entries, 1, 'dropdown count')
$('[name="searchable_select2"]').closest('.searchableSelect').find('.js-optionsList li:not(.is-hidden)').first().click()
params = App.ControllerForm.params( el )
test_params = {
searchable_select1: 'ccc',
searchable_select2: 'ccc',
}
deepEqual( params, test_params, 'form param check' )
});

View file

@ -4,7 +4,7 @@ require 'browser_test_helper'
class AAbUnitTest < TestCase
def test_core
@browser = browser_instance
location( url: browser_url + '/tests-core' )
location( url: browser_url + '/tests_core' )
sleep 10
match(
css: '.result .failed',
@ -14,21 +14,21 @@ class AAbUnitTest < TestCase
def test_ui
@browser = browser_instance
location( url: browser_url + '/tests-ui' )
location( url: browser_url + '/tests_ui' )
sleep 8
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests-model' )
location( url: browser_url + '/tests_model' )
sleep 8
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests-model-ui' )
location( url: browser_url + '/tests_model_ui' )
sleep 8
match(
css: '.result .failed',
@ -38,27 +38,41 @@ class AAbUnitTest < TestCase
def test_form
@browser = browser_instance
location( url: browser_url + '/tests-form' )
sleep 8
location( url: browser_url + '/tests_form' )
sleep 4
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests-form-trim' )
location( url: browser_url + '/tests_form_trim' )
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests-form-extended' )
sleep 8
location( url: browser_url + '/tests_form_extended' )
sleep 4
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests-form-validation' )
location( url: browser_url + '/tests_form_searchable_select' )
sleep 2
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests_form_column_select' )
sleep 2
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests_form_validation' )
sleep 4
match(
css: '.result .failed',
@ -68,14 +82,14 @@ class AAbUnitTest < TestCase
def test_table
@browser = browser_instance
location( url: browser_url + '/tests-table' )
location( url: browser_url + '/tests_table' )
sleep 4
match(
css: '.result .failed',
value: '0',
)
location( url: browser_url + '/tests-html-utils' )
location( url: browser_url + '/tests_html_utils' )
sleep 4
match(
css: '.result .failed',