| <!DOCTYPE html> | 
 | <!-- | 
 | @license | 
 | Copyright (C) 2016 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-settings-view</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-change-table-editor.html"> | 
 |  | 
 | <script>void(0);</script> | 
 |  | 
 | <test-fixture id="basic"> | 
 |   <template> | 
 |     <gr-change-table-editor></gr-change-table-editor> | 
 |   </template> | 
 | </test-fixture> | 
 |  | 
 | <script> | 
 |   suite('gr-change-table-editor tests', () => { | 
 |     let element; | 
 |     let columns; | 
 |     let sandbox; | 
 |  | 
 |     setup(() => { | 
 |       element = fixture('basic'); | 
 |       sandbox = sinon.sandbox.create(); | 
 |  | 
 |       columns = [ | 
 |         'Subject', | 
 |         'Status', | 
 |         'Owner', | 
 |         'Assignee', | 
 |         'Repo', | 
 |         'Branch', | 
 |         'Updated', | 
 |       ]; | 
 |  | 
 |       element.set('displayedColumns', columns); | 
 |       element.showNumber = false; | 
 |       flushAsynchronousOperations(); | 
 |     }); | 
 |  | 
 |     teardown(() => { | 
 |       sandbox.restore(); | 
 |     }); | 
 |  | 
 |     test('renders', () => { | 
 |       const rows = element.$$('tbody').querySelectorAll('tr'); | 
 |       let tds; | 
 |  | 
 |       // The `+ 1` is for the number column, which isn't included in the change | 
 |       // table behavior's list. | 
 |       assert.equal(rows.length, element.columnNames.length + 1); | 
 |       for (let i = 0; i < columns.length; i++) { | 
 |         tds = rows[i + 1].querySelectorAll('td'); | 
 |         assert.equal(tds[0].textContent, columns[i]); | 
 |       } | 
 |     }); | 
 |  | 
 |     test('hide item', () => { | 
 |       const checkbox = element.$$('table tr:nth-child(2) input'); | 
 |       const isChecked = checkbox.checked; | 
 |       const displayedLength = element.displayedColumns.length; | 
 |       assert.isTrue(isChecked); | 
 |  | 
 |       MockInteractions.tap(checkbox); | 
 |       flushAsynchronousOperations(); | 
 |  | 
 |       assert.equal(element.displayedColumns.length, displayedLength - 1); | 
 |     }); | 
 |  | 
 |     test('show item', () => { | 
 |       element.set('displayedColumns', [ | 
 |         'Status', | 
 |         'Owner', | 
 |         'Assignee', | 
 |         'Repo', | 
 |         'Branch', | 
 |         'Updated', | 
 |       ]); | 
 |       flushAsynchronousOperations(); | 
 |       const checkbox = element.$$('table tr:nth-child(2) input'); | 
 |       const isChecked = checkbox.checked; | 
 |       const displayedLength = element.displayedColumns.length; | 
 |       assert.isFalse(isChecked); | 
 |       assert.equal(element.$$('table').style.display, ''); | 
 |  | 
 |       MockInteractions.tap(checkbox); | 
 |       flushAsynchronousOperations(); | 
 |  | 
 |       assert.equal(element.displayedColumns.length, | 
 |           displayedLength + 1); | 
 |     }); | 
 |  | 
 |     test('_getDisplayedColumns', () => { | 
 |       assert.deepEqual(element._getDisplayedColumns(), columns); | 
 |       MockInteractions.tap( | 
 |           element.$$('.checkboxContainer input[name=Assignee]')); | 
 |       assert.deepEqual(element._getDisplayedColumns(), | 
 |           columns.filter(c => c !== 'Assignee')); | 
 |     }); | 
 |  | 
 |     test('_handleCheckboxContainerTap relayes taps to checkboxes', () => { | 
 |       sandbox.stub(element, '_handleNumberCheckboxTap'); | 
 |       sandbox.stub(element, '_handleTargetTap'); | 
 |  | 
 |       MockInteractions.tap( | 
 |           element.$$('table tr:first-of-type .checkboxContainer')); | 
 |       assert.isTrue(element._handleNumberCheckboxTap.calledOnce); | 
 |       assert.isFalse(element._handleTargetTap.called); | 
 |  | 
 |       MockInteractions.tap( | 
 |           element.$$('table tr:last-of-type .checkboxContainer')); | 
 |       assert.isTrue(element._handleNumberCheckboxTap.calledOnce); | 
 |       assert.isTrue(element._handleTargetTap.calledOnce); | 
 |     }); | 
 |  | 
 |     test('_handleNumberCheckboxTap', () => { | 
 |       sandbox.spy(element, '_handleNumberCheckboxTap'); | 
 |  | 
 |       MockInteractions | 
 |           .tap(element.$$('.checkboxContainer input[name=number]')); | 
 |       assert.isTrue(element._handleNumberCheckboxTap.calledOnce); | 
 |       assert.isTrue(element.showNumber); | 
 |  | 
 |       MockInteractions | 
 |           .tap(element.$$('.checkboxContainer input[name=number]')); | 
 |       assert.isTrue(element._handleNumberCheckboxTap.calledTwice); | 
 |       assert.isFalse(element.showNumber); | 
 |     }); | 
 |  | 
 |     test('_handleTargetTap', () => { | 
 |       sandbox.spy(element, '_handleTargetTap'); | 
 |       assert.include(element.displayedColumns, 'Assignee'); | 
 |       MockInteractions | 
 |           .tap(element.$$('.checkboxContainer input[name=Assignee]')); | 
 |       assert.isTrue(element._handleTargetTap.calledOnce); | 
 |       assert.notInclude(element.displayedColumns, 'Assignee'); | 
 |     }); | 
 |   }); | 
 | </script> |