replace gh-select-native with one-way-select (#286)

no issue
- removes `gh-select-native` component as ember-one-way-control's `one-way-select` component offers the same one-way-binding but also allows element attributes to be set

app/components/gh-select-native.js

@@ -1,40 +0,0 @@
-import Component from 'ember-component';
-import {reads} from 'ember-computed';
-
-function K() {
-    return this;
-}
-
-export default Component.extend({
-    content: null,
-    prompt: null,
-    optionValuePath: 'id',
-    optionLabelPath: 'title',
-    selection: null,
-    action: K, // action to fire on change
-
-    // shadow the passed-in `selection` to avoid
-    // leaking changes to it via a 2-way binding
-    _selection: reads('selection'),
-
-    actions: {
-        change() {
-            // jscs:disable requireArrayDestructuring
-            let selectEl = this.$('select')[0];
-            // jscs:enable requireArrayDestructuring
-            let {selectedIndex} = selectEl;
-
-            // decrement index by 1 if we have a prompt
-            let hasPrompt = !!this.get('prompt');
-            let contentIndex = hasPrompt ? selectedIndex - 1 : selectedIndex;
-
-            let selection = this.get('content').objectAt(contentIndex);
-
-            // set the local, shadowed selection to avoid leaking
-            // changes to `selection` out via 2-way binding
-            this.set('_selection', selection);
-
-            this.sendAction('action', selection);
-        }
-    }
-});

app/templates/components/gh-timezone-select.hbs

@@ -1,13 +1,13 @@
 <label for="activeTimezone">Timezone</label>
 <span class="gh-select" data-select-text="{{selectedTimezone.label}}" tabindex="0">
-    {{gh-select-native
+    {{one-way-select
         id="activeTimezone"
         name="general[activeTimezone]"
-        content=selectableTimezones
+        options=selectableTimezones
         optionValuePath="name"
         optionLabelPath="label"
-        selection=selectedTimezone
-        action="setTimezone"
+        value=selectedTimezone
+        update=(action "setTimezone")
     }}
 </span>
 {{#if hasTimezoneOverride}}

app/templates/post-settings-menu.hbs

@@ -67,14 +67,14 @@
                 <label for="author-list">Author</label>
                 <span class="input-icon icon-user">
                     <span class="gh-select" tabindex="0">
-                    {{gh-select-native
-                        name="post-setting-author"
+                    {{one-way-select
                         id="author-list"
-                        content=authors
+                        name="post-setting-author"
+                        options=authors
                         optionValuePath="id"
                         optionLabelPath="name"
-                        selection=selectedAuthor
-                        action="changeAuthor"
+                        value=selectedAuthor
+                        update=(action "changeAuthor")
                     }}
                     </span>
                 </span>

app/templates/team/user.hbs

@@ -115,12 +115,13 @@
                     <div class="form-group">
                         <label for="user-role">Role</label>
                         <span class="gh-select" tabindex="0">
-                            {{gh-select-native id="new-user-role"
-                                content=roles
+                            {{one-way-select
+                                id="new-user-role"
+                                options=roles
                                 optionValuePath="id"
                                 optionLabelPath="name"
-                                selection=model.role
-                                action="changeRole"
+                                value=model.role
+                                update=(action "changeRole")
                             }}
                         </span>
                         <p>What permissions should this user have?</p>

tests/acceptance/editor-test.js

@@ -208,7 +208,7 @@ describe('Acceptance: Editor', function() {
                 find('#activeTimezone option[value="Pacific/Kwajalein"]').prop('selected', true);
             });
 
-            triggerEvent('#activeTimezone select', 'change');
+            triggerEvent('#activeTimezone', 'change');
             // save the settings
             click('.view-header .btn.btn-blue');
 

tests/acceptance/settings/general-test.js

@@ -135,12 +135,12 @@ describe('Acceptance: Settings - General', function () {
             andThen(() => {
                 expect(currentURL(), 'currentURL').to.equal('/settings/general');
 
-                expect(find('#activeTimezone select option').length, 'available timezones').to.equal(66);
+                expect(find('#activeTimezone option').length, 'available timezones').to.equal(66);
                 expect(find('#activeTimezone option:selected').text().trim()).to.equal('(GMT) UTC');
                 find('#activeTimezone option[value="Africa/Cairo"]').prop('selected', true);
             });
 
-            triggerEvent('#activeTimezone select', 'change');
+            triggerEvent('#activeTimezone', 'change');
             click('.view-header .btn.btn-blue');
 
             andThen(() => {

tests/unit/components/gh-select-native-test.js

@@ -1,28 +0,0 @@
-/* jshint expr:true */
-import {expect} from 'chai';
-import {
-    describeComponent,
-    it
-} from 'ember-mocha';
-
-describeComponent(
-    'gh-select-native',
-    'Unit: Component: gh-select-native',
-    {
-        unit: true
-        // specify the other units that are required for this test
-        // needs: ['component:foo', 'helper:bar']
-    },
-    function () {
-        it('renders', function () {
-            // creates the component instance
-            let component = this.subject();
-
-            expect(component._state).to.equal('preRender');
-
-            // renders the component on the page
-            this.render();
-            expect(component._state).to.equal('inDOM');
-        });
-    }
-);